/* ============================================================
   theme-october.css — Saison-Skin "Halloween/October"
   Nur geladen wenn SEASON_THEME === 'october' (config/config.php).
   Rein additiv/ueberschreibend -- keine bestehenden Regeln entfernt,
   damit das normale Theme beim Umschalten (SEASON_THEME = '') wieder
   exakt so aussieht wie vorher. Keine neuen Glow-Bloor-Effekte
   (de-glow-Konvention): alle Akzente sind crisp (0-Blur) oder reine
   Gradient-Fades ohne filter:blur.
   ============================================================ */

/* ── Hero: Nebel hinter dem Ghost ─────────────────────────────
   Liegt im Markup als Geschwister-Element VOR .hero (siehe
   components/hero.php) -- .hero selbst hat overflow:hidden mit
   begrenzter Hoehe, ein Nebel DRIN wuerde dort hart abgeschnitten.
   Keine filter:blur() (gleicher Grund: Blur-Bleed uebersteht keine
   Clip-Grenze sauber) -- die Weichheit kommt rein vom Gradient. */
.hero-fog {
  position: absolute;
  top: 0; bottom: 0;
  left: 50%; width: 100vw;
  transform: translateX(-50%);
  pointer-events: none;
  z-index: 0;
  mix-blend-mode: screen;
}
.hero-fog::before,
.hero-fog::after { content: ''; position: absolute; border-radius: 50%; }
.hero-fog::before {
  width: 760px; height: 760px;
  background: radial-gradient(circle at center, rgba(120,90,255,.30) 0%, rgba(120,90,255,.12) 35%, transparent 70%);
  top: 4%; right: 14%;
  animation: octFogDrift1 22s ease-in-out infinite;
}
.hero-fog::after {
  width: 640px; height: 640px;
  background: radial-gradient(circle at center, rgba(255,130,50,.18) 0%, rgba(255,130,50,.07) 35%, transparent 70%);
  bottom: 6%; right: 26%;
  animation: octFogDrift2 27s ease-in-out infinite;
}
@keyframes octFogDrift1 {
  0%, 100% { transform: translate(0,0) scale(1); }
  50%      { transform: translate(-30px,16px) scale(1.06); }
}
@keyframes octFogDrift2 {
  0%, 100% { transform: translate(0,0) scale(1); }
  50%      { transform: translate(24px,-12px) scale(1.04); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-fog::before, .hero-fog::after { animation: none; }
}

/* ── Bonus-Cards: kleine Saison-Zeile unterm "USE CODE"-Ribbon ── */
.bns-oct-tag {
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 700; font-size: 11px; letter-spacing: .4px;
  text-transform: uppercase; color: #c9a6ff;
  margin: 2px 0 12px;
}

/* ── Full-Standings-Box: Spinnennetz-Ecken ─────────────────────
   Auf .lb-wrap (hat echten Rand + overflow:hidden), NICHT auf
   .lb-podium-zone (die ist absichtlich unsichtbar/"frei auf dem
   Hintergrund" -- siehe Kommentar in leaderboard-podium.css). */
.oct-cobweb {
  position: absolute; width: 82px; height: 82px;
  color: var(--muted2, #8892AA); opacity: .38;
  pointer-events: none; z-index: 2;
}
.oct-cobweb-tl { top: 0; left: 0; }
.oct-cobweb-tr { top: 0; right: 0; transform: scaleX(-1); }

/* ── Champion-Karte (1. Platz): komplett orange statt blau ────
   Krone, Badge-Pill, Avatar-Ring und der aeussere Karten-Ring
   konsistent umgefaerbt, damit es aus einem Guss wirkt statt
   Blau+Orange zu mischen. Silver/Bronze bleiben bewusst normal --
   das 🦇-Praefix im Label (siehe leaderboard.php) reicht dort. */
.p-card.first .p-crown { color: #ff8a3d; }
.p-card.first .p-badge {
  color: #ffb067;
  border-color: rgba(255,138,61,.5);
  background: rgba(255,138,61,.14);
}
.p-card.first .p-avatar {
  border-color: #ff8a3d;
  box-shadow: 0 0 0 4px rgba(255,138,61,.18);
}
.p-card.first {
  box-shadow: 0 0 0 1px rgba(255,138,61,.4), 0 14px 28px -12px rgba(0,0,0,.55);
}

/* ── Countdown ── */
.lb-cd-box { border-color: rgba(255,138,61,.4); }
.lb-cd-num { color: #ff8a3d; }

/* ── "LEADERBOARD"-Titel: eigenes SVG-Icon statt Emoji ─────────
   (Emoji-Font ist OS-abhaengig und unkontrollierbar in Farbe/Stil --
   das Icon ist handgezeichnet wie .p-crown, immer gleich, markenorange.) */
.oct-title-row { display: flex; align-items: center; justify-content: center; gap: 16px; }
.oct-pumpkin-icon { width: 54px; height: auto; flex-shrink: 0; }
@media (max-width: 700px) {
  .oct-pumpkin-icon { width: 36px; }
  .oct-title-row { gap: 10px; }
}

/* ── RTP-Hinweis-Box ── */
.lb-wager-banner { color: #ff8a3d; border-color: rgba(255,138,61,.35); }
.lb-wager-banner span { color: var(--muted2); }

/* ── Unterer "Want a piece of the prize pool?"-Kasten ── */
.lb-cta {
  background: linear-gradient(135deg, rgba(255,138,61,.16), var(--bg2) 70%);
  border-color: rgba(255,138,61,.4);
}
.lb-cta-title span { color: #ff8a3d; }
.lb-cta-sub strong { color: #ff8a3d; }
.lb-cta-code { border-color: rgba(255,138,61,.55); }
.lb-cta-code:hover { border-color: #ff8a3d; }
.lb-cta-code strong { color: #ff8a3d; }
.lb-cta-btn { background: #ff8a3d; box-shadow: 0 5px 18px rgba(255,138,61,.38); }
.lb-cta-btn:hover { box-shadow: 0 8px 26px rgba(255,138,61,.55); }
