/* Terras. Contrast gemeten met docs/onderzoek/kleurcheck.py: tekst op grond 13,6 (donker 16,1), tekst-2 op vlak 6,5 (8,6),
   --op-* op accent 4,86 / accent-2 4,77 / uitverkocht 8,64 (donker 6,43 / 8,64 / 6,20), --rand op grond en vlak minstens 3,5 (3,6). */
:root {
  color-scheme: light dark;

  --grond: #FFF7E6;
  --vlak: #FAE9B5;
  --tekst: #3A2418;
  --tekst-2: #6B4A36;
  --accent: #C9380F;
  --accent-2: #0B7A84;
  --uitverkocht: #7A2E3A;
  --land: #F4E8C8;
  --op-accent: #FFF7E6;
  --op-accent-2: #FFF7E6;
  --op-uitverkocht: #FFF7E6;
  --rand: #89786A;
  --lijn: color-mix(in srgb, var(--tekst) 16%, transparent);

  --f-display: "Inter Tight", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --f-tekst: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  --lijst-b: 400px;
  --popup-b: 352px;
  --flyout-b: 344px;

  --r-tegel: 12px;
  --r-knop: 10px;
  --r-status: 4px;
  --r-chip: 999px;
  --lijn-dik: 2px;
  --lijn-dun: 1.5px;
  --focus: 3px;
  --ease: cubic-bezier(.22, .7, .2, 1);
  --marge: 12px;
  --veilig-onder: env(safe-area-inset-bottom, 0px);
  --veilig-boven: env(safe-area-inset-top, 0px);
}

@media (prefers-color-scheme: dark) {
  :root {
    --grond: #1E120D;
    --vlak: #2E1D15;
    --tekst: #FBEFD9;
    --tekst-2: #D4B99D;
    --accent: #FF6A3D;
    --accent-2: #3CC4C7;
    --uitverkocht: #E8708A;
    --land: #271810;
    --op-accent: #1E120D;
    --op-accent-2: #1E120D;
    --op-uitverkocht: #1E120D;
    --rand: #817569;
  }
}

@media (min-width: 900px) {
  :root { --marge: 16px; }
}