/* ============================================================
   TOKENS-CITY — Uit de Wadden ("Boutique Zine")
   IDENTITEITSKLEUR (bron: uit-ds-v4/kleuren-90.tsv · wp-optie uit_ds_color)
   wordt LETTERLIJK het primair; leesbaarheid via --on-primary (tekst óp de
   merkkleur) en --primary-text (merkkleur-tekst op licht, zo nodig binnen
   dezelfde tint verdiept tot WCAG AA). Gegenereerd met tools/gen-tokens.py.
   Contrast: wit-op-primair 3.41:1 → on-primary=#041C19
             primair-op-crème 2.97:1 · op crème-alt 2.74:1
             · op wit 3.41:1 → primary-text=#0E7063 (4.79:1 op de zwaarste)
   ============================================================ */
:root{
  --cream:#F4EFE3;
  --cream-alt:#ECE6D6;
  --cream-alt-border:#ded5bf;
  /* 16-09-2026: 4% donkerder dan wat gen-tokens.py afleidde (#09463E). Het accentgoud
     #C9A227 haalde daarop 4,44:1 — net onder AA voor de 14px-knoppen op de donkere band
     ("Start de keuzehulp", de skip-link). Op #09433C is dat 4,62:1. Wit gaat van 11,0
     naar 11,2:1, dus niets verliest erdoor. Alleen nodig bij een lichte merkkleur zoals
     dit getijdengroen; donkerdere merken halen het vanzelf. */
  --green-900:#09433C;
  --green-950:#06322C;
  --green-700:#149C8A;
  --green-700-hover:#118677;
  --gold:#C9A227;
  --gold-hover:#B99524;
  --ink:#041C19;
  --body:#46524b;
  --body-2:#5a5345;
  --muted:#9a917e;
  --muted-2:#8a8170;
  --card:#ffffff;
  --card-border:#e6ddca;
  --container:1260px;

  /* On-dark tekstladder (neutraal, contrast-tuned op donkere merkvlakken) */
  --on-dark:#fdf9ef;
  --on-dark-2:#e9e4d5;
  --on-dark-3:#dfd9c6;
  --on-dark-4:#a9a48f;
  --on-dark-5:#8a8471;
  --input-placeholder-on-dark:#c9c2ac;
  --white:#ffffff;
  --input-bg-soft:#fbf8f0;
  --pill-hover-bg:#e7e0cd;

  /* Identiteit-afgeleide tekstkleuren */
  --on-primary:#041C19;
  --primary-text:#0E7063;
  --primary-text-hover:#0C6055;

  /* Phosphor/DS-v4-aliassen */
  --color-primary: var(--green-700);
  --color-primary-light: color-mix(in srgb, var(--green-700) 20%, transparent);
  --color-primary-dark: var(--green-700-hover);

  /* Semantische constanten (alle steden gelijk) */
  --safety-red:#c0392b;
  --fav-active:#c0392b;
}

/* ── Leesbaarheidsfix 16-09-2026 ───────────────────────────────────────────────
   (1) `uit-nieuwsbrief.php` voegt de kleine regel onder het inschrijfformulier toe
   met inline `color:inherit`; op de donkere band erft die `--body` en haalt geen AA.
   (2) De amber winkelknop van `uit-winkel-cta.php` verliest zijn eigen kleur van
   `.prose-block a{color:var(--primary-text)}` uit zine.css. Beide echte fixes horen
   in die mu-plugins; tot die er zijn corrigeren we het hier, in het per-site
   tokenbestand, zodat een netwerk-uitrol het niet terugdraait.                   */
.newsletter-band .ua-news-klein,
.newsletter-band .ua-news-klein a { color: var(--on-dark-3) !important; }
.prose-block a.uitwinkel__knop,
.uitwinkel__knop { color:#1b1730 !important; }

/* ── Leesbaarheidsfix 16-09-2026 (3) — NOODNUMMER ─────────────────────────────
   `uit-veiligheid.php` zet `color:#fff` op de rode 112-knop, maar die staat binnen
   een `.prose-block`, en `.prose-block a{color:var(--primary-text)}` uit zine.css is
   specifieker. Gevolg: "112 — Levensgevaar of spoed" stond in de MERKKLEUR op rood
   (gemeten 1,1-1,4:1, dus praktisch onleesbaar) terwijl het telefoonicoon ernaast
   wél wit was — dat heeft een eigen, specifiekere regel. Zelfde oorzaak als bij de
   winkelknop hierboven. Geldt netwerkbreed; hier per site hersteld omdat de echte
   fix in zine.css of de plugin hoort.                                            */
.prose-block a.uitveil__emerg,
.uitveil__emerg,
.uitveil__emerg .uitveil__emerg-num,
.uitveil__emerg .uitveil__emerg-lbl { color:#fff !important; }

/* ── Leesbaarheidsfix 16-09-2026 (4) ──────────────────────────────────────────
   De kleine kopjes op Belangrijke informatie ("HUISARTSENPOST", "SEH") staan in
   #6a7c81 op wit = 4,36:1 — net onder AA, en het is 10-11px hoofdletters, dus juist
   daar telt het. #63757A is dezelfde tint een tikje dieper en haalt 4,82:1.
   Zit in `uit-veiligheid.php`, dus netwerkbreed; hier per site hersteld.          */
.uitveil__eyebrow { color:#63757A !important; }

/* ── Leesbaarheidsfix 16-09-2026 (5) ──────────────────────────────────────────
   De twee voetnoten op Belangrijke informatie: "Meer lokale informatie volgt."
   (#6a7c81 = 4,36:1) en de bronregel onder de reddingsvlaggen (#8a969b = 3,0:1).
   Beide op wit of crème, beide onder AA. #5A6C70 haalt 5,5:1 op wit en 4,8:1 op
   crème en blijft dezelfde grijstint.                                            */
.uitveil-more,
.uitveil-flags__src { color:#5A6C70 !important; }

