/* design-tokens.css — single source of truth for the Ruta al Mundial visual system.
   SEMANTIC variables only (no scattered hex). styles.css aliases its legacy variable names to these,
   so adopting tokens is ADDITIVE and does not change any rendered value. Dark, sports-focused theme
   with restrained Colombia tricolor accents. PUBLIC, browser-visible: UI values only, no secrets/paths. */
:root{
  /* brand (Colombia tricolor) */
  --color-brand-yellow:#FFD200;
  --color-brand-blue:#0033A0;
  --color-brand-red:#CE1126;

  /* neutrals / surfaces */
  --color-bg:#0b1622;
  --color-surface:#111f31;
  --color-surface-2:#16273d;
  --color-border:#243a57;

  /* text */
  --color-text:#eaf2fb;
  --color-text-muted:#9fb3cc;
  --color-accent:#33c5ff;

  /* status colors (never color-only: always paired with a text label) */
  --color-status-live:#ff5b5b;        /* LIVE      */
  --color-status-final:#9fb3cc;       /* FINAL     */
  --color-status-scheduled:#d4a017;   /* SCHEDULED (gold accent) */
  --color-status-verified:#2ee06a;    /* verified standings */
  --color-status-provisional:#ffc233; /* provisional standings */
  --color-status-warning:#ffc233;     /* warnings / stale */
  --color-status-error:#ff5b5b;       /* errors */

  /* scheduled-card pairings (WCAG AA — see styles.css contrast block) */
  --scheduled-bg:#19233a;
  --scheduled-text:#eef3fb;
  --scheduled-badge-bg:#6e5300;
  --scheduled-badge-text:#ffffff;
  --scheduled-border:#d4a017;
  --scheduled-countdown-text:#ffd86b;

  /* elevation / shape */
  --shadow-card:0 1px 3px rgba(0,0,0,.35);
  --shadow-card-hover:0 3px 10px rgba(0,0,0,.45);
  --radius-card:14px;
  --radius-chip:999px;

  /* spacing scale */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px;
  --space-5:20px; --space-6:24px; --space-7:32px; --space-8:48px;

  /* typography scale */
  --font-sans:-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --fs-xs:11px; --fs-sm:12.5px; --fs-md:14px; --fs-lg:16px; --fs-xl:20px;

  /* focus ring (accessibility) */
  --focus-ring:2px solid #33c5ff;
  --focus-offset:2px;
}
