/* =========================================
   AUTH MODAL - LIGHT MODE OVERRIDES (SAFE)
   ========================================= */

/* Main Modal Container */
body.light-mode .auth-modal-content.auth-split-design {
    background: #ffffff !important;
    border-color: rgba(197, 160, 89, 0.2) !important;
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.15) !important;
}

/* Sides Backgrounds */
body.light-mode .auth-form-side,
body.light-mode .auth-image-side {
    background: #ffffff !important;
}

/* Headings - Force Dark */
body.light-mode .auth-form h3,
body.light-mode .modal h3 {
    color: #000000 !important;
    text-shadow: none !important;
    -webkit-text-fill-color: initial !important;
}

/* Tabs */
body.light-mode .auth-tabs {
    border-bottom-color: rgba(0, 0, 0, 0.1) !important;
}

body.light-mode .auth-tab {
    color: #666666 !important;
}

body.light-mode .auth-tab.active {
    color: #c5a059 !important;
}

body.light-mode .auth-tab:hover:not(.active) {
    color: #333333 !important;
}

/* Form Fields - Light Backgrounds */
body.light-mode .auth-field input,
body.light-mode .auth-form input[type="email"],
body.light-mode .auth-form input[type="password"],
body.light-mode .auth-form input[type="text"] {
    background: #f8f8f8 !important;
    border: 1px solid #dddddd !important;
    color: #333333 !important;
}

body.light-mode .auth-field input:focus,
body.light-mode .auth-form input:focus {
    background: #ffffff !important;
    border-color: #c5a059 !important;
    box-shadow: 0 0 0 3px rgba(197, 160, 89, 0.1) !important;
    color: #000000 !important;
}

/* Labels */
body.light-mode .auth-field label {
    background: #ffffff !important;
    color: #666666 !important;
}

body.light-mode .auth-field input:focus+label {
    color: #c5a059 !important;
}

/* Placeholders */
body.light-mode .auth-field input::placeholder {
    color: #999999 !important;
}

/* Close Button */
body.light-mode .close-auth-modal {
    background: rgba(0, 0, 0, 0.05) !important;
    border-color: rgba(0, 0, 0, 0.1) !important;
    color: #333333 !important;
}

body.light-mode .close-auth-modal:hover {
    background: #c5a059 !important;
    color: #ffffff !important;
    border-color: #c5a059 !important;
}

/* Password Eye Icon */
body.light-mode .toggle-password {
    color: #888888 !important;
}

body.light-mode .toggle-password:hover {
    color: #c5a059 !important;
}

/* Divider / OR */
body.light-mode .auth-divider::before,
body.light-mode .auth-divider::after {
    background: rgba(0, 0, 0, 0.1) !important;
}

body.light-mode .auth-divider span {
    color: #666666 !important;
}

/* Helper Links (Forgot Password) */
body.light-mode .auth-helper a {
    color: #c5a059 !important;
}

body.light-mode .auth-helper a:hover {
    color: #a08040 !important;
}

/* Benefit Cards (Overlay) */
body.light-mode .benefit-item {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0.85)) !important;
    border-color: rgba(197, 160, 89, 0.3) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05) !important;
}

body.light-mode .benefit-text h4 {
    color: #c5a059 !important;
    text-shadow: none !important;
}

body.light-mode .benefit-text p {
    color: #444444 !important;
    text-shadow: none !important;
}

body.light-mode .benefit-icon {
    filter: drop-shadow(0 2px 4px rgba(197, 160, 89, 0.3)) !important;
    color: #c5a059 !important;
}