/* Curated palettes per style. Same token names everywhere; style-*.css only
   consume these for color. Select via html[data-palette] (menu.json
   business.palette, demo ?palette=). No/unknown data-palette = first (default) palette.
   Tokens:
     --pal-bg        page background          --pal-surface   raised/soft fill on bg
     --pal-ink       main text on bg          --pal-ink-soft  secondary text on bg
     --pal-line      hairlines/borders        --pal-block     solid color field
     --pal-block-2   secondary field tone     --pal-on-block  text/lines on block
     --pal-accent    accent fill/line         --pal-on-accent text on accent
     --pal-accent-ink accent used as text on bg
   Contrast (AA, >=4.5:1) checked for: ink/bg, ink-soft/bg, on-block/block,
   on-accent/accent, accent-ink/bg (+ accent/block where a style puts accent text on block). */

/* ---------- warm: block field + cream, one deep tone on cream ---------- */
:root[data-style="warm"]{ /* terracotta (default) */
  --pal-bg:#F6EEE3; --pal-surface:#EEDFCF;
  --pal-ink:#A63A22; --pal-ink-soft:#8C3019; --pal-line:#A63A22;
  --pal-block:#B8432A; --pal-block-2:#7E2B19; --pal-on-block:#F6EEE3;
  --pal-accent:#A63A22; --pal-on-accent:#F6EEE3; --pal-accent-ink:#A63A22;
}
:root[data-style="warm"][data-palette="blauw"]{
  --pal-bg:#F3EEE4; --pal-surface:#E4E3DC;
  --pal-ink:#1F3A5F; --pal-ink-soft:#2E4B72; --pal-line:#1F3A5F;
  --pal-block:#1F3A5F; --pal-block-2:#132640; --pal-on-block:#F3EEE4;
  --pal-accent:#1F3A5F; --pal-on-accent:#F3EEE4; --pal-accent-ink:#1F3A5F;
}
:root[data-style="warm"][data-palette="groen"]{
  --pal-bg:#F4EFE3; --pal-surface:#E3E4D3;
  --pal-ink:#2C5A3D; --pal-ink-soft:#35664A; --pal-line:#2C5A3D;
  --pal-block:#2C5A3D; --pal-block-2:#1B3B27; --pal-on-block:#F4EFE3;
  --pal-accent:#2C5A3D; --pal-on-accent:#F4EFE3; --pal-accent-ink:#2C5A3D;
}
:root[data-style="warm"][data-palette="bordeaux"]{
  --pal-bg:#F6ECE4; --pal-surface:#EDD9D0;
  --pal-ink:#6E1F2E; --pal-ink-soft:#7F3040; --pal-line:#6E1F2E;
  --pal-block:#6E1F2E; --pal-block-2:#47121D; --pal-on-block:#F6ECE4;
  --pal-accent:#6E1F2E; --pal-on-accent:#F6ECE4; --pal-accent-ink:#6E1F2E;
}
:root[data-style="warm"][data-palette="oker"]{ /* the original zwart-goud look */
  --pal-bg:#F6EFE0; --pal-surface:#F2E9D6;
  --pal-ink:#86621F; --pal-ink-soft:#7A5718; --pal-line:#86621F;
  --pal-block:#17130D; --pal-block-2:#4A3616; --pal-on-block:#CDA861;
  --pal-accent:#86621F; --pal-on-accent:#F6EFE0; --pal-accent-ink:#86621F;
}

/* ---------- fris: white, black type, near-black primary + one accent ---------- */
:root[data-style="fris"]{ /* default: gold */
  --pal-bg:#FFFFFF; --pal-surface:#F3F3F3;
  --pal-ink:#000000; --pal-ink-soft:#5E5E5E; --pal-line:#00000014;
  --pal-block:#111111; --pal-block-2:#000000; --pal-on-block:#FFFFFF;
  --pal-accent:#D4A62A; --pal-on-accent:#000000; --pal-accent-ink:#8A6A12;
  --ok:#1E8A4C; /* status dot (semantic, not palette-bound) */
}
:root[data-style="fris"][data-palette="blauw"]{
  --pal-block:#0B1A2E; --pal-block-2:#06101D;
  --pal-accent:#6FB1FF; --pal-accent-ink:#1D5FB0;
}
:root[data-style="fris"][data-palette="groen"]{
  --pal-block:#0C1F15; --pal-block-2:#06120B;
  --pal-accent:#3FD08A; --pal-accent-ink:#0B7A45;
}
:root[data-style="fris"][data-palette="rood"]{
  --pal-block:#1F0C0C; --pal-block-2:#120606;
  --pal-accent:#FF6B5E; --pal-accent-ink:#C0271C;
}

/* ---------- donker: near-black charcoal, ivory type, metal accent ---------- */
:root[data-style="donker"]{ /* goud (default) */
  --pal-bg:#0E0D0B; --pal-surface:#141310;
  --pal-ink:#F2ECE0; --pal-ink-soft:#BDB5A6; --pal-line:#F2ECE0;
  --pal-block:#000000; --pal-block-2:#1C1A16; --pal-on-block:#F2ECE0;
  --pal-accent:#B8975A; --pal-on-accent:#0E0D0B; --pal-accent-ink:#B8975A;
}
:root[data-style="donker"][data-palette="koper"]{
  --pal-ink:#F3E9E0; --pal-ink-soft:#C2B3A6; --pal-line:#F3E9E0; --pal-on-block:#F3E9E0;
  --pal-accent:#C47A4F; --pal-accent-ink:#C47A4F;
}
:root[data-style="donker"][data-palette="champagne"]{
  --pal-ink:#F4F0E6; --pal-ink-soft:#C4BCAE; --pal-line:#F4F0E6; --pal-on-block:#F4F0E6;
  --pal-accent:#D9C69B; --pal-accent-ink:#D9C69B;
}

/* tint filter in index.html (#tint-accent) takes its color from here */
#tint-accent feFlood{flood-color:var(--pal-accent)}
