/* ==========================================================================
   Shared theme tokens.

   The Profile app (Profile/css/main.css) is the source of truth for this
   palette; Dashboard/css/theme.css carries the same values. Keep the three
   in step — if a colour changes there, change it here too.

   Games previously had its own identity: a #1a1a2e→#16213e navy gradient with
   a #4CAF50 Material green accent, and each game picked its own colours on top
   (Snake green, Tiles orange). All chrome now comes from the tokens below, and
   each game keeps exactly one --game-accent for character.
   ========================================================================== */

:root {
  --primary-color: #457b9d;
  --primary-dark: #3d6d8a;
  --accent-color: #a8dadc;
  --accent-light: #d4e8eb;
  --highlight-color: #de4463;

  --bg-body: #f8f9fa;
  --bg-section: #ffffff;
  --bg-card: #ffffff;

  --text-primary: #343a40;
  --text-secondary: #6c757d;
  --text-muted: #868e96;
  --border-color: #dee2e6;

  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.12);
  --shadow-xl: 0 12px 48px rgba(0, 0, 0, 0.15);

  --font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, sans-serif;

  /* Text on the brand gradient (buttons, headers). White in both themes —
     the gradient underneath does not change. */
  --on-primary: #ffffff;

  /* Default accent; each game overrides this one property and nothing else. */
  --game-accent: var(--primary-color);

  /* The play surface inside a game — deliberately a shade off --bg-card so the
     board reads as distinct from the page. */
  --board-bg: #eef2f5;
  --board-line: #cfd8df;
}

[data-theme="dark"] {
  --bg-body: #0d1117;
  --bg-section: #161b22;
  --bg-card: #21262d;

  --text-primary: #f0f6fc;
  --text-secondary: #8b949e;
  --text-muted: #6e7681;
  --border-color: #30363d;

  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.5);
  --shadow-xl: 0 12px 48px rgba(0, 0, 0, 0.6);

  --board-bg: #161b22;
  --board-line: #30363d;
}