/* suite-ui v12 — GESYNCT BESTAND, niet handmatig bewerken; bron: automation/agents/suite-ui */
/* suite-ui · tokens.css — generieke design-tokens (white-label).
   Neutrale defaults; de firma-laag (instance.css, gegenereerd uit
   instance/huisstijl.tokens.mjs) overschrijft dit :root-blok.
   Laadvolgorde: tokens.css → instance.css → componenten.css. */

:root {
  /* — kleur (semantisch; neutrale defaults) — */
  --primair: #4a7c94;
  --primair-licht: #5b8ba1;
  --primair-deep: #3d6a80;
  --accent: #b98a5a;
  --accent-licht: #c79a6e;
  --accent-deep: #a67744;
  --vlak: #f6f5f2;        /* de "papier"-achtergrond */
  --inkt: #1d1c1a;        /* de tekstkleur, zachter dan zuiver zwart */
  --wit: #ffffff;
  --vlak-sluier: rgba(246, 245, 242, .94);  /* sticky header op --vlak */

  /* — grijzen-ramp: mengsels van inkt↔vlak (instance.css levert berekende
       waarden). 1 = donkerste leestekst, 5 = zachtste label,
       6/7 = randen en lijnen. — */
  --grijs-1: #2e2d2b;
  --grijs-2: #444341;
  --grijs-3: #575654;
  --grijs-4: #6f6e6c;
  --grijs-5: #8e8d8a;
  --grijs-6: #dedcd9;
  --grijs-7: #ebeae7;

  /* — status (afgeleid van het palet zodat white-label meekleurt) — */
  --status-goed: var(--primair-deep);
  --status-fout: var(--accent-deep);
  --status-wachtend: var(--grijs-4);

  /* — typografie — */
  --font: system-ui, -apple-system, sans-serif;
  --maat-basis: 18.5px;
  --maat-compact: 16.5px;   /* data-dichte schermen (tabellen, lijsten) */
  --maat-klein: 16px;
  --maat-label: 14px;
  --maat-kop-1: clamp(38px, 4.4vw, 62px);
  --maat-kop-2: clamp(30px, 3.2vw, 46px);
  --maat-kop-3: clamp(27px, 2.8vw, 37px);
  --maat-kop-4: 21.5px;

  /* — radii — */
  --radius-pill: 999px;
  --radius-paneel: 32px;
  --radius-kaart: 22px;
  --radius-melding: 18px;
  --radius-invoer: 14px;

  /* — spacing-schaal (uit de terugkerende maten van de website-CSS) — */
  --ruimte-1: 8px;
  --ruimte-2: 13px;
  --ruimte-3: 16px;
  --ruimte-4: 22px;
  --ruimte-5: 30px;
  --ruimte-6: 44px;

  /* — overig — */
  --wrap-max: 1180px;
  --schaduw: none;          /* bewust: diepte = vlak-op-wit + scale-hover */
  --focus-ring: 2.5px solid var(--primair);
}