.form {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.dealerInfo {
  padding-bottom: 12px;
  border-bottom: 1px solid var(--color-border, rgba(148, 163, 184, 0.25));
}

.dealerName {
  font-size: 1rem;
  font-weight: 600;
  color: var(--color-text-primary, #f8fafc);
}

.currentStatus {
  display: flex;
  align-items: center;
  gap: 12px;
}

.label {
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--color-text-secondary, rgba(203, 213, 225, 0.9));
}

.statusBadge {
  display: inline-flex;
  align-items: center;
  padding: 4px 12px;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: capitalize;
}

.statusActive {
  background: rgba(16, 185, 129, 0.2);
  color: #34d399;
}

.statusSuspended {
  background: rgba(239, 68, 68, 0.2);
  color: #f87171;
}

.statusCancelled {
  background: rgba(107, 114, 128, 0.2);
  color: #9ca3af;
}

.statusPending {
  background: rgba(245, 158, 11, 0.2);
  color: #fbbf24;
}

.statusPaymentFailed {
  background: rgba(239, 68, 68, 0.2);
  color: #f87171;
}

.statusDefault {
  background: rgba(148, 163, 184, 0.2);
  color: #94a3b8;
}

.inputGroup {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.select {
  padding: 10px 12px;
  background: rgba(15, 23, 42, 0.6);
  border: 1px solid var(--color-border, rgba(148, 163, 184, 0.25));
  border-radius: 8px;
  font-size: 0.9375rem;
  color: var(--color-text-primary, #f8fafc);
  cursor: pointer;
  transition: border-color 0.2s;
}

.select:focus {
  outline: none;
  border-color: var(--color-primary-accent, #38bdf8);
}

.select:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.textarea {
  padding: 10px 12px;
  background: rgba(15, 23, 42, 0.6);
  border: 1px solid var(--color-border, rgba(148, 163, 184, 0.25));
  border-radius: 8px;
  font-size: 0.9375rem;
  color: var(--color-text-primary, #f8fafc);
  resize: vertical;
  min-height: 80px;
  font-family: inherit;
  transition: border-color 0.2s;
}

.textarea:focus {
  outline: none;
  border-color: var(--color-primary-accent, #38bdf8);
}

.textarea::placeholder {
  color: var(--color-text-tertiary, rgba(148, 163, 184, 0.85));
}

.textarea:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.error {
  font-size: 0.8125rem;
  color: #ef4444;
  margin: 0;
}

.footer {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.buttons {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
}

.cancelButton {
  padding: 10px 20px;
  background: transparent;
  border: 1px solid var(--color-border, rgba(148, 163, 184, 0.25));
  border-radius: 8px;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--color-text-secondary, rgba(203, 213, 225, 0.9));
  cursor: pointer;
  transition: all 0.2s;
}

.cancelButton:hover:not(:disabled) {
  background: rgba(148, 163, 184, 0.15);
  border-color: rgba(148, 163, 184, 0.4);
}

.cancelButton:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.confirmButton {
  padding: 10px 20px;
  background: var(--color-primary-accent, #38bdf8);
  border: none;
  border-radius: 8px;
  font-size: 0.875rem;
  font-weight: 600;
  color: #0f172a;
  cursor: pointer;
  transition: all 0.2s;
}

.confirmButton:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: 0 8px 20px -8px rgba(14, 165, 233, 0.7);
}

.confirmButton:disabled {
  background: rgba(71, 85, 105, 0.4);
  color: rgba(226, 232, 240, 0.65);
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

/* Danger Button - per STYLE_GUIDE.md */
.dangerButton {
  padding: 12px 24px;
  background: var(--color-error, #f87171);
  border: none;
  border-radius: 8px;
  font-size: 0.875rem;
  font-weight: 600;
  color: #ffffff;
  cursor: pointer;
  transition: all 0.2s;
}

.dangerButton:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow: 0 16px 40px -15px rgba(239, 68, 68, 0.85);
}

.dangerButton:active:not(:disabled) {
  transform: translateY(0);
  box-shadow: 0 8px 20px -12px rgba(239, 68, 68, 0.8);
}

.dangerButton:disabled {
  background: rgba(71, 85, 105, 0.4);
  color: rgba(226, 232, 240, 0.65);
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

.warning {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px;
  background: rgba(245, 158, 11, 0.1);
  border: 1px solid rgba(245, 158, 11, 0.3);
  border-radius: 8px;
  font-size: 0.8125rem;
  color: #fbbf24;
}

.warningIcon {
  flex-shrink: 0;
  margin-top: 1px;
}

/* Quick Select View */
.quickSelect {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.currentLabel {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--color-text-tertiary, rgba(148, 163, 184, 0.85));
}

.statusOptions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.statusOption {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border-radius: 999px;
  font-size: 0.8125rem;
  font-weight: 600;
  text-transform: capitalize;
  border: 2px solid transparent;
  cursor: pointer;
  transition: all 0.2s;
}

.statusOption:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px -4px currentColor;
}

.statusOption:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
}

.dangerousOption {
  border-style: dashed;
}

.dangerIcon {
  opacity: 0.8;
}

.savingIndicator {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px;
  color: var(--color-text-secondary, rgba(203, 213, 225, 0.9));
  font-size: 0.875rem;
}

.spinner {
  width: 16px;
  height: 16px;
  border: 2px solid var(--color-border, rgba(148, 163, 184, 0.25));
  border-top-color: var(--color-primary-accent, #38bdf8);
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

/* Confirmation View for Dangerous Actions */
.confirmView {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.warningBanner {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px;
  background: rgba(239, 68, 68, 0.1);
  border: 1px solid rgba(239, 68, 68, 0.3);
  border-radius: 8px;
  font-size: 0.875rem;
  color: #f87171;
}

.optionalFields {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.confirmButtons {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  padding-top: 8px;
  border-top: 1px solid var(--color-border, rgba(148, 163, 184, 0.25));
}

.backButton {
  padding: 10px 20px;
  background: transparent;
  border: 1px solid var(--color-border, rgba(148, 163, 184, 0.25));
  border-radius: 8px;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--color-text-secondary, rgba(203, 213, 225, 0.9));
  cursor: pointer;
  transition: all 0.2s;
}

.backButton:hover:not(:disabled) {
  background: rgba(148, 163, 184, 0.15);
  border-color: rgba(148, 163, 184, 0.4);
}

.backButton:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* Cancellation Options */
.cancellationOptions {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.radioGroup {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.radioOption {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px;
  background: rgba(15, 23, 42, 0.4);
  border: 1px solid var(--color-border, rgba(148, 163, 184, 0.25));
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.2s;
}

.radioOption:hover {
  background: rgba(15, 23, 42, 0.6);
  border-color: rgba(148, 163, 184, 0.4);
}

.radioSelected {
  background: rgba(56, 189, 248, 0.1);
  border-color: var(--color-primary-accent, #38bdf8);
}

.radioInput {
  margin-top: 2px;
  accent-color: var(--color-primary-accent, #38bdf8);
}

.radioContent {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.radioLabel {
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--color-text-primary, #f8fafc);
}

.radioDescription {
  font-size: 0.8125rem;
  color: var(--color-text-tertiary, rgba(148, 163, 184, 0.85));
}
