/* ==========================================================================
   LIGHT THEME: active when <html data-theme="light"> (set by assets/theme.js)
   Same structure (type, kickers, pills, sharp cards) on a cool off-white canvas.
   Load after gym.css and fx.css. Attribute selectors outrank the page-level rules.
   ========================================================================== */
:root[data-theme="light"]{
  color-scheme:light;
  --bg:#f3f5f9; --card:#ffffff; --card-2:#eceff5; --muted:#e3e7ef; --border:#d6dbe5;
  --fg:#0b0d12; --fg-2:rgba(11,13,18,.78); --muted-fg:#5b6270; --faint:rgba(11,13,18,.05);
  --accent:#2f6bff; --accent-hover:#1f55e0; --accent-soft:rgba(47,107,255,.12); --accent-line:rgba(47,107,255,.35); --accent-light:#1f55e0;
  --ok:#15803d; --warn:#a16207; --bad:#dc2626;
  --ok-soft:rgba(21,128,61,.12); --warn-soft:rgba(161,98,7,.13); --bad-soft:rgba(220,38,38,.1);
  /* fx */
  --fx-1:#7ea6ff; --fx-2:#b9a6ff; --fx-3:#8ee6ff; --fx-4:#dde5ff;
  --glass-fill:rgba(255,255,255,.55);
  --glass-sheen:linear-gradient(145deg,rgba(255,255,255,.8),rgba(255,255,255,.3) 55%,rgba(255,255,255,.5));
  --glass-line:rgba(255,255,255,.8);
  --glass-hi:inset 0 1px 0 rgba(255,255,255,.95),0 0 0 1px rgba(15,23,42,.06);
  --glass-drop:0 24px 48px -28px rgba(30,41,90,.28);
  /* page-level tokens (admin / app) */
  --line-2:rgba(11,13,18,.1); --fg-3:rgba(11,13,18,.45); --scrim:rgba(15,20,35,.32);
  --glass:rgba(255,255,255,.82); --on-accent:#ffffff;
}

/* Shared components */
:root[data-theme="light"] .btn-outline{border-color:rgba(11,13,18,.18)}
:root[data-theme="light"] .btn-outline:hover{border-color:var(--fg)}
:root[data-theme="light"] .btn-accent{color:#fff}
:root[data-theme="light"] .idx{color:rgba(11,13,18,.35)}
:root[data-theme="light"] .gridlines{background-image:linear-gradient(to right,rgba(11,13,18,.06) 1px,transparent 1px),linear-gradient(to bottom,rgba(11,13,18,.06) 1px,transparent 1px)}
:root[data-theme="light"] .concept-bar{color:#fff}

/* FX in light: pastel motion gradient, frosted-white glass, dark grain */
:root[data-theme="light"] .fx-bg{background:#eef2fa}
:root[data-theme="light"] .fx-bg i{mix-blend-mode:multiply}
:root[data-theme="light"] .fx-bg i:nth-child(1){opacity:.55}
:root[data-theme="light"] .fx-bg i:nth-child(2){opacity:.5}
:root[data-theme="light"] .fx-bg i:nth-child(3){opacity:.45}
:root[data-theme="light"] .fx-bg i:nth-child(4){opacity:.6}
:root[data-theme="light"] .fx-bg::after{background:radial-gradient(ellipse 120% 90% at 50% 40%,transparent 40%,rgba(243,245,249,.75) 100%),linear-gradient(180deg,rgba(255,255,255,.2),rgba(243,245,249,.35))}
:root[data-theme="light"] .fx-grain{filter:invert(1);mix-blend-mode:multiply;opacity:.06}
:root[data-theme="light"] body.fx .chip:not(.on){background:rgba(255,255,255,.55);border-color:rgba(11,13,18,.1)}
:root[data-theme="light"] body.fx .btn-outline{background:rgba(255,255,255,.5);border-color:rgba(11,13,18,.14)}
:root[data-theme="light"] body.fx .btn-primary{box-shadow:0 10px 30px -12px rgba(11,13,18,.35)}
:root[data-theme="light"] body.fx .nav{background:rgba(255,255,255,.55);border-color:rgba(11,13,18,.08)}
:root[data-theme="light"] body.fx .menu{background:rgba(243,245,249,.78)}
:root[data-theme="light"] body.fx .scrim{background:rgba(15,20,35,.22)}
:root[data-theme="light"] body.fx .divider{background:rgba(11,13,18,.08)}

/* Website */
:root[data-theme="light"] .btn-dark .arrow{background:rgba(11,13,18,.06)}
:root[data-theme="light"] .marquee span.o{-webkit-text-stroke:1px rgba(11,13,18,.35)}
:root[data-theme="light"] .phone{border-color:rgba(11,13,18,.14)}
:root[data-theme="light"] .map .cap{background:rgba(255,255,255,.85)}
:root[data-theme="light"] .badge{border-color:rgba(11,13,18,.14)}
/* Photo placeholders stay dark: they stand in for real photography */
:root[data-theme="light"] body.fx .ph{--bg:#05070d;--card-2:#161b2a;--fg:#ffffff;--fg-2:rgba(255,255,255,.82);--accent:#3d7bff;--accent-light:#8fb0ff;color:#fff}
/* Accent CTA band keeps light text on cobalt */
:root[data-theme="light"] .band{color:#fff}
:root[data-theme="light"] .band .kicker b{color:#fff}

/* App (inside the phone). The hardware frame and dynamic island stay black. */
:root[data-theme="light"] body.fx .screen{background:#eef2fa}
:root[data-theme="light"] body.fx .screen .sheet{background:var(--glass-sheen),rgba(255,255,255,.82)}
:root[data-theme="light"] body.fx .screen .seat:not(.tk):not(.sel):not(.mine){background:rgba(11,13,18,.04)}
:root[data-theme="light"] body.fx .screen .tabbar{background:rgba(255,255,255,.6);border-color:rgba(11,13,18,.06)}
:root[data-theme="light"] body.fx .screen .tb-qr{box-shadow:0 0 0 6px rgba(255,255,255,.75),0 12px 34px -6px rgba(47,107,255,.55)}
:root[data-theme="light"] body.fx .screen .ticket .perf::before,:root[data-theme="light"] body.fx .screen .ticket .perf::after{background:#eef2fa}
:root[data-theme="light"] body.fx .jump button.on,:root[data-theme="light"] body.fx .jump button:hover{background:rgba(11,13,18,.05)}
:root[data-theme="light"] .island{background:#000}
:root[data-theme="light"] body.fx .phone{box-shadow:0 40px 120px -30px rgba(47,107,255,.35),0 0 0 1px rgba(11,13,18,.08)}

/* Theme toggle inside the concept bar (all themes) */
.concept-bar{display:flex;align-items:center}
.cb-theme{display:inline-flex;align-items:center;gap:.35rem;font:inherit;letter-spacing:inherit;text-transform:inherit;color:inherit;border:1px solid currentColor;border-radius:999px;padding:1px 9px;line-height:1.5;opacity:.9;flex:none}
.cb-theme:hover{opacity:1}
@media (max-width:640px){
  .concept-bar{display:flex;justify-content:space-between;white-space:nowrap}
  .cb-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .cb-theme span{display:none}
}