/* tokens.css — design tokens (kleuren, maten, schaduwen) voor het giro-spel.
   base.css, components.css, match-cards.css, tables.css, header.css en
   modal.css lezen alleen var(--token) hiervandaan; dit bestand moet als
   eerste geladen worden (zie header.php).
   Kleurenschema: roze (Maglia Rosa, het Giro-beeldmerk).

   Overgenomen uit de :root-tokens die vóór de Fase 1-centralisatie bovenaan
   giro/css/base.css stonden (dat bestand had geen eigen tokens.css) — geen
   nieuwe kleuren verzonnen, dezelfde waarden als voorheen. */
:root {
  /* Merkkleuren */
  --primary: #ff2f72; /* Giro Roze */
  --primary-hover: #d92462;
  --primary-light: #ffe1ec;
  --primary-dark: #a34b67;
  --shade: gold;
  --text-color: #1a1a1d;
  --background: #1a1a1d;
  --white: #f9f9f9;
  --gray-dark: #333333;
  --gray-light: #bfc3c9;

  --accent-green: #00c853;
  --accent-red: #e10600;
  --accent-orange: #ff7f50;
  --accent-secondary: gold;
  --accent-secondary-hover: #e6c200;
  --color-secondary: rgb(0, 0, 0);
  --accent-orange1: #fc6401;

  --font-body: 'Montserrat', sans-serif;

  /* Info boxes */
  --info-box-green: #dff0d8;
  --info-box-red: #f2dede;
  --info-box-yellow: #f5dd27;
  --info-box-border: 4px solid #777;
  --info-box-border-green: 4px solid green;
  --info-box-border-red: 4px solid #e10600;
  --info-box-border-yellow: 4px solid #eed511;

  --table-border: rgba(176, 170, 170, 0.692);
  --table-row-even: rgba(151, 151, 151, 0.14);
  --table-divider: white;

  /* Classificatie-truien (Giro): Maglia Azzurra (bergklassement) is blauw,
     Maglia Ciclamino (puntenklassement) is paars/ciclamino — beide al zo
     gedefinieerd in het oude giro/css/base.css, hier ongewijzigd overgenomen. */
  --mountain-jersey: blue;
  --points-jersey: purple;
  /* Zelfde reden als vuelta/css/tokens.css: alias naar --primary (Maglia
     Rosa valt hier toevallig samen), zodat de gedeelde CSS overal
     var(--gc-jersey) kan gebruiken i.p.v. tour als uitzondering te behandelen. */
  --gc-jersey: var(--primary);
  --gc-jersey-text: var(--white);

  /* Basiskleur voor de "Vergelijk Deelnemers"-grafiek (stats.php) — normaal
     gewoon --primary, apart token zodat tour dit naar --secondary kan
     wijzigen zonder --primary zelf overal aan te passen. */
  --chart-color: var(--primary);

  /* Compat-aliassen voor de gedeelde cycling-CSS (dezelfde namen als
     vuelta/css/tokens.css gebruikt) — wijzen naar bestaande giro-tokens
     i.p.v. een tweede kleurdefinitie te onderhouden. */
  --secondary: var(--shade);
  --header-color: var(--white);
  --background-box: var(--white);
  --box-color-color: var(--primary);
  --text-color-light: var(--white);
  --info-box-gray: #cccccc39;
  --info-box-border-yellow: 4px solid var(--shade);
  --info-box-background: var(--white);

  /* Vormtaal: gedeelde radius/schaduw/transitie-waarden voor dropdowns,
     tabellen, tabs, knoppen en modals. */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-pill: 999px;
  --shadow-sm: 0 1px 3px rgba(10, 30, 64, 0.08);
  --shadow-md: 0 4px 14px rgba(10, 30, 64, 0.12);
  --shadow-lg: 0 12px 32px rgba(10, 30, 64, 0.20);
  --transition-base: 0.2s ease;

  /* Border images/gradients — Italiaanse vlagkleuren, ongewijzigd overgenomen
     uit het oude giro/css/base.css. */
  --border-gradient-country: linear-gradient(to right, #008c45, #008c45, #f4f5f0, #cd212a, #cd212a) 1;
  --border-image-country-header: linear-gradient(to right, #008c45, #008c45, #f4f5f0, #cd212a, #cd212a) 100% 1;
}