/* ===== HEXATV · thème clair, actif quand ===== */
html[data-theme="light"] {
--bg: #f4f5f7;
--bg2: #eceef2;
--surface: #ffffff;
--surface2: #f7f8fa;
--line: rgba(12,14,22,.08);
--line2: rgba(12,14,22,.14);
--text: #0b0d12;
--soft: #3a404c;
--muted: #646b79;
--dim: #9aa0ad;
--vt: #587700;
--shadow: 0 1px 2px rgba(12,14,22,.04), 0 12px 32px -16px rgba(12,14,22,.16);
}
/* zones qui restent sombres : photos, lecteur, appel final, pied de page */
html[data-theme="light"] .hero,
html[data-theme="light"] .cta,
html[data-theme="light"] .tile:not(.t-stat),
html[data-theme="light"] .sport-chip,
html[data-theme="light"] .player,
html[data-theme="light"] .pass,
html[data-theme="light"] .footer,
html[data-theme="light"] .topbar,
html[data-theme="light"] .header:not(.scrolled):not(:has(.menu.open)) {
--bg: #06070b;
--bg2: #0a0c12;
--surface: #0f121a;
--surface2: #151924;
--line: rgba(255,255,255,.08);
--line2: rgba(255,255,255,.14);
--text: #f4f5f8;
--soft: #c3c8d3;
--muted: #8d94a4;
--dim: #5d6474;
--vt: #d7ff3a;
color: var(--text);
}
html[data-theme="light"] .header { color: var(--text); }
html[data-theme="light"] .header.scrolled { background: rgba(255,255,255,.8); }
/* ---------- éléments génériques ---------- */
html[data-theme="light"] .btn-glass { background: rgba(12,14,22,.04); }
html[data-theme="light"] .btn-glass:hover { background: rgba(12,14,22,.08); border-color: rgba(12,14,22,.22); }
html[data-theme="light"] .menu a:hover { background: rgba(12,14,22,.06); }
html[data-theme="light"] .theme-toggle,
html[data-theme="light"] .burger { background: rgba(12,14,22,.05); }
html[data-theme="light"] .hero .btn-glass,
html[data-theme="light"] .cta .btn-glass,
html[data-theme="light"] .header:not(.scrolled):not(:has(.menu.open)) .theme-toggle,
html[data-theme="light"] .header:not(.scrolled):not(:has(.menu.open)) .burger { background: rgba(255,255,255,.08); }
html[data-theme="light"] .hero .btn-glass:hover,
html[data-theme="light"] .cta .btn-glass:hover { background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.24); }
html[data-theme="light"] .header:not(.scrolled):not(:has(.menu.open)) .menu a:hover { background: rgba(255,255,255,.07); }
/* ---------- cartes : fond blanc + ombre douce ---------- */
html[data-theme="light"] .match,
html[data-theme="light"] .feature,
html[data-theme="light"] .plan,
html[data-theme="light"] .step,
html[data-theme="light"] .review,
html[data-theme="light"] .device,
html[data-theme="light"] .cmp-card,
html[data-theme="light"] .mail-card,
html[data-theme="light"] .t-stat { box-shadow: var(--shadow); }
html[data-theme="light"] .logo-item { background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); }
html[data-theme="light"] .device span,
html[data-theme="light"] .m-league,
html[data-theme="light"] .cmp-logo { background: #f3f4f6; border: 1px solid var(--line); }
html[data-theme="light"] .stats-grid { background: #fff; border: 1px solid var(--line); border-radius: 24px; box-shadow: var(--shadow); }
html[data-theme="light"] .t-stat { background: linear-gradient(160deg, #eef8cc 0%, #fff 60%); }
html[data-theme="light"] .showcase { background: radial-gradient(70% 60% at 75% 50%, rgba(160,210,0,.12), transparent 70%), var(--bg2); }
html[data-theme="light"] .ticks li > span,
html[data-theme="light"] .f-ic,
html[data-theme="light"] .ad-ic { background: rgba(140,190,0,.14); border-color: rgba(120,170,0,.28); }
html[data-theme="light"] .plan.popular { background: linear-gradient(180deg, #f1fad2 0%, #fff 55%); border-color: rgba(120,170,0,.6); box-shadow: 0 30px 70px -30px rgba(120,170,0,.45); }
html[data-theme="light"] .plan-save { background: rgba(140,190,0,.16); }
html[data-theme="light"] .plan-save.neutral { background: rgba(12,14,22,.05); }
html[data-theme="light"] .step-n { -webkit-text-stroke: 1px rgba(12,14,22,.13); }
html[data-theme="light"] .match.is-live { background: linear-gradient(180deg, rgba(255,59,71,.07), #fff 55%); }
html[data-theme="light"] .m-q { background: rgba(140,190,0,.16); }
html[data-theme="light"] .cmp-save { background: rgba(140,190,0,.12); border-color: rgba(120,170,0,.3); }
html[data-theme="light"] .offers { background: radial-gradient(60% 50% at 50% 0%, rgba(160,210,0,.14), transparent 70%); }
html[data-theme="light"] .compare-sec { background: radial-gradient(50% 60% at 80% 50%, rgba(160,210,0,.1), transparent 70%); }
html[data-theme="light"] .rv-av { background: #f3f4f6; }
html[data-theme="light"] .faq-list details[open] summary .ic { color: var(--volt-ink); }
/* ---------- modale ---------- */
html[data-theme="light"] .modal-box { --surface: #f6f7f9; background: #fff; }
html[data-theme="light"] .modal-backdrop { background: rgba(12,14,22,.45); }
html[data-theme="light"] .modal-close { background: rgba(12,14,22,.05); }
html[data-theme="light"] .modal-close:hover { background: rgba(12,14,22,.1); }
html[data-theme="light"] .addon.on { background: #f3fad9; }
html[data-theme="light"] .switch { background: rgba(12,14,22,.16); }
html[data-theme="light"] .switch:not(:checked)::after { box-shadow: 0 1px 3px rgba(12,14,22,.25); }
html[data-theme="light"] .m-card { background: linear-gradient(90deg, rgba(160,210,0,.14), var(--surface) 70%); border-color: rgba(120,170,0,.5); }
html[data-theme="light"] .m-paypal .m-ic { border: 1px solid var(--line); }
html[data-theme="light"] .pp-word b:first-child { color: #003087; }
html[data-theme="light"] .m-brands i { border: 1px solid var(--line); }
/* ---------- barre mobile + menu mobile ---------- */
html[data-theme="light"] .plan-dots button { background: rgba(12,14,22,.18); }
html[data-theme="light"] .plan-dots button[aria-current="true"] { background: var(--vt); }
@media (max-width: 980px) {
html[data-theme="light"] .menu { background: rgba(255,255,255,.97); }
}
@media (max-width: 640px) {
html[data-theme="light"] .mbar { background: rgba(255,255,255,.88); box-shadow: 0 20px 50px -10px rgba(12,14,22,.35); }
}
/* essai gratuit */
html[data-theme="light"] .pass { --notch: #f4f5f7; }
html[data-theme="light"] .tl-dot { box-shadow: 0 0 0 8px var(--bg), var(--shadow); }
html[data-theme="light"] .timeline::before { background: linear-gradient(90deg, var(--vt), rgba(88,119,0,.12)); }
html[data-theme="light"] .plan li .ic { background: rgba(140,190,0,.16); }
html[data-theme="light"] .menu a[aria-current] { background: rgba(12,14,22,.06); }
html[data-theme="light"] .header:not(.scrolled):not(:has(.menu.open)) .menu a[aria-current] { background: rgba(255,255,255,.1); }
html[data-theme="light"] .modal-steps li.on { border-color: rgba(120,170,0,.5); }
html[data-theme="light"] .promo-ok { background: rgba(140,190,0,.12); border-color: rgba(120,170,0,.4); }
html[data-theme="light"] .promo-banner { background: rgba(140,190,0,.12); border-color: rgba(120,170,0,.45); }
/* « Vous êtes convaincu ? » : carte populaire sombre, comme une mise en avant */
html[data-theme="light"] .after-trial { background: #eef0f4; }
html[data-theme="light"] .ap-card { box-shadow: var(--shadow); }
html[data-theme="light"] .ap-card.popular { background: #0b0d12; color: #f4f5f8; border-color: #0b0d12; box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--vt), 0 24px 50px -24px rgba(12,14,22,.5); }
html[data-theme="light"] .ap-card.popular small { color: #c3c8d3; }
html[data-theme="light"] .ap-card.popular > span:last-child { color: #d7ff3a; }
html[data-theme="light"] .after-pill { background: rgba(140,190,0,.1); border-color: rgba(120,170,0,.3); }