/* =========================================================
   Light theme for the public pages (index + leaders).
   Load it AFTER style.css / leaders.css. Dark is the default
   look, so this file only does something when the theme is Light.
   ========================================================= */

/* soft fade while the theme flips (class is added by js/settings.js for ~0.45s) */
html.theme-anim body,
html.theme-anim body *:not(canvas):not(video):not(.dock):not(.dock *):not(.sp):not(.sp *):not(.sp-backdrop):not(.reveal):not(.depth-text *) {
  transition:
    background-color 0.35s ease,
    color 0.35s ease,
    border-color 0.35s ease,
    box-shadow 0.35s ease,
    fill 0.35s ease,
    stroke 0.35s ease;
}

html[data-theme="light"] {
  --bg: #f5f3ff;
  --bg-raise: #ffffff;
  --line: rgba(76, 29, 149, 0.18);
  --text: #1b1530;
  --muted: #5a5080;
  --accent: #6d28d9;
  --accent-soft: #6d28d9;
  --accent-ink: #5b21b6;
  color-scheme: light;
}

/* ----- hero ----- */
html[data-theme="light"] .hero.has-video .hero__media video { opacity: 0.38; }
html[data-theme="light"] .hero::before {
  background: radial-gradient(60% 60% at 50% 38%, rgba(124, 58, 237, 0.22), transparent 70%);
}
html[data-theme="light"] .hero.has-video::before {
  background:
    radial-gradient(70% 45% at 50% 45%, rgba(245, 243, 255, 0.7), transparent 75%),
    linear-gradient(180deg, rgba(245, 243, 255, 0.55) 0%, rgba(245, 243, 255, 0.35) 45%, var(--bg) 100%),
    radial-gradient(60% 60% at 50% 38%, rgba(124, 58, 237, 0.2), transparent 70%);
}
html[data-theme="light"] .hero__title #kekwhat:not(.depth-text) {
  color: var(--text);
  text-shadow: 0 0.06em 0.12em rgba(124, 58, 237, 0.35);
}
html[data-theme="light"] .hero__lede { text-shadow: 0 1px 14px rgba(245, 243, 255, 0.9); }
html[data-theme="light"] .chip { background: rgba(124, 58, 237, 0.1); }

/* ----- buttons, cards, lists ----- */
html[data-theme="light"] .btn--ghost { background: rgba(76, 29, 149, 0.06); }
html[data-theme="light"] .btn--ghost:hover { background: rgba(76, 29, 149, 0.12); border-color: rgba(76, 29, 149, 0.35); }
html[data-theme="light"] .news-item { background: #fff; }
html[data-theme="light"] .news-item--pinned {
  border-color: rgba(109, 40, 217, 0.4);
  background: radial-gradient(120% 140% at 0% 0%, rgba(124, 58, 237, 0.16), rgba(124, 58, 237, 0.02) 60%), #fff;
}
html[data-theme="light"] .card { background: linear-gradient(180deg, rgba(124, 58, 237, 0.08), rgba(124, 58, 237, 0.02)), #fff; }
html[data-theme="light"] .join {
  border-color: rgba(109, 40, 217, 0.3);
  background: radial-gradient(120% 140% at 0% 0%, rgba(124, 58, 237, 0.16), rgba(124, 58, 237, 0.02) 60%), #fff;
}
html[data-theme="light"] .steps li { background: #f5f3ff; }
html[data-theme="light"] .player,
html[data-theme="light"] .thumb { background: #fff; }
html[data-theme="light"] .toast { background: #fff; color: #1b1530; border-color: rgba(76, 29, 149, 0.25); box-shadow: 0 10px 30px -12px rgba(30, 20, 70, 0.35); }
html[data-theme="light"] .tag--event { color: #b45309; }
html[data-theme="light"] .tag--recruit { color: #047857; }
html[data-theme="light"] .news-item__poster { background: #ece8fb; }

/* ----- leaders page ----- */
html[data-theme="light"] .leaders__empty { color: var(--muted); }
html[data-theme="light"] .leader:empty { background: rgba(76, 29, 149, 0.06); }
html[data-theme="light"] .footer { color: var(--muted); border-top-color: var(--line); }