/*
 * Huisstijl op één plek: de CORE-tokens uit core-design-system, versie 2 (oktober 2026),
 * context "digitaal" (sites en web-apps): wit, zwarte koppen, één groen, rechte hoeken en
 * de groene bladknop. Zie core-design-system/docs/guides/09-web-en-apps.md.
 * Pas hier kleuren, lettertypen en vormen aan; de rest van de app gebruikt alleen deze variabelen.
 */

@font-face {
  font-family: "Geist";
  src: url("../fonts/Geist-Variable.20491e7e56de.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/*
 * Record Laser (titels) is uitgeschakeld: de weblicentie is nog niet bevestigd.
 * Zodra die rond is: zet RecordLaser-Medium.woff2 in static/fonts/, voeg hier een @font-face
 * voor "Record Laser" (gewicht 500) toe en zet --font-titel hieronder op "Record Laser".
 */

:root {
  /* Merkkleuren v2 */
  --core-wit: #ffffff;
  --core-zwart: #000000;
  --core-donker: #191919;
  --core-grijs: #e9e9e9;
  --core-tekst: #333333;
  --core-groen: #7cfc00; /* limoen: het enige kleuraccent. Tekst erop altijd donker */
  --core-crème: #fff6e1;

  /* Semantische kleuren: dit gebruikt de app */
  --kleur-achtergrond: var(--core-wit);
  --kleur-vlak: var(--core-wit);
  --kleur-vlak-rustig: var(--core-grijs);
  --kleur-kop: var(--core-zwart);
  --kleur-tekst: var(--core-zwart);
  --kleur-tekst-zacht: var(--core-tekst);
  --kleur-lijn: rgb(0 0 0 / 0.12);
  --kleur-lijn-sterk: rgb(0 0 0 / 0.45);
  --kleur-actie: var(--core-groen);
  --kleur-op-actie: var(--core-donker);
  --kleur-donker: var(--core-donker);
  --kleur-op-donker: var(--core-grijs);
  --kleur-accent: var(--core-groen);
  --kleur-succes: var(--core-groen);
  --kleur-fout: var(--core-donker); /* v2: nooit een accentkleur voor fouten */

  /* Typografie: Geist voor koppen en tekst; lopende tekst ruimer (1,4), label in hoofdletters */
  --font-tekst: "Geist", ui-sans-serif, system-ui, sans-serif;
  --font-kop: "Geist", ui-sans-serif, system-ui, sans-serif;
  --font-titel: "Geist", ui-sans-serif, system-ui, sans-serif;
  --regelafstand: 1.2;
  --regelafstand-lopend: 1.4;
  --regelafstand-titel: 1.02; /* 0,92 is gemeten op Record Laser; Geist heeft iets meer nodig */
  --spatiering: -0.01em;
  --spatiering-label: 0.06em;
  --gewicht-kop: 600;

  --tekst-titel: clamp(2.25rem, 1.5rem + 3.6vw, 4.25rem);
  --tekst-kop-1: clamp(1.875rem, 1.4rem + 1.8vw, 2.75rem);
  --tekst-kop-2: clamp(1.375rem, 1.2rem + 0.8vw, 2rem);
  --tekst-kop-3: 1.25rem;
  --tekst-body: 1.0625rem;
  --tekst-klein: 0.875rem;
  --tekst-label: 0.8125rem;

  /* Vormen v2: alles recht en vlak, alleen de hoofdknop heeft de bladvorm */
  --radius: 0;
  --radius-klein: 0;
  --radius-pil: 0;
  --radius-knop: 30px 0;
  --schaduw-focus: 0 0 0 3px var(--core-wit), 0 0 0 5px var(--core-zwart);
  --overgang: 200ms cubic-bezier(0.4, 0, 0.2, 1);

  --ruimte: 1rem;
  --max-breedte: 48rem;
}