/* ============================================
   SADEE JODI — Light Mode Theme
   Clean, warm overrides for data-theme="light"
   ============================================ */

/* ---- Light Mode Custom Properties ---- */
[data-theme="light"] {
    /* — Background Colors — */
    --bg-dark: #F0EDF5;
    --bg-body: #FAFAFE;
    --bg-card: #FFFFFF;
    --bg-card-hover: #F8F6FC;
    --bg-surface: #F5F3F8;
    --bg-input: #F0EDF5;
    --bg-overlay: rgba(0, 0, 0, 0.5);

    /* — Text Colors — */
    --text-primary: #1A1A2E;
    --text-secondary: #4A4A6A;
    --text-muted: #8888A0;
    --text-accent: #E91E63;

    /* — Gradients (Light mode adapted) — */
    --gradient-dark: linear-gradient(180deg, #FAFAFE 0%, #F5F3F8 100%);
    --gradient-card: linear-gradient(145deg, #FFFFFF 0%, #F8F6FC 100%);
    --gradient-glass: linear-gradient(135deg, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0.4) 100%);
    --gradient-hero: linear-gradient(160deg, #FAFAFE 0%, #F5F3F8 50%, #FAFAFE 100%);

    /* — Shadows (softer for light mode) — */
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.08);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.1);
    --shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.12);
    --shadow-glow-primary: 0 4px 20px rgba(233, 30, 99, 0.15);
    --shadow-glow-secondary: 0 4px 20px rgba(124, 77, 255, 0.15);
    --shadow-glow-gold: 0 4px 20px rgba(255, 215, 0, 0.2);
    --shadow-card: 0 4px 24px rgba(0, 0, 0, 0.06);
    --shadow-card-hover: 0 8px 40px rgba(233, 30, 99, 0.1);

    /* — Border Colors — */
    --border-color: rgba(0, 0, 0, 0.06);
    --border-color-light: rgba(0, 0, 0, 0.08);
    --border-color-active: rgba(233, 30, 99, 0.4);

    /* — Status Colors — */
    --success: #2E7D32;
    --error: #D32F2F;
    --warning: #F57F17;
    --info: #0277BD;
}

/* ---- Body Background ---- */
[data-theme="light"] body {
    background-color: var(--bg-body);
    color: var(--text-primary);
}

/* Warm ambient glow for Shaadi theme */
[data-theme="light"] body::before {
    background: radial-gradient(ellipse at 20% 50%, rgba(233, 30, 99, 0.03) 0%, transparent 50%),
                radial-gradient(ellipse at 80% 20%, rgba(124, 77, 255, 0.03) 0%, transparent 50%),
                radial-gradient(ellipse at 50% 80%, rgba(233, 30, 99, 0.02) 0%, transparent 50%);
}

/* ---- Scrollbar ---- */
[data-theme="light"] ::-webkit-scrollbar-track {
    background: #F0EDF5;
}

[data-theme="light"] ::-webkit-scrollbar-thumb {
    background: #D0C0D5;
}

[data-theme="light"] ::-webkit-scrollbar-thumb:hover {
    background: var(--primary);
}

/* ---- Selection ---- */
[data-theme="light"] ::selection {
    background: rgba(233, 30, 99, 0.15);
    color: #1A1A2E;
}

/* ---- Links ---- */
[data-theme="light"] a:not(.btn):hover {
    color: var(--primary-dark);
}

/* ---- Headings ---- */
[data-theme="light"] h1,
[data-theme="light"] h2,
[data-theme="light"] h3,
[data-theme="light"] h4,
[data-theme="light"] h5,
[data-theme="light"] h6 {
    color: var(--text-primary);
}

/* ---- Navbar ---- */
[data-theme="light"] .navbar.scrolled {
    background: rgba(255, 248, 240, 0.95);
    border-bottom: 1px solid rgba(233, 30, 99, 0.08);
    box-shadow: 0 2px 20px rgba(233, 30, 99, 0.06);
}

[data-theme="light"] .navbar-brand .brand-text {
    color: var(--text-primary);
}

[data-theme="light"] .navbar-toggle span {
    background: var(--text-primary);
}

/* ---- Ghost Button ---- */
[data-theme="light"] .btn-ghost {
    background: rgba(0, 0, 0, 0.04);
    color: var(--text-primary);
    border: 1px solid rgba(0, 0, 0, 0.1);
}

[data-theme="light"] .btn-ghost:hover {
    background: rgba(0, 0, 0, 0.08);
    border-color: var(--primary);
    color: var(--primary);
}

/* ---- Cards ---- */
[data-theme="light"] .card {
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .card::before {
    background: linear-gradient(90deg, transparent, rgba(0,0,0,0.04), transparent);
}

[data-theme="light"] .card-glass {
    background: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(0, 0, 0, 0.06);
}

/* ---- Form Elements ---- */
[data-theme="light"] .form-input {
    background: var(--bg-input);
    color: var(--text-primary);
    border-color: rgba(0, 0, 0, 0.1);
}

[data-theme="light"] .form-input:focus {
    background: #FFFFFF;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(233, 30, 99, 0.08);
}

[data-theme="light"] .form-input::placeholder {
    color: var(--text-muted);
}

[data-theme="light"] .form-select {
    background-color: var(--bg-input);
    color: var(--text-primary);
    border-color: rgba(0, 0, 0, 0.1);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%234A4A6A' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10l-5 5z'/%3E%3C/svg%3E");
}

[data-theme="light"] .form-textarea {
    background: var(--bg-input);
    color: var(--text-primary);
    border-color: rgba(0, 0, 0, 0.1);
}

/* ---- Footer ---- */
[data-theme="light"] .footer {
    background: #1A1A2E;
    color: #fff;
}

[data-theme="light"] .footer h4 {
    color: #FFFFFF;
}

[data-theme="light"] .footer .footer-brand p {
    color: rgba(255, 255, 255, 0.6);
}

[data-theme="light"] .footer .footer-logo {
    color: #FFFFFF;
}

[data-theme="light"] .footer-column ul li a {
    color: rgba(255, 255, 255, 0.5);
}

[data-theme="light"] .footer-column ul li a:hover {
    color: var(--primary-light);
}

[data-theme="light"] .footer-social a {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.6);
}

[data-theme="light"] .footer-social a:hover {
    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
}

[data-theme="light"] .footer-bottom p {
    color: rgba(255, 255, 255, 0.4);
}

[data-theme="light"] .footer-bottom {
    border-top-color: rgba(255, 255, 255, 0.08);
}

[data-theme="light"] .footer-bottom-links a { color: rgba(255, 255, 255, 0.4); }
[data-theme="light"] .footer-bottom-links a:hover { color: var(--primary-light); }

/* ---- Modal ---- */
[data-theme="light"] .modal-overlay {
    background: rgba(0, 0, 0, 0.45);
}

[data-theme="light"] .modal {
    box-shadow: 0 16px 64px rgba(0, 0, 0, 0.15);
}

[data-theme="light"] .modal-close {
    background: rgba(0, 0, 0, 0.05);
}

[data-theme="light"] .modal-close:hover {
    background: rgba(255, 82, 82, 0.1);
}

/* ---- Badges ---- */
[data-theme="light"] .badge-primary {
    background: rgba(233, 30, 99, 0.06);
    border-color: rgba(233, 30, 99, 0.15);
}

[data-theme="light"] .badge-secondary {
    background: rgba(124, 77, 255, 0.08);
    border-color: rgba(124, 77, 255, 0.2);
}

[data-theme="light"] .badge-success {
    background: rgba(0, 200, 83, 0.08);
    border-color: rgba(0, 200, 83, 0.2);
}

[data-theme="light"] .badge-warning {
    background: rgba(249, 168, 37, 0.08);
    border-color: rgba(249, 168, 37, 0.2);
}

[data-theme="light"] .badge-error {
    background: rgba(229, 57, 53, 0.08);
    border-color: rgba(229, 57, 53, 0.2);
}

/* ---- Toast ---- */
[data-theme="light"] .toast {
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.12);
}

/* ---- Loader ---- */
[data-theme="light"] .loader-overlay {
    background: var(--bg-body);
}

[data-theme="light"] .loader-spinner {
    border-color: rgba(0, 0, 0, 0.1);
    border-top-color: var(--primary);
}

/* ---- Skeleton ---- */
[data-theme="light"] .skeleton {
    background: linear-gradient(90deg, #F0EDF5 25%, #E8E5EE 50%, #F0EDF5 75%);
    background-size: 200% 100%;
}

/* ---- Section Badge ---- */
[data-theme="light"] .section-header .section-badge {
    background: rgba(233, 30, 99, 0.06);
    border-color: rgba(233, 30, 99, 0.12);
}

/* ---- Utility Classes ---- */
[data-theme="light"] .text-white {
    color: var(--text-primary) !important;
}

/* ============================================
   HOME PAGE LIGHT OVERRIDES
   ============================================ */

/* ---- Hero ---- */
[data-theme="light"] .hero {
    background: var(--gradient-hero);
}

[data-theme="light"] .hero::before {
    background: radial-gradient(circle, rgba(233,30,99,0.04) 0%, transparent 70%);
}

[data-theme="light"] .hero::after {
    background: linear-gradient(to top, var(--bg-body), transparent);
}

[data-theme="light"] .hero-badge {
    background: rgba(233, 30, 99, 0.06);
    border-color: rgba(233, 30, 99, 0.12);
}

[data-theme="light"] .hero-badge span {
    color: var(--primary-dark);
}

[data-theme="light"] .hero-float-card {
    background: #FFFFFF;
    border-color: rgba(0, 0, 0, 0.08);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.1);
}

[data-theme="light"] .hero-orbital {
    border-color: rgba(233, 30, 99, 0.1);
}

/* ---- Quick Search ---- */
[data-theme="light"] .quick-search {
    background: var(--bg-surface);
    border-color: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .search-widget {
    background: #FFFFFF;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.08);
}

[data-theme="light"] .search-widget .search-field select,
[data-theme="light"] .search-widget .search-field input {
    background: var(--bg-input);
    border-color: rgba(0, 0, 0, 0.08);
    color: var(--text-primary);
}

/* ---- Steps ---- */
[data-theme="light"] .steps-grid::before {
    background: linear-gradient(90deg, transparent, rgba(0,0,0,0.08), rgba(0,0,0,0.08), transparent);
}

[data-theme="light"] .step-card .step-icon {
    background: linear-gradient(145deg, #FFFFFF 0%, #E8E5EE 100%);
    border-color: rgba(233, 30, 99, 0.06);
    box-shadow: 0 4px 16px rgba(233, 30, 99, 0.06);
}

/* ---- Featured Profiles ---- */
[data-theme="light"] .featured-profiles {
    background: var(--bg-surface);
}

[data-theme="light"] .profile-card {
    background: #FFFFFF;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .profile-card .profile-badge {
    background: rgba(0, 0, 0, 0.5);
}

[data-theme="light"] .profile-card .profile-actions .action-btn {
    background: rgba(0, 0, 0, 0.04);
    border-color: rgba(0, 0, 0, 0.08);
    color: var(--text-secondary);
}

[data-theme="light"] .profile-card .profile-actions .action-btn:hover {
    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
}

/* ---- Stats Section (keep gradient, ensure white text) ---- */
[data-theme="light"] .stats-section {
    background: var(--gradient-primary);
}

[data-theme="light"] .stat-item .stat-count { color: #fff; }
[data-theme="light"] .stat-item .stat-label { color: rgba(255, 255, 255, 0.85); }

/* ---- Success Stories ---- */
[data-theme="light"] .story-card {
    background: #FFFFFF;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

/* ---- Plans ---- */
[data-theme="light"] .plan-card {
    background: #FFFFFF;
    box-shadow: 0 2px 16px rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .plan-card.popular {
    box-shadow: 0 8px 40px rgba(124, 77, 255, 0.2);
    border-color: var(--gold);
}

[data-theme="light"] .plan-card .plan-features li {
    border-bottom-color: rgba(0, 0, 0, 0.04);
}

/* ---- CTA ---- */
[data-theme="light"] .cta-wrapper {
    background: linear-gradient(145deg, #FFFFFF 0%, #E8E5EE 100%);
    box-shadow: 0 4px 30px rgba(233, 30, 99, 0.06);
}

[data-theme="light"] .cta-wrapper::before {
    background: radial-gradient(circle at center, rgba(233,30,99,0.03) 0%, transparent 50%);
}

/* ============================================
   AUTH PAGES LIGHT OVERRIDES (Split-Screen)
   ============================================ */

/* Brand Panel - Light gradient mesh */
[data-theme="light"] .auth-brand-panel {
    background:
        radial-gradient(ellipse at 20% 50%, rgba(233, 30, 99, 0.05) 0%, transparent 50%),
        radial-gradient(ellipse at 80% 20%, rgba(124, 77, 255, 0.04) 0%, transparent 50%),
        radial-gradient(ellipse at 50% 80%, rgba(233, 30, 99, 0.03) 0%, transparent 50%),
        linear-gradient(160deg, #FDFCFD 0%, #E8E5EE 30%, #FDFCFD 60%, #E8E5EE 100%);
    animation: none;
}

[data-theme="light"] .auth-brand-panel::before {
    border-color: rgba(233, 30, 99, 0.1);
}

[data-theme="light"] .auth-brand-panel::after {
    border-color: rgba(124, 77, 255, 0.1);
}

[data-theme="light"] .brand-zone-logo .logo-text-lg {
    color: var(--text-primary);
}

[data-theme="light"] .brand-zone-tagline {
    color: var(--text-primary);
}

[data-theme="light"] .brand-zone-desc {
    color: var(--text-secondary);
}

[data-theme="light"] .auth-illustration .ring-main {
    border-color: rgba(233, 30, 99, 0.2);
}

[data-theme="light"] .auth-illustration .ring-orbit {
    border-color: rgba(124, 77, 255, 0.15);
}

[data-theme="light"] .story-slide {
    background: rgba(0, 0, 0, 0.02);
    border-color: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .story-slide .story-quote {
    color: var(--text-secondary);
}

[data-theme="light"] .story-dots .dot {
    background: rgba(0, 0, 0, 0.1);
}

[data-theme="light"] .trust-badge-item .badge-label {
    color: var(--text-muted);
}

/* Form Panel */
[data-theme="light"] .auth-form-panel {
    background: #FDFCFD;
}

[data-theme="light"] .auth-form-panel::before {
    background: linear-gradient(to bottom, transparent, rgba(233, 30, 99, 0.06), rgba(124, 77, 255, 0.06), transparent);
}

/* Glassmorphic Card -> Solid White */
[data-theme="light"] .auth-card {
    background: #FFFFFF;
    backdrop-filter: none;
    border-color: rgba(0, 0, 0, 0.08);
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.08);
}

[data-theme="light"] .auth-header h2 {
    -webkit-text-fill-color: unset;
    background: none;
    color: var(--primary);
}

/* Tabs */
[data-theme="light"] .auth-tabs {
    background: var(--bg-input);
    border-color: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .auth-tab {
    color: var(--text-muted);
}

[data-theme="light"] .auth-tab:hover:not(.active) {
    color: var(--text-primary);
    background: rgba(0, 0, 0, 0.03);
}

/* Floating Label Inputs */
[data-theme="light"] .form-group-float .form-input-float {
    background: var(--bg-input);
    border-color: rgba(0, 0, 0, 0.1);
    color: var(--text-primary);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

[data-theme="light"] .form-group-float .form-input-float:focus {
    background: #FFFFFF;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(233, 30, 99, 0.08);
    outline: none !important;
}

[data-theme="light"] .form-group-float .form-input-float:hover:not(:focus) {
    border-color: rgba(0, 0, 0, 0.18);
}

[data-theme="light"] .form-group-float .float-label {
    color: var(--text-muted);
}

/* Light theme autofill — floating label inputs */
[data-theme="light"] .form-group-float .form-input-float:-webkit-autofill,
[data-theme="light"] .form-group-float .form-input-float:-webkit-autofill:hover,
[data-theme="light"] .form-group-float .form-input-float:-webkit-autofill:focus {
    -webkit-text-fill-color: var(--text-primary) !important;
    -webkit-box-shadow: 0 0 0 30px var(--bg-input, #F0EDF5) inset !important;
    box-shadow: 0 0 0 30px var(--bg-input, #F0EDF5) inset !important;
    border-color: var(--primary) !important;
    caret-color: var(--text-primary);
}

[data-theme="light"] .auth-card .form-input {
    background: var(--bg-input);
    border-color: rgba(0, 0, 0, 0.1);
    color: var(--text-primary);
}

[data-theme="light"] .auth-card .form-input:focus {
    background: #FFFFFF;
    border-color: var(--primary);
    outline: none !important;
}

/* Light theme autofill — regular form inputs */
[data-theme="light"] .form-input:-webkit-autofill,
[data-theme="light"] .form-input:-webkit-autofill:hover,
[data-theme="light"] .form-input:-webkit-autofill:focus {
    -webkit-text-fill-color: var(--text-primary) !important;
    -webkit-box-shadow: 0 0 0 30px var(--bg-input, #F0EDF5) inset !important;
    box-shadow: 0 0 0 30px var(--bg-input, #F0EDF5) inset !important;
    border-color: var(--primary) !important;
    caret-color: var(--text-primary);
}

[data-theme="light"] .auth-card .form-select {
    background-color: var(--bg-input);
    border-color: rgba(0, 0, 0, 0.1);
    color: var(--text-primary);
    outline: none !important;
}

[data-theme="light"] .auth-card .form-select:focus {
    background-color: #FFFFFF;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgba(233, 30, 99, 0.08);
    outline: none !important;
}

/* Light theme select dropdown options */
[data-theme="light"] .form-select option {
    background: #FFFFFF;
    color: var(--text-primary);
}

[data-theme="light"] .auth-card .form-select option {
    background: #FFFFFF;
    color: var(--text-primary);
}

/* Light theme select autofill */
[data-theme="light"] .form-select:-webkit-autofill,
[data-theme="light"] .form-select:-webkit-autofill:hover,
[data-theme="light"] .form-select:-webkit-autofill:focus {
    -webkit-text-fill-color: var(--text-primary) !important;
    -webkit-box-shadow: 0 0 0 30px var(--bg-input, #F0EDF5) inset !important;
    box-shadow: 0 0 0 30px var(--bg-input, #F0EDF5) inset !important;
    border-color: var(--primary) !important;
}

/* Light theme select arrow (use darker color for visibility) */
[data-theme="light"] .form-select,
[data-theme="light"] .auth-card .form-select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%23555570' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10l-5 5z'/%3E%3C/svg%3E");
}

/* Social Buttons */
[data-theme="light"] .btn-social {
    background: rgba(0, 0, 0, 0.02);
    border-color: rgba(0, 0, 0, 0.08);
    color: var(--text-primary);
    backdrop-filter: none;
}

[data-theme="light"] .btn-social:hover {
    background: rgba(0, 0, 0, 0.04);
    border-color: rgba(0, 0, 0, 0.12);
}

/* Divider */
[data-theme="light"] .auth-divider::before,
[data-theme="light"] .auth-divider::after {
    background: linear-gradient(90deg, transparent, rgba(0, 0, 0, 0.08), transparent);
}

/* Phone input */
[data-theme="light"] .phone-input-group .country-code {
    background: var(--bg-input);
    border-color: rgba(0, 0, 0, 0.1);
    color: var(--text-primary);
}

/* Photo upload */
[data-theme="light"] .photo-upload-area {
    border-color: rgba(0, 0, 0, 0.12);
    background: rgba(0, 0, 0, 0.01);
}

[data-theme="light"] .photo-upload-area:hover {
    border-color: var(--primary);
    background: rgba(233, 30, 99, 0.02);
}

/* Progress steps */
[data-theme="light"] .signup-progress .step-circle {
    background: var(--bg-input);
    border-color: rgba(0, 0, 0, 0.12);
    color: var(--text-muted);
}

[data-theme="light"] .signup-progress .step-line {
    background: rgba(0, 0, 0, 0.1);
}

/* Password toggle */
[data-theme="light"] .input-toggle-float {
    color: var(--text-muted);
}

[data-theme="light"] .input-icon-wrapper .input-toggle {
    color: var(--text-muted);
}

[data-theme="light"] .input-icon-wrapper .input-icon {
    color: var(--text-muted);
}

/* ============================================
   DASHBOARD LIGHT OVERRIDES
   ============================================ */
[data-theme="light"] .sidebar {
    background: #FFFFFF;
    border-right-color: rgba(0, 0, 0, 0.08);
    box-shadow: 2px 0 12px rgba(0, 0, 0, 0.04);
}

[data-theme="light"] .sidebar-header {
    border-bottom-color: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .sidebar-nav .nav-item {
    color: var(--text-secondary);
}

[data-theme="light"] .sidebar-nav .nav-item:hover {
    color: var(--text-primary);
    background: rgba(0, 0, 0, 0.03);
}

[data-theme="light"] .sidebar-nav .nav-item.active {
    color: var(--primary);
    background: rgba(233, 30, 99, 0.04);
}

[data-theme="light"] .sidebar-nav .nav-section {
    color: var(--text-muted);
}

[data-theme="light"] .sidebar-upgrade {
    background: linear-gradient(145deg, #E8E5EE, #F0EDF5);
    border-color: rgba(124, 77, 255, 0.25);
}

[data-theme="light"] .dash-stat-card {
    background: #FFFFFF;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .dash-card {
    background: #FFFFFF;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .profile-completeness {
    background: #FFFFFF;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .completeness-bar {
    background: var(--bg-input);
}

[data-theme="light"] .activity-item {
    background: rgba(0, 0, 0, 0.02);
}

[data-theme="light"] .activity-item:hover {
    background: rgba(0, 0, 0, 0.04);
}

[data-theme="light"] .match-card {
    background: #FFFFFF;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .interest-item {
    background: #FFFFFF;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

[data-theme="light"] .dash-tabs {
    background: var(--bg-input);
}

[data-theme="light"] .dash-tab {
    color: var(--text-muted);
}

[data-theme="light"] .dash-tab:hover:not(.active) {
    color: var(--text-primary);
}

[data-theme="light"] .notif-item {
    background: rgba(0, 0, 0, 0.01);
}

[data-theme="light"] .notif-item.unread {
    background: rgba(233, 30, 99, 0.03);
}

[data-theme="light"] .notif-item:hover {
    background: rgba(0, 0, 0, 0.03);
}

[data-theme="light"] .notif-item .notif-icon {
    background: rgba(0, 0, 0, 0.04);
}

/* ============================================
   SEARCH PAGE LIGHT OVERRIDES
   ============================================ */
[data-theme="light"] .filter-sidebar {
    background: #FFFFFF;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .filter-group {
    border-bottom-color: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .sort-select {
    background: var(--bg-input);
    color: var(--text-primary);
    border-color: rgba(0, 0, 0, 0.08);
}

[data-theme="light"] .view-toggle {
    background: var(--bg-input);
}

[data-theme="light"] .view-toggle button {
    color: var(--text-muted);
}

[data-theme="light"] .pagination .page-btn {
    background: var(--bg-input);
    border-color: rgba(0, 0, 0, 0.08);
    color: var(--text-secondary);
}

/* ============================================
   PROFILE LIGHT OVERRIDES
   ============================================ */
[data-theme="light"] .profile-main-card {
    background: #FFFFFF;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.08);
}

[data-theme="light"] .profile-quick-info .info-chip {
    background: rgba(0, 0, 0, 0.03);
    border-color: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .profile-section {
    background: #FFFFFF;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .match-percentage-card {
    background: rgba(0, 200, 83, 0.04);
    border-color: rgba(0, 200, 83, 0.12);
}

[data-theme="light"] .match-circle::before {
    background: #FFFFFF;
}

/* ============================================
   CHAT LIGHT OVERRIDES
   ============================================ */
[data-theme="light"] .chat-sidebar {
    background: #FFFFFF;
    border-right-color: rgba(0, 0, 0, 0.08);
}

[data-theme="light"] .chat-sidebar-header {
    border-bottom-color: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .chat-search {
    background: var(--bg-input);
    border-color: rgba(0, 0, 0, 0.06);
    color: var(--text-primary);
}

[data-theme="light"] .chat-conv-item {
    border-bottom-color: rgba(0, 0, 0, 0.03);
}

[data-theme="light"] .chat-conv-item:hover {
    background: rgba(0, 0, 0, 0.03);
}

[data-theme="light"] .chat-conv-item.active {
    background: rgba(233, 30, 99, 0.04);
}

[data-theme="light"] .chat-conv-item.unread {
    background: rgba(233, 30, 99, 0.03);
}

[data-theme="light"] .chat-main {
    background: var(--bg-body);
}

[data-theme="light"] .chat-header {
    background: #FFFFFF;
    border-bottom-color: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .chat-date-divider span {
    background: rgba(0, 0, 0, 0.05);
    color: var(--text-muted);
}

[data-theme="light"] .chat-msg.received .msg-bubble {
    background: var(--bg-input);
    color: var(--text-primary);
    border-color: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .chat-input-area {
    background: #FFFFFF;
    border-top-color: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .chat-input-area .chat-input {
    background: var(--bg-input);
    color: var(--text-primary);
    border-color: rgba(0, 0, 0, 0.08);
}

[data-theme="light"] .chat-header-actions button {
    background: rgba(0, 0, 0, 0.04);
    border-color: rgba(0, 0, 0, 0.06);
    color: var(--text-secondary);
}

[data-theme="light"] .chat-input-area .attach-btn {
    background: rgba(0, 0, 0, 0.04);
    border-color: rgba(0, 0, 0, 0.06);
    color: var(--text-muted);
}

/* ============================================
   MEMBERSHIP LIGHT OVERRIDES
   ============================================ */
[data-theme="light"] .plan-card {
    background: #FFFFFF;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .plan-card.diamond {
    background: linear-gradient(145deg, rgba(124, 77, 255, 0.04), #FFFFFF);
}

[data-theme="light"] .plan-features li {
    border-bottom-color: rgba(0, 0, 0, 0.04);
}

[data-theme="light"] .comparison-table {
    background: #FFFFFF;
    box-shadow: 0 2px 16px rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .comparison-table thead th {
    background: rgba(0, 0, 0, 0.02);
    border-bottom-color: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .comparison-table tbody td {
    border-bottom-color: rgba(0, 0, 0, 0.04);
}

[data-theme="light"] .comparison-table tbody tr:hover {
    background: rgba(0, 0, 0, 0.02);
}

[data-theme="light"] .pin-activate-card {
    background: #FFFFFF;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .pin-input-group input {
    background: var(--bg-input);
    border-color: rgba(0, 0, 0, 0.12);
    color: var(--text-primary);
}

[data-theme="light"] .faq-item {
    background: #FFFFFF;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

[data-theme="light"] .faq-question:hover {
    background: rgba(0, 0, 0, 0.02);
}

/* ============================================
   ADMIN PANEL LIGHT OVERRIDES
   ============================================ */
[data-theme="light"] .admin-layout {
    background: var(--bg-body);
}

[data-theme="light"] .admin-sidebar {
    background: #FFFFFF;
    border-right-color: rgba(0, 0, 0, 0.08);
    box-shadow: 2px 0 12px rgba(0, 0, 0, 0.04);
}

[data-theme="light"] .admin-sidebar-header {
    border-bottom-color: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .admin-nav-item {
    color: var(--text-secondary);
}

[data-theme="light"] .admin-nav-item:hover {
    color: var(--text-primary);
    background: rgba(0, 0, 0, 0.03);
}

[data-theme="light"] .admin-nav-item.active {
    color: var(--primary);
    background: rgba(233, 30, 99, 0.04);
}

[data-theme="light"] .admin-sidebar-footer {
    border-top-color: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .admin-auth-page {
    background: var(--bg-body);
}

[data-theme="light"] .admin-auth-card {
    background: #FFFFFF;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.1);
}

[data-theme="light"] .admin-stat {
    background: #FFFFFF;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .admin-card {
    background: #FFFFFF;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .admin-card-header {
    border-bottom-color: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .admin-table th {
    border-bottom-color: rgba(0, 0, 0, 0.08);
}

[data-theme="light"] .admin-table td {
    border-bottom-color: rgba(0, 0, 0, 0.04);
}

[data-theme="light"] .admin-table tr:hover td {
    background: rgba(0, 0, 0, 0.02);
}

[data-theme="light"] .admin-search-bar input {
    background: var(--bg-input);
    border-color: rgba(0, 0, 0, 0.08);
    color: var(--text-primary);
}

[data-theme="light"] .admin-search-bar select {
    background: var(--bg-input);
    border-color: rgba(0, 0, 0, 0.08);
    color: var(--text-primary);
}

[data-theme="light"] .admin-modal {
    background: #FFFFFF;
    box-shadow: 0 16px 64px rgba(0, 0, 0, 0.2);
}

[data-theme="light"] .admin-modal-overlay {
    background: rgba(0, 0, 0, 0.4);
}

[data-theme="light"] .admin-modal-header {
    border-bottom-color: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .admin-modal-footer {
    border-top-color: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .admin-modal-close {
    background: rgba(0, 0, 0, 0.04);
}

[data-theme="light"] .toggle-slider {
    background: rgba(0, 0, 0, 0.12);
}

[data-theme="light"] .feature-toggle-item {
    border-bottom-color: rgba(0, 0, 0, 0.04);
}

[data-theme="light"] .generated-pin {
    background: var(--bg-input);
    border-color: rgba(0, 0, 0, 0.08);
}

[data-theme="light"] .payment-card {
    background: #FFFFFF;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .action-btn {
    border-color: rgba(0, 0, 0, 0.08);
    color: var(--text-secondary);
}

[data-theme="light"] .action-btn:hover {
    background: rgba(0, 0, 0, 0.04);
}

/* ============================================
   AGENT PANEL LIGHT OVERRIDES
   ============================================ */
[data-theme="light"] .agent-layout {
    background: var(--bg-body);
}

[data-theme="light"] .agent-sidebar {
    background: #FFFFFF;
    border-right-color: rgba(0, 0, 0, 0.08);
    box-shadow: 2px 0 12px rgba(0, 0, 0, 0.04);
}

[data-theme="light"] .agent-sidebar-header {
    border-bottom-color: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .agent-sidebar-profile {
    border-bottom-color: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .agent-nav-item {
    color: var(--text-secondary);
}

[data-theme="light"] .agent-nav-item:hover {
    color: var(--text-primary);
    background: rgba(0, 0, 0, 0.03);
}

[data-theme="light"] .agent-nav-item.active {
    color: var(--secondary);
    background: rgba(124, 77, 255, 0.06);
}

[data-theme="light"] .agent-sidebar-footer {
    border-top-color: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .agent-auth-page {
    background: var(--bg-body);
}

[data-theme="light"] .agent-auth-card {
    background: #FFFFFF;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.1);
}

[data-theme="light"] .agent-stat-card {
    background: #FFFFFF;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .agent-card {
    background: #FFFFFF;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .agent-card-header {
    border-bottom-color: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .referral-item {
    border-bottom-color: rgba(0, 0, 0, 0.04);
}

[data-theme="light"] .earnings-box {
    background: rgba(0, 0, 0, 0.02);
    border-color: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .earning-item {
    border-bottom-color: rgba(0, 0, 0, 0.04);
}

[data-theme="light"] .pin-card {
    background: rgba(0, 0, 0, 0.02);
    border-color: rgba(0, 0, 0, 0.06);
}

[data-theme="light"] .pin-card:hover {
    border-color: rgba(124, 77, 255, 0.2);
}

[data-theme="light"] .filter-tabs {
    background: rgba(0, 0, 0, 0.03);
}

[data-theme="light"] .filter-tab {
    color: var(--text-muted);
}

[data-theme="light"] .filter-tab:hover:not(.active) {
    color: var(--text-primary);
}

/* ============================================
   VIDEO CALL LIGHT OVERRIDES
   (Keeping video call mostly dark for better UX)
   ============================================ */
/* Incoming call card */
[data-theme="light"] .incoming-call-card {
    background: #FFFFFF;
    border-color: rgba(0, 0, 0, 0.1);
    box-shadow: 0 25px 80px rgba(0, 0, 0, 0.2);
}

/* ============================================
   THEME TOGGLE BUTTON
   ============================================ */
.theme-toggle-btn {
    position: fixed;
    bottom: 24px;
    right: 24px;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    border: none;
    cursor: pointer;
    z-index: 999;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
    background: linear-gradient(135deg, #1A1A2E, #2A2A4E);
    color: #FFD700;
}

/* Hide floating theme toggle on mobile — theme switching is in the bottom nav */
@media screen and (max-width: 768px) {
    .theme-toggle-btn {
        display: none !important;
    }
}

.theme-toggle-btn:hover {
    transform: scale(1.1) rotate(15deg);
    box-shadow: 0 6px 30px rgba(0, 0, 0, 0.3);
}

.theme-toggle-btn:active {
    transform: scale(0.95);
}

/* Light mode toggle style */
[data-theme="light"] .theme-toggle-btn {
    background: linear-gradient(135deg, #FFD700, #FF9E40);
    color: #1A1A2E;
    box-shadow: 0 4px 20px rgba(255, 215, 0, 0.3);
}

[data-theme="light"] .theme-toggle-btn:hover {
    box-shadow: 0 6px 30px rgba(255, 215, 0, 0.4);
}

/* Toggle icon animation */
.theme-toggle-btn .toggle-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.theme-toggle-btn:hover .toggle-icon {
    transform: rotate(30deg);
}