/* Reddo design tokens — uit het mockup-traject (versie 9a/10). */
:root {
  /* kleur */
  --r-black: #1A1411;        /* warm zwart — tekst, primaire actie, logo. Nooit #000 */
  --r-paper: #FAF7F2;        /* achtergrond */
  --r-card: #FFFFFF;
  --r-border: #ECE5D8;
  --r-muted: #6E675D;
  --r-faint: #A49B8C;
  --r-status-aangenomen: #E4D9C6;  /* warm zand */
  --r-status-bezig: #D89B2E;       /* gedempt oker — zwarte tekst */
  --r-status-klaar: #1A8F5F;       /* het enige volle moment — witte tekst */
  --r-status-meegegeven: #123B2B;  /* diep groen, afgesloten */

  /* typografie */
  --r-font: 'Instrument Sans', sans-serif;
  --r-font-mono: 'IBM Plex Mono', monospace;

  /* vorm */
  --r-radius-card: 16px;
  --r-radius-card-lg: 18px;
  --r-radius-btn: 10px;
  --r-radius-pill: 7px;
  --r-strip-w: 5px;          /* statusstrook links op elke kaart */

  /* schrijflijntjes — de app staat op papier, niet op een leeg vlak */
  --r-ruled-gap: 25px;
  --r-ruled-alpha: 0.035;

  /* ruimte */
  --r-pad-card: 14px;
  --r-pad-screen: 16px;
  --r-gap-list: 8px;
}
/* Schrijflijntjes. Statusvlakken en kaarten dekken ze vanzelf af. */
.reddo-ruled {
  background: var(--r-paper) repeating-linear-gradient(
    180deg,
    transparent 0,
    transparent calc(var(--r-ruled-gap) - 1px),
    rgba(26, 20, 17, var(--r-ruled-alpha)) calc(var(--r-ruled-gap) - 1px),
    rgba(26, 20, 17, var(--r-ruled-alpha)) var(--r-ruled-gap)
  );
}

/*
Designregels:
- Zwart = algemene actie ("+ Voeg werk toe"); statuskleur = doorzetten naar volgende fase.
- Statusstrook links is de vaste indicator; pill alleen bij BEZIG en KLAAR (AANGENOMEN is default).
- Statuskleur ondersteunt, is nooit de enige informatiedrager.
*/
