/**
 * Base tokens — struktur der er ens for ALLE kunder.
 *
 * Her bor spacing, radius, typeskala og layout. Ikke farver, ikke skrifttype:
 * det er præcis dét der adskiller én kunde fra den næste, og det bor i
 * apps/<kunde>/tokens.css.
 *
 * Opdelingen er den samme regel som settings-snapshottet på serveren. Én ting
 * varierer per kunde, og den ting ligger ét sted.
 *
 * Værdierne kommer fra Stitch-designet (DESIGN.md). Navnene følger Material 3,
 * fordi de parvis navngiver forgrund og baggrund (--color-primary /
 * --color-on-primary), hvilket gør en mørk variant til en ren
 * token-udskiftning frem for en gennemgang af hver komponent.
 */

:root {
  /* 8px-grid. Alt spacing er et multiplum, så rytmen holder af sig selv. */
  --space-xs: 4px;
  --space-sm: 12px;
  --space-base: 8px;
  --space-md: 24px;
  --space-lg: 48px;
  --space-xl: 64px;
  --space-gutter: 16px;

  --radius-sm: 0.25rem;
  --radius: 0.5rem;
  --radius-md: 0.75rem;
  --radius-lg: 1rem;
  --radius-xl: 1.5rem;
  --radius-full: 9999px;

  /* Typeskala. Fluid hvor det giver mening: en overskrift må gerne blive
     større på en bred skærm, men aldrig mindre end mobilstørrelsen. */
  --text-headline-lg: clamp(1.5rem, 1.2rem + 1.5vw, 2rem);
  --text-headline-lg-line: 1.25;
  --text-headline-md: 1.25rem;
  --text-headline-md-line: 1.4;
  --text-body-lg: 1.125rem;
  --text-body-lg-line: 1.55;
  --text-body-md: 1rem;
  --text-body-md-line: 1.5;
  --text-label-md: 0.875rem;
  --text-label-sm: 0.75rem;

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;

  --layout-max-width: 1200px;
  --layout-margin-mobile: 20px;

  /* Touch-mål. 44px er minimum for en finger; 56px til den primære handling,
     som Stitch-designet kalder "chunky". */
  --tap-min: 44px;
  --tap-primary: 56px;

  --transition: 200ms ease;
}

/* Respektér brugerens valg. En animation der ikke kan slås fra er en fejl,
   ikke en detalje. */
@media (prefers-reduced-motion: reduce) {
  :root { --transition: 0ms; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}
