/* ================================================================
   AUTH PAGES DARK MODE - Glassmorphic Auth System
   Applied when html.dark is present. Covers login, signup,
   password reset, and all account/ template pages.
   ================================================================ */

/* ===== Body Background ===== */
html.dark body.no-sidebar-shell,
html[data-theme="dark"] body.no-sidebar-shell {
    background: var(--app-flat-fill, #002868) !important;
    color: #e2e8f0 !important;
}

/* ===== Dark CSS Variables Override ===== */
html.dark body.no-sidebar-shell,
html[data-theme="dark"] body.no-sidebar-shell {
    --color-text: var(--app-color-text, #f1f5f9);
    --color-text-secondary: var(--app-color-text-muted, #cbd5e1);
    --color-text-muted: var(--app-color-text-faint, #94a3b8);
    --color-surface: var(--app-color-surface, #1e293b);
    --color-border: var(--app-color-border, #334155);
    --color-primary: var(--app-color-brand, #3f4f5f);
    --color-primary-dark: var(--app-color-brand-hover, #303d4a);
    --glass-bg: rgba(var(--app-neutral-900-rgb, 16, 24, 40), 0.96);
    --glass-border: rgba(var(--app-neutral-400-rgb, 152, 162, 179), 0.18);
    --shadow-md: 0 8px 32px rgba(0, 0, 0, 0.3);
    --shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.4);
    --shadow-btn: 0 4px 14px rgba(0, 0, 0, 0.3);
    --shadow-btn-hover: 0 6px 20px rgba(0, 0, 0, 0.4);
}

/* ===== Auth Card ===== */
html.dark body.no-sidebar-shell .auth-card,
html[data-theme="dark"] body.no-sidebar-shell .auth-card {
    background: var(--glass-bg) !important;
    border-color: var(--glass-border) !important;
    box-shadow: var(--shadow-md) !important;
}

html.dark body.no-sidebar-shell .auth-header::after,
html[data-theme="dark"] body.no-sidebar-shell .auth-header::after {
    background: var(--glass-bg) !important;
}

/* ===== Form Inputs ===== */
html.dark body.no-sidebar-shell .form-input,
html.dark body.no-sidebar-shell .form-select,
html.dark body.no-sidebar-shell input[type="text"],
html.dark body.no-sidebar-shell input[type="email"],
html.dark body.no-sidebar-shell input[type="password"],
html.dark body.no-sidebar-shell input[type="tel"],
html.dark body.no-sidebar-shell input[type="number"],
html.dark body.no-sidebar-shell select,
html.dark body.no-sidebar-shell textarea,
html[data-theme="dark"] body.no-sidebar-shell .form-input,
html[data-theme="dark"] body.no-sidebar-shell .form-select,
html[data-theme="dark"] body.no-sidebar-shell input[type="text"],
html[data-theme="dark"] body.no-sidebar-shell input[type="email"],
html[data-theme="dark"] body.no-sidebar-shell input[type="password"],
html[data-theme="dark"] body.no-sidebar-shell input[type="tel"],
html[data-theme="dark"] body.no-sidebar-shell input[type="number"],
html[data-theme="dark"] body.no-sidebar-shell select,
html[data-theme="dark"] body.no-sidebar-shell textarea {
    background: #0f172a !important;
    border-color: #475569 !important;
    color: #e2e8f0 !important;
}

html.dark body.no-sidebar-shell .form-input:focus,
html.dark body.no-sidebar-shell input:focus,
html.dark body.no-sidebar-shell select:focus,
html.dark body.no-sidebar-shell textarea:focus,
html[data-theme="dark"] body.no-sidebar-shell .form-input:focus,
html[data-theme="dark"] body.no-sidebar-shell input:focus,
html[data-theme="dark"] body.no-sidebar-shell select:focus,
html[data-theme="dark"] body.no-sidebar-shell textarea:focus {
    border-color: #5d6d63 !important;
    background: #1e293b !important;
    box-shadow: 0 0 0 3px rgba(93,109,99, 0.2) !important;
}

html.dark body.no-sidebar-shell .form-input::placeholder,
html.dark body.no-sidebar-shell input::placeholder,
html.dark body.no-sidebar-shell textarea::placeholder,
html[data-theme="dark"] body.no-sidebar-shell .form-input::placeholder,
html[data-theme="dark"] body.no-sidebar-shell input::placeholder,
html[data-theme="dark"] body.no-sidebar-shell textarea::placeholder {
    color: #64748b !important;
}

/* ===== Form Labels ===== */
html.dark body.no-sidebar-shell .form-label,
html.dark body.no-sidebar-shell label,
html[data-theme="dark"] body.no-sidebar-shell .form-label,
html[data-theme="dark"] body.no-sidebar-shell label {
    color: #cbd5e1 !important;
}

/* ===== Remember / Forgot ===== */
html.dark body.no-sidebar-shell .remember-me label,
html[data-theme="dark"] body.no-sidebar-shell .remember-me label {
    color: #94a3b8 !important;
}

/* ===== Error Messages ===== */
html.dark body.no-sidebar-shell .error-message,
html[data-theme="dark"] body.no-sidebar-shell .error-message {
    background: rgba(239, 68, 68, 0.15) !important;
    border-left-color: #ef4444 !important;
    color: #fca5a5 !important;
}

html.dark body.no-sidebar-shell .field-error,
html[data-theme="dark"] body.no-sidebar-shell .field-error {
    color: #fca5a5 !important;
}

/* ===== Success Messages ===== */
html.dark body.no-sidebar-shell .success-message,
html[data-theme="dark"] body.no-sidebar-shell .success-message {
    background: rgba(16, 185, 129, 0.15) !important;
    border-left-color: #10b981 !important;
    color: #6ee7b7 !important;
}

/* ===== Auth Footer / Legal ===== */
html.dark body.no-sidebar-shell .auth-footer,
html[data-theme="dark"] body.no-sidebar-shell .auth-footer {
    color: #94a3b8 !important;
}

html.dark body.no-sidebar-shell .auth-legal,
html[data-theme="dark"] body.no-sidebar-shell .auth-legal {
    color: #64748b !important;
    border-top-color: #334155 !important;
}

/* ===== Lists & Info Boxes ===== */
html.dark body.no-sidebar-shell .info-box,
html.dark body.no-sidebar-shell .alert-info,
html[data-theme="dark"] body.no-sidebar-shell .info-box,
html[data-theme="dark"] body.no-sidebar-shell .alert-info {
    background: rgba(138,121,99, 0.1) !important;
    border-color: #334155 !important;
    color: #93c5fd !important;
}

/* ===== Registration Form Steps ===== */
html.dark body.no-sidebar-shell .step-card,
html.dark body.no-sidebar-shell .wizard-card,
html[data-theme="dark"] body.no-sidebar-shell .step-card,
html[data-theme="dark"] body.no-sidebar-shell .wizard-card {
    background: rgba(30, 41, 59, 0.95) !important;
    border-color: #334155 !important;
}

html.dark body.no-sidebar-shell .step-indicator,
html[data-theme="dark"] body.no-sidebar-shell .step-indicator {
    color: #94a3b8;
}

html.dark body.no-sidebar-shell .step-indicator.active,
html[data-theme="dark"] body.no-sidebar-shell .step-indicator.active {
    color: #a5b4fc;
}

/* ===== Password Strength ===== */
html.dark body.no-sidebar-shell .password-strength,
html[data-theme="dark"] body.no-sidebar-shell .password-strength {
    background: #0f172a !important;
}

/* ===== Social Login Buttons ===== */
html.dark body.no-sidebar-shell .btn-social,
html.dark body.no-sidebar-shell .btn-google,
html[data-theme="dark"] body.no-sidebar-shell .btn-social,
html[data-theme="dark"] body.no-sidebar-shell .btn-google {
    background: #1e293b !important;
    border-color: #475569 !important;
    color: #e2e8f0 !important;
}

html.dark body.no-sidebar-shell .btn-social:hover,
html.dark body.no-sidebar-shell .btn-google:hover,
html[data-theme="dark"] body.no-sidebar-shell .btn-social:hover,
html[data-theme="dark"] body.no-sidebar-shell .btn-google:hover {
    background: #334155 !important;
}

/* ===== Dividers ===== */
html.dark body.no-sidebar-shell .divider,
html.dark body.no-sidebar-shell .auth-divider,
html[data-theme="dark"] body.no-sidebar-shell .divider,
html[data-theme="dark"] body.no-sidebar-shell .auth-divider {
    border-color: #334155 !important;
    color: #64748b !important;
}

html.dark body.no-sidebar-shell .divider span,
html.dark body.no-sidebar-shell .auth-divider span,
html[data-theme="dark"] body.no-sidebar-shell .divider span,
html[data-theme="dark"] body.no-sidebar-shell .auth-divider span {
    background: rgba(30, 41, 59, 0.95) !important;
    color: #64748b !important;
}

/* ===== Select2 ===== */
html.dark body.no-sidebar-shell .select2-container--default .select2-selection--single,
html[data-theme="dark"] body.no-sidebar-shell .select2-container--default .select2-selection--single {
    background-color: #1e293b !important;
    border-color: #475569 !important;
    color: #e2e8f0 !important;
}

html.dark body.no-sidebar-shell .select2-container--default .select2-results__option,
html[data-theme="dark"] body.no-sidebar-shell .select2-container--default .select2-results__option {
    background-color: #1e293b !important;
    color: #e2e8f0 !important;
}

html.dark body.no-sidebar-shell .select2-container--default .select2-results__option--highlighted,
html[data-theme="dark"] body.no-sidebar-shell .select2-container--default .select2-results__option--highlighted {
    background-color: #334155 !important;
}

html.dark body.no-sidebar-shell .select2-dropdown,
html[data-theme="dark"] body.no-sidebar-shell .select2-dropdown {
    background-color: #1e293b !important;
    border-color: #475569 !important;
}

/* ===== Checkboxes ===== */
html.dark body.no-sidebar-shell input[type="checkbox"],
html[data-theme="dark"] body.no-sidebar-shell input[type="checkbox"] {
    accent-color: #5d6d63;
}

/* ===== Suspended / Inactive Pages ===== */
html.dark body.no-sidebar-shell .suspended-card,
html.dark body.no-sidebar-shell .inactive-card,
html[data-theme="dark"] body.no-sidebar-shell .suspended-card,
html[data-theme="dark"] body.no-sidebar-shell .inactive-card {
    background: rgba(30, 41, 59, 0.95) !important;
    border-color: #334155 !important;
}

/* ===== Scrollbar ===== */
html.dark body.no-sidebar-shell ::-webkit-scrollbar-track,
html[data-theme="dark"] body.no-sidebar-shell ::-webkit-scrollbar-track {
    background: #0f172a;
}

html.dark body.no-sidebar-shell ::-webkit-scrollbar-thumb,
html[data-theme="dark"] body.no-sidebar-shell ::-webkit-scrollbar-thumb {
    background: #334155;
}

/* ===== Auth Button ===== */
html.dark body.no-sidebar-shell .btn-auth,
html[data-theme="dark"] body.no-sidebar-shell .btn-auth {
    background: var(--app-color-brand, #3f4f5f) !important;
    color: var(--app-color-text-inverse, #fff) !important;
    box-shadow: var(--shadow-btn) !important;
}

html.dark body.no-sidebar-shell .btn-auth:hover,
html[data-theme="dark"] body.no-sidebar-shell .btn-auth:hover {
    filter: brightness(1.15);
    box-shadow: var(--shadow-btn-hover) !important;
}

/* ===== Auth Header ===== */
html.dark body.no-sidebar-shell .auth-header,
html[data-theme="dark"] body.no-sidebar-shell .auth-header {
    background: var(--app-color-surface-muted, #1d2939) !important;
}

html.dark body.no-sidebar-shell .auth-header h1,
html[data-theme="dark"] body.no-sidebar-shell .auth-header h1 {
    color: var(--app-color-text, #f1f5f9) !important;
}

html.dark body.no-sidebar-shell .auth-header p,
html[data-theme="dark"] body.no-sidebar-shell .auth-header p {
    color: var(--app-color-text-muted, #94a3b8) !important;
}

html.dark body.no-sidebar-shell .auth-header .logo-img,
html[data-theme="dark"] body.no-sidebar-shell .auth-header .logo-img {
    filter: brightness(0) invert(1);
}

/* ===== Links ===== */
html.dark body.no-sidebar-shell .auth-footer a,
html.dark body.no-sidebar-shell .forgot-link,
html[data-theme="dark"] body.no-sidebar-shell .auth-footer a,
html[data-theme="dark"] body.no-sidebar-shell .forgot-link {
    color: var(--app-color-brand-soft, #dde5ee) !important;
}

html.dark body.no-sidebar-shell .auth-legal a,
html[data-theme="dark"] body.no-sidebar-shell .auth-legal a {
    color: var(--app-color-brand-soft, #dde5ee) !important;
}

/* ===== Smooth Transition ===== */
html.dark-transition,
html.dark-transition *,
html.dark-transition *::before,
html.dark-transition *::after {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease !important;
}
