/* Pelipuisto — Theme variables (light / dark)
   Include in every page alongside theme.js.
   Games define --g-* defaults inline; this file overrides them for light mode. */

/* Dark defaults for shared button variables */
:root {
  --p-btn-bg: rgba(45, 27, 105, 0.85);
  --p-btn-bg-hover: rgba(45, 27, 105, 1);
  --p-btn-color: #fff;
}

/* ── Light mode overrides ── */
[data-theme="light"] {
  /* Game structural variables (dark defaults live in each game's inline <style>) */
  --g-bg: #f0f2f5;
  --g-bg-end: #e4e7ec;
  --g-text: #1e293b;
  --g-surface: #ffffff;
  --g-overlay: rgba(240, 242, 245, 0.88);
  --g-shadow-text: 0 1px 4px rgba(0,0,0,0.08);
  --g-stage-shadow:
    0 4px 24px rgba(0,0,0,0.10),
    0 0 0 1px rgba(0,0,0,0.06) inset;
  --g-hud-label-opacity: 0.55;

  /* Shared floating buttons (nav, audio, lang-picker) */
  --p-btn-bg: rgba(124, 58, 237, 0.10);
  --p-btn-bg-hover: rgba(124, 58, 237, 0.18);
  --p-btn-color: #7c3aed;
}

/* Override game body gradients in light mode — the dark radial glows look wrong on light bg */
[data-theme="light"] body {
  background: var(--g-bg, #f0f2f5) !important;
}

/* Stage/canvas wrapper */
[data-theme="light"] #stage {
  background: var(--g-surface, #fff) !important;
  box-shadow: 0 4px 24px rgba(0,0,0,0.10), 0 0 0 1px rgba(0,0,0,0.06) inset !important;
}

/* Overlays */
[data-theme="light"] #overlay {
  background: var(--g-overlay, rgba(240,242,245,0.88)) !important;
}

/* Overlay title gradient — darken for visibility on light bg */
[data-theme="light"] #overlay h1 {
  background: linear-gradient(135deg, #6d28d9 0%, #2563eb 60%, #7c3aed 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
}

/* HUD text shadow */
[data-theme="light"] #hud {
  text-shadow: var(--g-shadow-text, none) !important;
}