/* ==========================================================================
   LIGHT MODE OVERRIDES — Aligned with Elegant Design System v2.0
   Applied when body.light-theme is active.
   ========================================================================== */

/* ===== 1. CORE VARIABLE OVERRIDES ===== */
body.light-theme {
    --ifc-bg-primary:   #f8fafc;
    --ifc-bg-secondary: #ffffff;
    --ifc-bg-elevated:  #f1f5f9;
    --ifc-bg-surface:   rgba(0, 0, 0, 0.02);
    --ifc-bg-glass:     rgba(255, 255, 255, 0.85);

    --ifc-text-primary:   #0f172a;
    --ifc-text-secondary: #475569;
    --ifc-text-muted:     #64748b;

    --ifc-border:        rgba(0, 0, 0, 0.08);
    --ifc-border-hover:  rgba(37, 99, 235, 0.30);
    --ifc-border-subtle: rgba(0, 0, 0, 0.04);

    --ifc-shadow-sm:  0 2px 8px rgba(0, 0, 0, 0.04);
    --ifc-shadow-md:  0 8px 24px rgba(0, 0, 0, 0.08);
    --ifc-shadow-lg:  0 20px 50px rgba(0, 0, 0, 0.10);
    --ifc-shadow-glow: 0 0 30px rgba(37, 99, 235, 0.08);

    /* Legacy variables (for pages still using old tokens) */
    --bg-dark:      #f8fafc !important;
    --bg-darker:    #ffffff !important;
    --bg-card:      rgba(0, 0, 0, 0.04) !important;
    --text-muted:   #64748b !important;
    --text-light:   #0f172a !important;

    background-color: var(--ifc-bg-primary) !important;
    color: var(--ifc-text-primary) !important;
}


/* ===== 2. TYPOGRAPHY ===== */
body.light-theme h1, body.light-theme h2, body.light-theme h3,
body.light-theme h4, body.light-theme h5, body.light-theme h6 {
    color: #0f172a !important;
}

body.light-theme .text-white { color: #0f172a !important; }
body.light-theme .text-white-50 { color: #475569 !important; }
body.light-theme [style*="color: white"],
body.light-theme [style*="color:white"] { color: #0f172a !important; }

body.light-theme .ifc-brand-text,
body.light-theme .brand-name {
    background: linear-gradient(135deg, #0f172a 30%, #334155) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}


/* ===== 3. NAVBAR ===== */
body.light-theme .ifc-navbar {
    background: var(--ifc-bg-glass) !important;
    border-bottom-color: var(--ifc-border) !important;
}

body.light-theme .ifc-navbar.scrolled {
    background: rgba(248, 250, 252, 0.97) !important;
    box-shadow: var(--ifc-shadow-md) !important;
}

body.light-theme .ifc-nav-link {
    color: var(--ifc-text-secondary) !important;
}

body.light-theme .ifc-nav-link:hover,
body.light-theme .ifc-nav-link.active {
    color: var(--ifc-blue) !important;
    background: rgba(37, 99, 235, 0.06) !important;
}

body.light-theme .ifc-nav-link.active::after {
    background: var(--ifc-gradient-brand);
}

body.light-theme .ifc-brand-icon {
    box-shadow: 0 6px 20px rgba(37, 99, 235, 0.20);
}


/* ===== 4. DROPDOWN ===== */
body.light-theme .ifc-dropdown,
body.light-theme .dropdown-menu {
    background: #ffffff !important;
    border-color: var(--ifc-border) !important;
    box-shadow: var(--ifc-shadow-lg) !important;
}

body.light-theme .ifc-dropdown-item {
    color: var(--ifc-text-secondary) !important;
}

body.light-theme .ifc-dropdown-item:hover,
body.light-theme .ifc-dropdown-item.active {
    background: rgba(37, 99, 235, 0.06) !important;
    color: var(--ifc-blue) !important;
}

body.light-theme .ifc-dropdown-icon {
    background: rgba(37, 99, 235, 0.08) !important;
    color: var(--ifc-blue) !important;
}

body.light-theme .ifc-dropdown-item:hover .ifc-dropdown-icon {
    background: var(--ifc-gradient-brand) !important;
    color: #fff !important;
}

body.light-theme .dropdown-divider {
    border-color: rgba(0, 0, 0, 0.06) !important;
}


/* ===== 5. THEME TOGGLE ===== */
body.light-theme .ifc-theme-toggle,
body.light-theme .theme-toggle-btn {
    background: rgba(0, 0, 0, 0.04);
    color: var(--ifc-text-secondary);
    border-color: var(--ifc-border);
}

body.light-theme .ifc-theme-toggle:hover,
body.light-theme .theme-toggle-btn:hover {
    background: rgba(0, 0, 0, 0.08);
    color: var(--ifc-blue);
    border-color: var(--ifc-border-hover);
}

/* Icon states */
.theme-toggle-btn .moon-icon,
.ifc-theme-toggle .moon-icon { display: none; }
.theme-toggle-btn .sun-icon,
.ifc-theme-toggle .sun-icon { display: block; }

body.light-theme .theme-toggle-btn .moon-icon,
body.light-theme .ifc-theme-toggle .moon-icon { display: block; }
body.light-theme .theme-toggle-btn .sun-icon,
body.light-theme .ifc-theme-toggle .sun-icon { display: none; }


/* ===== 6. CARDS & COMPONENTS ===== */
body.light-theme .ifc-card,
body.light-theme .pricing-card,
body.light-theme .service-card,
body.light-theme .contact-info-card,
body.light-theme .contact-form-wrap,
body.light-theme .testimonial-card {
    background: #ffffff !important;
    border-color: var(--ifc-border) !important;
    box-shadow: var(--ifc-shadow-sm) !important;
}

body.light-theme .ifc-card:hover,
body.light-theme .pricing-card:hover,
body.light-theme .service-card:hover {
    box-shadow: var(--ifc-shadow-md) !important;
    border-color: var(--ifc-border-hover) !important;
}

body.light-theme .ifc-glass {
    background: rgba(255, 255, 255, 0.70) !important;
    border-color: var(--ifc-border) !important;
}


/* ===== 7. FORMS ===== */
body.light-theme .form-control {
    background: #ffffff !important;
    color: #0f172a !important;
    border-color: rgba(0, 0, 0, 0.12) !important;
}
body.light-theme .form-control:focus {
    background: #f8fafc !important;
    border-color: var(--ifc-blue) !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.10) !important;
}
body.light-theme .form-control::placeholder {
    color: #94a3b8 !important;
}
body.light-theme select.form-control option {
    background: #ffffff !important;
    color: #0f172a !important;
}


/* ===== 8. TABLES ===== */
body.light-theme .table { color: #1e293b !important; }
body.light-theme th,
body.light-theme td { border-color: rgba(0, 0, 0, 0.08) !important; }


/* ===== 9. FEATURES & PRICING ===== */
body.light-theme .features-list li {
    color: #334155 !important;
    border-color: rgba(0, 0, 0, 0.05) !important;
}

body.light-theme .price-amount { color: #0f172a !important; }
body.light-theme .price-currency,
body.light-theme .price-period { color: #64748b !important; }

body.light-theme .section-tag,
body.light-theme .ifc-tag {
    background: rgba(37, 99, 235, 0.06) !important;
    border-color: rgba(37, 99, 235, 0.15) !important;
    color: var(--ifc-blue) !important;
}


/* ===== 10. TAILWIND OVERRIDES ===== */
body.light-theme .bg-\[\#0f172a\],
body.light-theme .bg-\[\#0b1121\],
body.light-theme .bg-slate-900,
body.light-theme .bg-slate-900\/50,
body.light-theme .bg-slate-900\/80 { background-color: #f8fafc !important; }

body.light-theme .bg-slate-800,
body.light-theme .bg-slate-800\/40,
body.light-theme .bg-slate-800\/50 { background-color: #ffffff !important; }

body.light-theme .bg-slate-700,
body.light-theme .bg-slate-700\/50 { background-color: #f1f5f9 !important; }

body.light-theme .text-slate-200,
body.light-theme .text-slate-300 { color: #334155 !important; }

body.light-theme .text-slate-400,
body.light-theme .text-slate-500 { color: #475569 !important; }

body.light-theme .border-slate-800,
body.light-theme .border-slate-700,
body.light-theme .border-slate-700\/50,
body.light-theme .border-slate-600 { border-color: #e2e8f0 !important; }


/* ===== 11. FOOTER ===== */
body.light-theme .footer,
body.light-theme .ifc-footer {
    background: #ffffff !important;
    border-top-color: var(--ifc-border) !important;
}

body.light-theme .footer h5,
body.light-theme .ifc-footer h5 { color: #0f172a !important; }

body.light-theme .footer-bottom,
body.light-theme .ifc-footer-bottom { border-top-color: var(--ifc-border) !important; }

body.light-theme .footer-logo-text,
body.light-theme .ifc-footer-brand {
    background: linear-gradient(135deg, var(--ifc-blue), var(--ifc-cyan)) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}


/* ===== 12. BUTTONS ===== */
body.light-theme .ifc-btn-outline {
    border-color: rgba(0, 0, 0, 0.12) !important;
    color: var(--ifc-text-secondary) !important;
}

body.light-theme .ifc-btn-outline:hover {
    background: rgba(37, 99, 235, 0.06) !important;
    border-color: var(--ifc-border-hover) !important;
    color: var(--ifc-blue) !important;
}