/* Light mode for every public page. Dark stays the default (Lance's pick, Oct 22); the sun/moon button
   in the header switches, and the choice is remembered on the visitor's device (theme.js).
   Light palette: a cool white with the logo's own blues, darkened just enough to read on white.
   Every rule is scoped to html[data-theme="light"], so the dark look is untouched. */

/* ---------- the switch (both modes) ---------- */
.top-end { display: flex; align-items: center; gap: 12px; }
.theme-toggle { display: grid; place-items: center; flex: none; width: 44px; height: 44px; padding: 0; border: 1px solid rgba(238, 240, 245, 0.22); border-radius: 50%; background: rgba(7, 8, 11, 0.35); color: inherit; cursor: pointer; transition: background-color 0.25s, border-color 0.25s; }
.theme-toggle:hover { border-color: #5b9ef0; }
.theme-toggle svg { width: 19px; height: 19px; }
.theme-toggle .i-moon { display: none; }
@media (max-width: 420px) { .top-end { gap: 8px; } .theme-toggle { width: 40px; height: 40px; } }

/* ---------- palette ---------- */
html[data-theme="light"] {
  color-scheme: light;
  --ink: #f4f6fa;
  --card: #ffffff;
  --card-2: #eef2f8;
  --on-dark: #14161c;
  --soft: #363c49;
  --muted: #555d6e;
  --dim: #737b8d;
  --blue: #1c62b8;
  --indigo: #3a37a8;
  --blue-fill: #1f6fd0;
  --indigo-fill: #3a37a8;
  --star: #d08f12;
  --bad: #bf3d28;
  --line: rgba(20, 26, 40, 0.12);
  --line-blue: rgba(28, 98, 184, 0.3);
}
html[data-theme="light"] .theme-toggle { border-color: rgba(20, 26, 40, 0.16); background: rgba(255, 255, 255, 0.7); }
html[data-theme="light"] .theme-toggle:hover { border-color: #1c62b8; }
html[data-theme="light"] .theme-toggle .i-sun { display: none; }
html[data-theme="light"] .theme-toggle .i-moon { display: block; }

/* the LSG logo drawn inline: original black and grey lettering, same blue S */
html[data-theme="light"] .logo path[fill="#d9dbe2"] { fill: #3c3c3e; }
html[data-theme="light"] .logo path[fill="#f4f5f8"] { fill: #0e0e10; }

/* italic accent words: the logo's blue to indigo, deep enough for white */
html[data-theme="light"] h1 em, html[data-theme="light"] h2 em, html[data-theme="light"] .v h1 em { background: linear-gradient(100deg, #1c62b8 10%, #3a37a8 90%); -webkit-background-clip: text; background-clip: text; }

/* buttons and fields */
html[data-theme="light"] .btn.ghost { border-color: rgba(28, 98, 184, 0.45); color: var(--on-dark); }
html[data-theme="light"] .btn.ghost:hover { background: rgba(28, 98, 184, 0.08); }
html[data-theme="light"] input[type=text], html[data-theme="light"] input[type=email], html[data-theme="light"] input[type=password], html[data-theme="light"] input[type=date], html[data-theme="light"] input[type=number], html[data-theme="light"] textarea, html[data-theme="light"] select { background-color: #fff; border-color: rgba(28, 98, 184, 0.32); color: var(--on-dark); }
html[data-theme="light"] input::placeholder, html[data-theme="light"] textarea::placeholder { color: #8a91a2; }
html[data-theme="light"] body { background-color: var(--ink); }

/* ---------- home page ---------- */
html[data-theme="light"] .hero-media img { filter: saturate(0.85) contrast(1.02) brightness(0.98); }
html[data-theme="light"] .hero-media::after { background: linear-gradient(to top, var(--ink) 0%, rgba(244, 246, 250, 0.86) 18%, rgba(244, 246, 250, 0.06) 55%, rgba(244, 246, 250, 0.62) 100%); }
@media (min-width: 960px) {
  html[data-theme="light"] .hero-media img { filter: saturate(0.85) contrast(1.02) brightness(0.96); }
  html[data-theme="light"] .hero-media::after { background: linear-gradient(to right, var(--ink) 0%, rgba(244, 246, 250, 0.55) 22%, rgba(244, 246, 250, 0) 55%), linear-gradient(to top, var(--ink) 0%, rgba(244, 246, 250, 0) 32%), linear-gradient(to bottom, rgba(244, 246, 250, 0.6) 0%, rgba(244, 246, 250, 0) 24%); }
}
html[data-theme="light"] .grain { display: none; }
html[data-theme="light"] .reviews { background: linear-gradient(180deg, var(--ink), #e9eef6); }
html[data-theme="light"] .quote { background: #fff; border-color: rgba(20, 26, 40, 0.1); box-shadow: 0 14px 30px -24px rgba(20, 30, 60, 0.35); }
html[data-theme="light"] .car-btn { border-color: rgba(28, 98, 184, 0.4); color: var(--on-dark); }
html[data-theme="light"] .car-btn:hover { background: rgba(28, 98, 184, 0.08); }
html[data-theme="light"] .avvo { border: 1px solid #dfe4ec; box-shadow: 0 12px 28px -18px rgba(20, 30, 60, 0.4); }
html[data-theme="light"] .avvo:hover { box-shadow: 0 16px 34px -18px rgba(20, 30, 60, 0.5); }

/* ---------- reviews page ---------- */
html[data-theme="light"] .gpanel { border: 1px solid #e1e5ec; box-shadow: 0 24px 50px -36px rgba(20, 30, 60, 0.45); }
html[data-theme="light"] .paper { box-shadow: 0 1px 0 rgba(255, 255, 255, 0.6) inset, 0 22px 44px -30px rgba(20, 30, 60, 0.45); border: 1px solid #ebe4d4; }
html[data-theme="light"] .vcard video { background: #0b0c10; }

/* ---------- private review screen ---------- */
html[data-theme="light"] .toast { border: 1px solid #d9dee8; box-shadow: 0 12px 30px rgba(20, 30, 60, 0.2); }
