/* ============================================================
   Dynasty Locker — Shared Design Tokens
   Visual identity per research/color-suggestions.md (§1–2).
   Single source of truth: pages link this BEFORE their inline
   <style>, so page CSS can override per-component if needed.
   ============================================================ */

:root {
  /* ---- Global base (Dark Mode First — avoid pure black) ---- */
  --bg:          #1d1e23;            /* Slate gray base (lighter than carbon black) */
  --surface:     #282a31;            /* Elevated slate — cards / containers */
  --surface-hi:  #32343c;            /* Higher elevation surface */
  --border:      #3a3d46;            /* Gray-blue divider */
  --border-hi:   #494c57;            /* Stronger divider / hover */

  /* ---- Text ---- */
  --text:        #F8F9FA;            /* Off-white — prevents halation */
  --muted:       #8A8D93;            /* Cool gray — secondary text / headers */

  /* ---- Dynamic / status accents ---- */
  --volt:        #CCFF00;            /* High-voltage neon — stat growth */
  --volt-glow:   rgba(204,255,0,0.14);
  --cyan:        #00E5FF;            /* Electric cyan — active states */
  --cyan-glow:   rgba(0,229,255,0.14);
  --green:       #3dba72;            /* Positive / success */
  --red:         #e05252;            /* Negative / alert */

  /* ---- Brand accent — CFB "Turf Green" (overridable per sport/team) ---- */
  --turf:        #2fbf5b;            /* Turf green — bright accent for text, borders, highlights */
  --turf-dim:    #15662f;
  --turf-glow:   rgba(47,191,91,0.14);

  /* Filled buttons / active fills: deeper green + light text so we never
     put dark text on bright green (low contrast / harsh). */
  --accent-fill: #178a3e;            /* Deep turf for large filled controls */
  --on-accent:   #f8f9fa;            /* Text/icon color on an accent fill */
  --logo-chip:   #f4f5f7;            /* Light chip behind team logos so dark-colored marks stay legible */

  /* ---- Hub master brand (multi-sport landing page) ---- */
  --hub:         #f0a500;            /* Dynasty Locker gold */
  --hub-glow:    rgba(240,165,0,0.14);

  /* Active accent: default = hub gold; [data-sport] blocks below override per title. */
  --accent:      var(--hub);
  --accent-glow: var(--hub-glow);

  /* Legacy aliases: existing var(--gold*) refs now resolve to turf green */
  --gold:        var(--turf);
  --gold-dim:    var(--turf-dim);
  --gold-glow:   var(--turf-glow);

  /* Legacy alias kept so existing page CSS keeps resolving */
  --blue:        var(--cyan);

  /* ---- Typography ---- */
  --font-display: 'Bebas Neue', 'Oswald', 'Anton', sans-serif; /* "Jersey" — condensed, all-caps */
  --font-body:    'Barlow', 'Inter', system-ui, sans-serif;     /* "Data" — wide geometric sans */
  --font-mono:    'JetBrains Mono', ui-monospace, monospace;     /* Tabular figures */
}

/* ------------------------------------------------------------
   Game-specific theming. Add data-sport to <html> or <body>
   to retheme the brand accent for that title's hubs.
   (Per §1 "Game-Specific Theming".)
   ------------------------------------------------------------ */
[data-sport="hub"] { --accent: var(--hub);    --accent-glow: var(--hub-glow);  }   /* Dynasty Locker gold */
[data-sport="cfb"] { --accent: var(--turf);   --accent-glow: var(--turf-glow); }   /* Turf green */
[data-sport="nba"] { --accent: #ff8a1e;        --accent-glow: rgba(255,138,30,0.14); } /* Hardwood orange */
[data-sport="nhl"] { --accent: #5ec5ff;        --accent-glow: rgba(94,197,255,0.16); } /* Icy blue */
[data-sport="fc"]  { --accent: #15c9b5;        --accent-glow: rgba(21,201,181,0.16); } /* Pitch teal */
