/* Light mode for every Smart Parlays Galaxy page (member site and launch page).
 * Applies only when <html data-theme="light"> (set by theme.js), so the dark look is untouched.
 * Most colors come from the tokens below; the rest are the few rules with hard-coded dark colors.
 * Combination card art (.cv) stays dark in both modes, like a printed ticket.
 */
:root[data-theme="light"] {
  --bg: #eef2fb;
  --bg-2: #e6ecf8;
  --panel: #ffffff;
  --panel-2: #f5f7fd;
  --panel-3: #e8edf9;
  --line: rgba(36, 56, 140, 0.13);
  --line-strong: rgba(36, 56, 140, 0.24);
  --text: #16203f;
  --muted: #4b5679;
  --faint: #6c7695;
  --violet: #6246ea;
  --cyan: #0e7490;
  --gold: #a16207;
  --green: #047857;
  --red: #c62828;
  --brand: linear-gradient(135deg, #6d4cf5 0%, #3f6df0 50%, #0891b2 100%);
  --shadow: 0 14px 40px rgba(28, 45, 110, 0.12);
  color-scheme: light;
}
:root[data-theme="light"] body {
  background:
    radial-gradient(900px 500px at 85% -10%, rgba(124, 92, 255, .12), transparent 60%),
    radial-gradient(800px 500px at -10% 20%, rgba(34, 211, 238, .10), transparent 60%),
    var(--bg);
  background-attachment: fixed;
}

/* ---- styles.css ---- */
:root[data-theme="light"] .nav { background: rgba(255, 255, 255, .82); }
:root[data-theme="light"] .app-top { background: rgba(255, 255, 255, .9); }
:root[data-theme="light"] .btn:hover { border-color: rgba(36, 56, 140, .35); }
:root[data-theme="light"] .btn-primary { box-shadow: 0 8px 22px rgba(63, 109, 240, .25); }
:root[data-theme="light"] .stat,
:root[data-theme="light"] .feature { background: rgba(255, 255, 255, .78); }
:root[data-theme="light"] .lock-chip { background: rgba(255, 255, 255, .94); }
:root[data-theme="light"] .teaser-over { background: linear-gradient(180deg, rgba(238, 242, 251, .1), rgba(238, 242, 251, .92)); }
:root[data-theme="light"] .footer .rg { background: rgba(251, 191, 36, .12); border-color: rgba(161, 98, 7, .3); color: #78350f; }
:root[data-theme="light"] .badge-21 { border-color: #a16207; }
:root[data-theme="light"] .input,
:root[data-theme="light"] .plan-opt,
:root[data-theme="light"] .chip { background: #fff; }
:root[data-theme="light"] .summary,
:root[data-theme="light"] .mode { background: var(--panel-2); }
:root[data-theme="light"] .sport-tab:not(.on) .n,
:root[data-theme="light"] .pill button { background: rgba(36, 56, 140, .08); }
:root[data-theme="light"] .quick button:hover,
:root[data-theme="light"] .chip[aria-pressed="true"] { color: var(--text); }
:root[data-theme="light"] .ccard .shot .no { color: #e9edff; }
:root[data-theme="light"] .badge.sg { color: #78350f; }
:root[data-theme="light"] .badge.odds { color: #78350f; }
:root[data-theme="light"] .badge.late { color: #991b1b; }
:root[data-theme="light"] .badge.time,
:root[data-theme="light"] .legs-table tr.game-row td { color: #155e75; }
:root[data-theme="light"] .badge.na { color: #991b1b; }
:root[data-theme="light"] .modal-head { background: rgba(255, 255, 255, .96); }
:root[data-theme="light"] .modal-back { background: rgba(22, 32, 63, .55); }
/* card art has its own colors (--cv-* in styles.css) and a member-chosen style; the page mode doesn't touch it */

:root[data-theme="light"] .ex-odds { color: #047857; }
:root[data-theme="light"] .ex-odds.ex-odds-lost { color: #475569; background: #f1f5f9; border-color: #cbd5e1; }
/* ---- matchups.css ---- */
:root[data-theme="light"] .bg-mismatch { color: #78350f; background: #fffbeb; border-color: #f59e0b; }
:root[data-theme="light"] .bg-note,
:root[data-theme="light"] .bg-ver-old,
:root[data-theme="light"] .bg-gh-reg,
:root[data-theme="light"] .bg-same,
:root[data-theme="light"] .bg-stale { color: #78350f; }
:root[data-theme="light"] .bg-gh-pre,
:root[data-theme="light"] .bg-multi,
:root[data-theme="light"] .bg-pgame-h,
:root[data-theme="light"] .bg-loading { color: #155e75; }
:root[data-theme="light"] .bg-wrap .badge.bg-status { color: #5b21b6; }
:root[data-theme="light"] .bg-seg,
:root[data-theme="light"] .bg-pblock,
:root[data-theme="light"] .bg-rk-row { background: var(--panel-2); }
:root[data-theme="light"] .bg-row.bg-alt,
:root[data-theme="light"] .bg-att-row.bg-alt,
:root[data-theme="light"] .bg-props-row.bg-alt { --rb: #f3f6fd; }
:root[data-theme="light"] .bg-pp { color: #047857; }
:root[data-theme="light"] .bg-pp.bg-pp2 { color: #3730a3; }
:root[data-theme="light"] .bg-inj,
:root[data-theme="light"] .bg-warns li,
:root[data-theme="light"] .bg-error { color: #991b1b; }
:root[data-theme="light"] .bg-rkb-s { color: #5b21b6; }
:root[data-theme="light"] .bg-flag-new { color: #047857; }
:root[data-theme="light"] .bg-flag-moved { color: #1d4ed8; }
:root[data-theme="light"] .bg-flag-changed { color: #92400e; }
:root[data-theme="light"] .bg-ver b { color: #0e7490; }
:root[data-theme="light"] .bg-scrim { background: rgba(22, 32, 63, .5); }

/* ---- extras.css ---- */
:root[data-theme="light"] .ex-b-won,
:root[data-theme="light"] .ex-hit .ex-act,
:root[data-theme="light"] .ex-pp { color: #047857; }
:root[data-theme="light"] .ex-b-lost { color: #991b1b; }
:root[data-theme="light"] .ex-miss .ex-act { color: #b91c1c; }
:root[data-theme="light"] .ex-b-pending { color: #78350f; }
:root[data-theme="light"] .ex-game-h { color: #155e75; }

/* ---- the light / dark switch (theme.js) ---- */
.theme-toggle {
  display: inline-grid; place-items: center; flex: none; width: 36px; height: 36px; padding: 0;
  border-radius: 10px; border: 1px solid var(--line-strong); background: var(--panel); color: var(--text); cursor: pointer;
}
.theme-toggle:hover { border-color: var(--cyan); }
.theme-toggle svg { width: 18px; height: 18px; }
/* The icon shows the mode a click switches to: a sun in dark mode, a moon in light mode. */
.theme-toggle .t-moon { display: none; }
:root[data-theme="light"] .theme-toggle .t-moon { display: block; }
:root[data-theme="light"] .theme-toggle .t-sun { display: none; }

:root[data-theme="light"] .due-tag { color: #92400e; background: #fef3c7; border-color: #fcd34d; }

:root[data-theme="light"] .tag-hot { color: #c2410c; background: #ffedd5; border-color: #fdba74; }
:root[data-theme="light"] .tag-chalk { color: #0e7490; background: #cffafe; border-color: #67e8f9; }
:root[data-theme="light"] .tag-long { color: #5b21b6; background: #ede9fe; border-color: #c4b5fd; }