/* LIGHT MODE: COLOR & BACKGROUND ONLY - No layout/sizing overrides */
html[data-theme="light"] body {
    background-color: #f8fafc !important;
    color: #0f1724 !important;
}

html[data-theme="light"] h1, 
html[data-theme="light"] h2, 
html[data-theme="light"] h3,
html[data-theme="light"] h4,
html[data-theme="light"] h5,
html[data-theme="light"] h6 {
    color: #0f1724 !important;
}

html[data-theme="light"] p, 
html[data-theme="light"] span,
html[data-theme="light"] li,
html[data-theme="light"] a {
    color: #0f1724 !important;
}

html[data-theme="light"] .card,
html[data-theme="light"] .benefit-card-new,
html[data-theme="light"] .course-card-refined {
    background-color: rgba(255, 255, 255, 0.8) !important;
    border-color: rgba(26, 168, 225, 0.2) !important;
}

/* Navbar: desktop white, mobile dark */
html[data-theme="light"] .rd-navbar-wrap,
html[data-theme="light"] .rd-navbar-main-outer {
    background: #ffffff !important;
    border-bottom: 1px solid rgba(15,23,36,0.06) !important;
    box-shadow: none !important;
    transition: none !important;
}

html[data-theme="light"] .rd-navbar-aside-outer,
html[data-theme="light"] .nav-link-ref,
html[data-theme="light"] .rd-navbar,
html[data-theme="light"] .rd-navbar-main {
    transition: none !important;
}

/* Ensure top bar stays single line in light mode */
html[data-theme="light"] .top-bar-right {
    flex-wrap: nowrap !important;
    gap: 20px !important;
}

html[data-theme="light"] .item-top,
html[data-theme="light"] .top-text-ref {
    white-space: nowrap !important;
}

/* Mobile: dark header like dark mode */
@media (max-width: 991px) {
    html[data-theme="light"] .rd-navbar-wrap,
    html[data-theme="light"] .rd-navbar-main-outer {
        background: #0f1724 !important;
        border-bottom: none !important;
        box-shadow: 0 2px 4px rgba(0,0,0,0.2) !important;
        transition: none !important;
    }
    html[data-theme="light"] .rd-navbar a,
    html[data-theme="light"] .rd-navbar .rd-navbar-toggle {
        color: #ffffff !important;
    }
    html[data-theme="light"] .top-bar-right {
        gap: 10px !important;
    }
    html[data-theme="light"] .top-text-ref {
        font-size: 10px !important;
    }
}

html[data-theme="light"] .nav-link-ref {
    color: #4a5568 !important;
}

html[data-theme="light"] body { background: #f8fafc; }
html[data-theme="light"] body > .rd-navbar-wrap { background: #ffffff !important; }
}

/* Also remove icon glow on hover in light mode */
html[data-theme="light"] .benefit-card-new:hover .box-icon-orange {
    border-color: transparent !important;
    box-shadow: none !important;
    background: rgba(0,0,0,0.03) !important;
    transform: none !important;
}