/* Local Curio, shared theme: light/dark toggle
 * Dark is the default (defined in each page's own :root). This file adds the
 * toggle button styling + a full LIGHT override keyed on html[data-theme="light"].
 * Loaded on every dark page; selectors that don't exist on a page are ignored.
 */

/* ---- Toggle button (works in both themes via vars) ---- */
header.bar .bar-in { justify-content: flex-start; }   /* brand left, controls right */
header.bar .brand { margin-right: auto; }
.theme-toggle {
  font-family: inherit; cursor: pointer; flex-shrink: 0;
  width: 38px; height: 38px; border-radius: 999px;
  border: 1.5px solid var(--line); background: transparent; color: var(--bone);
  font-size: 16px; line-height: 1; display: inline-flex; align-items: center; justify-content: center;
  transition: border-color .15s ease, transform .12s ease;
}
.theme-toggle:hover { border-color: var(--rust); }
.theme-toggle:active { transform: scale(.94); }
.theme-toggle:focus-visible { outline: 2px solid var(--sun); outline-offset: 2px; }

/* ======================= LIGHT THEME ======================= */
html[data-theme="light"] {
  color-scheme: light;
  --bg: #F4ECDD;          /* cream paper */
  --panel: #FBF6EB;       /* card surface */
  --panel-2: #2B2118;     /* (unused on light) */
  --bone: #1B1714;        /* ink text */
  --bone-dim: #4a3f33;
  --muted: #7a6b58;
  --rust: #C8501E;        /* darker rust for contrast on cream */
  --pitch: #1F5B3E;
  --pitch-deep: #1F5B3E;
  --sun: #9c6a12;         /* readable gold on light */
  --line: #1B171422;
  --line-2: #1B171412;
}

/* base surfaces */
html[data-theme="light"] body {
  color: var(--bone);
  background:
    radial-gradient(900px 500px at 85% -5%, #C8501E12, transparent 60%),
    radial-gradient(700px 500px at -10% 30%, #1F5B3E10, transparent 60%),
    var(--bg);
}
html[data-theme="light"] body::before { opacity: .03; }  /* tame the noise on cream */

/* sticky header */
html[data-theme="light"] header.bar {
  background: linear-gradient(180deg, #F4ECDDf5, #F4ECDDdd);
  border-bottom-color: var(--line);
}

/* buttons, keep rust/green colored ones; lighten the neutral/ghost ones */
html[data-theme="light"] .btn { background: linear-gradient(180deg, #ffffff, #efe6d6); color: var(--bone); }
html[data-theme="light"] .btn.ghost { background: transparent; color: var(--bone); border-color: var(--line); }
html[data-theme="light"] .btn.rust { background: linear-gradient(180deg, #E1632A, #C8501E); color: #fff; }

/* hero chips */
html[data-theme="light"] .chip { background: #1B171408; color: var(--bone-dim); border-color: var(--line); }

/* cards / panels that used hardcoded dark gradients */
html[data-theme="light"] .card,
html[data-theme="light"] .vibe,
html[data-theme="light"] .ptier,
html[data-theme="light"] .match,
html[data-theme="light"] .spot,
html[data-theme="light"] .itin,
html[data-theme="light"] .capture {
  background: linear-gradient(180deg, #ffffff, #FBF6EB);
  border-color: var(--line);
  box-shadow: 0 18px 36px -30px #00000026;
}
html[data-theme="light"] .pay {
  background: linear-gradient(165deg, #FFFFFF, #FBF1E2);
  box-shadow: 0 0 50px -34px #C8501E55;
}
html[data-theme="light"] .upsell {
  background: linear-gradient(165deg, #FFFFFF, #FBF1E2);
  box-shadow: 0 0 50px -34px #C8501E40;
}

/* "locked" vibe badge + empty placeholders */
html[data-theme="light"] .vibe.locked::after { background: #efe6d6; color: var(--muted); border-top-color: var(--line); }
html[data-theme="light"] .spot-img { background: linear-gradient(135deg, #efe6d6, #f6efe0); }

/* inputs (email capture; the VIP form lives on the green panel, so leave it) */
html[data-theme="light"] .form input { background: #ffffff; color: var(--bone); border-color: var(--line); }
html[data-theme="light"] .form input::placeholder { color: var(--muted); }

/* track page: filter bar + chips */
html[data-theme="light"] .filters {
  background: linear-gradient(180deg, #F4ECDDf5, #F4ECDDe8);
  border-top-color: var(--line-2); border-bottom-color: var(--line-2);
}
html[data-theme="light"] .fchip { background: #1B171408; color: var(--bone-dim); border-color: var(--line); }
html[data-theme="light"] .fchip.active { background: var(--rust); color: #fff; border-color: var(--rust); }

/* thanks pages: discount-code block */
html[data-theme="light"] .code-block { background: #FFFFFF; border-color: var(--sun); }

/* Hit / Deep Cut badges + editor's pick in light mode */
html[data-theme="light"] .spot-type.hit { background: #1B171406; color: var(--muted); border-color: var(--line); }
html[data-theme="light"] .editor-note { background: #9c6a1214; }
html[data-theme="light"] .fchip-deep { color: #1F5B3E; border-color: #1F5B3E55; }
html[data-theme="light"] .fchip-deep.active { background: var(--pitch); color: #fff; border-color: var(--pitch); }

/* footers / dividers pick up vars automatically */

/* ── shared site nav + footer + next-step cards ── */
.lc-nav{display:flex;gap:4px;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;justify-content:center;padding:8px 14px;background:#13100B;border-bottom:1px solid #ffffff14;scrollbar-width:none}
.lc-nav::-webkit-scrollbar{display:none}
.lc-nav a{font-family:'Spline Sans Mono',monospace;font-size:12px;letter-spacing:.01em;color:#cdc1ad;text-decoration:none;white-space:nowrap;padding:5px 11px;border-radius:999px;transition:color .15s,background .15s}
.lc-nav a:hover{color:#F4ECDD;background:#ffffff12}
.lc-nav a.vip{color:#E9B24A}
.lc-nav a.vip:hover{background:#E9B24A22}
.lc-foot{padding:20px 16px 32px;text-align:center;border-top:1px solid #ffffff12;background:#13100B}
.lc-foot-links{display:flex;gap:6px 16px;flex-wrap:wrap;justify-content:center}
.lc-foot a{font-family:'Spline Sans Mono',monospace;font-size:12px;color:#cdc1ad;text-decoration:none}
.lc-foot a:hover{color:#F4ECDD;text-decoration:underline}
.lc-foot a.vip{color:#E9B24A}
.lc-foot small{display:block;margin-top:11px;font-family:'Spline Sans Mono',monospace;font-size:10.5px;color:#7a6e5c}
.lc-next{max-width:720px;margin:0 auto;padding:24px 20px 6px}
.lc-next-h{font-family:'Spline Sans Mono',monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#9d8f7a;text-align:center;margin-bottom:12px}
.lc-next-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:560px){.lc-next-row{grid-template-columns:1fr}}
.lc-next-card{display:block;text-decoration:none;border:1px solid #ffffff1c;border-radius:14px;padding:16px 18px;background:#ffffff08;transition:transform .15s,border-color .15s}
.lc-next-card:hover{transform:translateY(-2px);border-color:#E87437}
.lc-next-card .t{display:block;font-family:'Fraunces',serif;font-weight:700;font-size:18px;color:#F4ECDD;line-height:1.12}
.lc-next-card .d{display:block;font-size:13.5px;color:#cdc1ad;margin-top:6px;line-height:1.45}
.lc-next-card .go{display:inline-block;font-family:'Spline Sans Mono',monospace;font-size:12px;color:#E87437;margin-top:10px}
html[data-theme="light"] .lc-nav{background:#efe6d6;border-bottom-color:#0000000f}
html[data-theme="light"] .lc-nav a{color:#5a4f40}
html[data-theme="light"] .lc-nav a:hover{color:#1B1714;background:#0000000a}
html[data-theme="light"] .lc-nav a.vip{color:#9a6a12}
html[data-theme="light"] .lc-foot{background:#efe6d6;border-top-color:#0000000f}
html[data-theme="light"] .lc-foot a{color:#5a4f40}
html[data-theme="light"] .lc-foot a:hover{color:#1B1714}
html[data-theme="light"] .lc-foot a.vip{color:#9a6a12}
html[data-theme="light"] .lc-foot small{color:#9d8f7a}
html[data-theme="light"] .lc-next-card{background:#1B171406;border-color:#00000012}
html[data-theme="light"] .lc-next-card .t{color:#1B1714}
html[data-theme="light"] .lc-next-card .d{color:#4a3f33}