html[data-theme="light"] {
    --bg: #f3f6fa;
    --text: #172033;
    --muted: #5d6878;
    --accent: #e64a2e;
    --accent-2: #f05a3e;
    --card: rgba(255, 255, 255, .92);
    --card-b: rgba(28, 39, 58, .14);
}

html[data-theme="light"] body {
    color: #172033;
    background: #f3f6fa;
}

html[data-theme="light"] a {
    color: #172033;
}

html[data-theme="light"] .bg-animation {
    background:
        radial-gradient(circle at 16% 10%, rgba(230, 74, 46, .07), transparent 24%),
        radial-gradient(circle at 84% 14%, rgba(16, 185, 129, .055), transparent 25%),
        linear-gradient(180deg, #f8fafc 0%, #eef3f8 54%, #eaf0f6 100%);
}

html[data-theme="light"] .bg-animation::before {
    opacity: .16;
    filter: saturate(.75);
}

html[data-theme="light"] .header {
    background: rgba(255, 255, 255, .94);
    border-bottom-color: rgba(28, 39, 58, .1);
    box-shadow: 0 8px 24px rgba(31, 42, 62, .08);
}

html[data-theme="light"] .logo img {
    background: #000;
    border: 1px solid #000;
    box-shadow: 0 6px 16px rgba(0, 0, 0, .18);
}

html[data-theme="light"] .gradient-text,
html[data-theme="light"] .features-comparison h3,
html[data-theme="light"] .plan-recommendation h3,
html[data-theme="light"] .recommendation-item h4 {
    background: linear-gradient(135deg, #d9361f, #e64a2e 52%, #d97706);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

html[data-theme="light"] .section-title,
html[data-theme="light"] .pricing-decision-layout .features-comparison h3,
html[data-theme="light"] .pricing-decision-layout .plan-recommendation h3,
html[data-theme="light"] .faq-question,
html[data-theme="light"] .contact-info-list,
html[data-theme="light"] .contact-info-list a {
    color: #172033;
}

html[data-theme="light"] .nav-links a,
html[data-theme="light"] .section-subtitle,
html[data-theme="light"] .page-hero p,
html[data-theme="light"] .cta-container p,
html[data-theme="light"] .decision-item p,
html[data-theme="light"] .faq-answer,
html[data-theme="light"] .contact-info-list .muted,
html[data-theme="light"] .footer-links a {
    color: #5d6878;
}

html[data-theme="light"] .nav-links a:hover,
html[data-theme="light"] .nav-links a.active {
    color: #172033;
    background: rgba(230, 74, 46, .08);
}

html[data-theme="light"] .pricing-tabs,
html[data-theme="light"] .calculator-container,
html[data-theme="light"] .features-comparison,
html[data-theme="light"] .plan-recommendation,
html[data-theme="light"] .recommendation-item,
html[data-theme="light"] .decision-item,
html[data-theme="light"] .faq-item,
html[data-theme="light"] .contact-card,
html[data-theme="light"] .notice {
    background: rgba(255, 255, 255, .92);
    border-color: rgba(28, 39, 58, .12);
    box-shadow: 0 18px 44px rgba(31, 42, 62, .1);
}

html[data-theme="light"] .pricing-tab {
    color: #5d6878;
}

html[data-theme="light"] .pricing-tab:hover {
    color: #172033;
    background: rgba(230, 74, 46, .08);
}

html[data-theme="light"] .pricing-tab.active {
    color: #fff;
    background: linear-gradient(135deg, #ff6855, #e64a2e);
    border-color: rgba(230, 74, 46, .32);
    box-shadow: 0 10px 24px rgba(230, 74, 46, .18);
}

html[data-theme="light"] .comparison-table th {
    background: #f1f5f9;
    color: #172033;
}

html[data-theme="light"] .comparison-table td {
    color: #344258;
}

html[data-theme="light"] .comparison-table th,
html[data-theme="light"] .comparison-table td {
    border-bottom-color: rgba(28, 39, 58, .1);
}

html[data-theme="light"] .btn-plan,
html[data-theme="light"] .btn-primary,
html[data-theme="light"] .cta-button {
    color: #fff !important;
    background: linear-gradient(135deg, #ff6855, #e64a2e);
    border-color: rgba(230, 74, 46, .28);
    box-shadow: 0 10px 24px rgba(230, 74, 46, .24);
}

html[data-theme="light"] .btn-telegram,
html[data-theme="light"] .btn-discord,
html[data-theme="light"] .btn-linkedin {
    color: #fff !important;
}

html[data-theme="light"] .decision-item h4,
html[data-theme="light"] .faq-question i {
    color: #d9361f;
}

html[data-theme="light"] .footer {
    background: rgba(248, 250, 252, .92);
    border-top-color: rgba(28, 39, 58, .1);
}

html[data-theme="light"] .theme-toggle {
    background: rgba(255, 255, 255, .94);
    border-color: rgba(28, 39, 58, .14);
    color: #172033;
    box-shadow: 0 14px 34px rgba(31, 42, 62, .14);
}

html[data-theme="light"] .theme-toggle-icon {
    color: #172033;
    background: linear-gradient(135deg, #ffd166, #ff9f2d);
}

html[data-theme="light"] .cookie-card {
    background: rgba(255, 255, 255, .98);
    border-color: rgba(28, 39, 58, .14);
    color: #172033;
}

html[data-theme="light"] .cookie-text p {
    color: #5d6878;
}

html[data-theme="light"] .cookie-actions .btn-outline {
    color: #172033;
    border-color: rgba(28, 39, 58, .18);
}

/* Shared light navigation and controls */
html[data-theme="light"] .nav-links a:hover,
html[data-theme="light"] .nav-links a.active,
html[data-theme="light"] .nav-links a[aria-current="page"] {
    color: #172033 !important;
    background: rgba(230, 74, 46, .1);
    text-decoration: none;
}

html[data-theme="light"] .dropdown-menu {
    background: rgba(255, 255, 255, .98) !important;
    border-color: rgba(28, 39, 58, .13) !important;
    box-shadow: 0 18px 42px rgba(31, 42, 62, .14) !important;
}

html[data-theme="light"] .dropdown-menu a {
    color: #344258 !important;
}

html[data-theme="light"] .dropdown-menu a:hover,
html[data-theme="light"] .dropdown-menu a[aria-current="page"] {
    color: #172033 !important;
    background: rgba(230, 74, 46, .1) !important;
}

html[data-theme="light"] .footer-links a:hover {
    color: #d9361f !important;
    text-decoration: none;
}

html[data-theme="light"] .notice {
    color: #8f2d1c !important;
    background: linear-gradient(135deg, #fff4ef, #ffffff) !important;
    border-color: rgba(230, 74, 46, .22) !important;
    box-shadow: 0 12px 30px rgba(230, 74, 46, .08) !important;
}

html[data-theme="light"] .notice i {
    color: #d9361f !important;
}

@media (max-width: 1024px) {
    html[data-theme="light"] .nav-toggle {
        background: #fff;
        border-color: rgba(28, 39, 58, .16);
        box-shadow: 0 8px 20px rgba(31, 42, 62, .08);
    }

    html[data-theme="light"] .nav-toggle .bar {
        background: #172033;
    }

    html[data-theme="light"] .nav-links {
        background: rgba(255, 255, 255, .98) !important;
        border-color: rgba(28, 39, 58, .13) !important;
    }

    html[data-theme="light"] .nav-links a {
        color: #344258 !important;
    }
}

@media (max-width: 1024px) {
    html[data-theme="light"] .nav-links {
        background: rgba(255, 255, 255, .98);
        border-color: rgba(28, 39, 58, .13);
    }
}
