/* NKTO guest authentication modal — all HTMX steps share the same root.
   Loaded last to override legacy hard-coded white surfaces and dark-only text. */
#auth-backdrop { color: var(--text-primary); }
#auth-backdrop .modal-card,
#auth-backdrop .auth-modal {
  background: radial-gradient(circle at 14% 0%, rgba(52, 152, 219, .12), transparent 38%), var(--surface) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-subtle) !important;
  box-shadow: 0 28px 90px rgba(0, 0, 0, .35);
}
#auth-backdrop #auth-modal-body,
#auth-backdrop #auth-modal-body .auth-step,
#auth-backdrop #auth-modal-body .auth-success,
#auth-backdrop #auth-modal-body form {
  background: transparent;
  color: var(--text-primary) !important;
}
#auth-backdrop #auth-modal-body h2,
#auth-backdrop #auth-modal-body label,
#auth-backdrop #auth-modal-body .auth-phone-preview strong,
#auth-backdrop #auth-modal-body .auth-success p {
  color: var(--text-primary) !important;
}
#auth-backdrop #auth-modal-body p,
#auth-backdrop #auth-modal-body .hint,
#auth-backdrop #auth-modal-body .auth-step p,
#auth-backdrop #auth-modal-body .auth-phone-preview span {
  color: var(--text-muted) !important;
}
#auth-backdrop .modal-close,
#auth-backdrop .auth-modal__header button {
  background: var(--surface-soft) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-subtle) !important;
}
#auth-backdrop .modal-close:hover,
#auth-backdrop .auth-modal__header button:hover {
  background: var(--danger-soft) !important;
  color: var(--text-primary) !important;
}
#auth-backdrop #auth-modal-body .nk-input {
  background: var(--control-bg) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-strong) !important;
}
#auth-backdrop #auth-modal-body .nk-input::placeholder { color: var(--text-muted) !important; }
#auth-backdrop #auth-modal-body .auth-phone-preview {
  background: var(--surface-strong) !important;
  border-color: var(--border-subtle) !important;
}
#auth-backdrop #auth-modal-body .auth-secondary-single,
#auth-backdrop #auth-modal-body .auth-secondary-actions { border-color: var(--border-subtle) !important; }
#auth-backdrop #auth-modal-body .auth-secondary-btn,
#auth-backdrop #auth-modal-body .btn-ghost {
  background: var(--surface-soft) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-strong) !important;
}
#auth-backdrop #auth-modal-body .auth-secondary-btn:hover,
#auth-backdrop #auth-modal-body .btn-ghost:hover { background: var(--control-bg-hover) !important; }
#auth-backdrop #auth-modal-body .btn-primary,
#auth-backdrop #auth-modal-body .auth-submit-btn {
  background: linear-gradient(135deg, #3498db, #2575fc) !important;
  color: #fff !important;
}
#auth-backdrop #auth-modal-body .alert--error {
  background: var(--danger-soft) !important;
  color: var(--text-primary) !important;
  border: 1px solid rgba(239,68,68,.5) !important;
}
#auth-backdrop #auth-modal-body .alert--info {
  background: var(--info-soft) !important;
  color: var(--text-primary) !important;
  border: 1px solid rgba(52,152,219,.45) !important;
}
#auth-backdrop #auth-modal-body input[type="radio"] { accent-color: #3498db; }
#auth-backdrop #auth-modal-body .auth-step__icon { color: #fff !important; }