/* ============================================================
   Supplied — Spacing, radius, shadow, and motion tokens
   4px base unit, shadcn-style radius chain, soft single-layer
   shadows (no heavy elevation — the report app is flat and calm).
   ============================================================ */

:root {
  /* Spacing (4px base) */
  --space-0: 0px;
  --space-1: 0.25rem;  /* 4 */
  --space-2: 0.5rem;   /* 8 */
  --space-3: 0.75rem;  /* 12 */
  --space-4: 1rem;     /* 16 */
  --space-5: 1.25rem;  /* 20 */
  --space-6: 1.5rem;   /* 24 */
  --space-8: 2rem;     /* 32 */
  --space-10: 2.5rem;  /* 40 */
  --space-12: 3rem;    /* 48 */
  --space-16: 4rem;    /* 64 */
  --space-20: 5rem;    /* 80 */

  /* Radius — shadcn convention: --radius is the base, rest derive */
  --radius: 0.5rem;         /* 8px — cards, inputs, buttons */
  --radius-sm: calc(var(--radius) - 4px);  /* 4px — badges, tags, chips */
  --radius-md: calc(var(--radius) - 2px);  /* 6px */
  --radius-lg: var(--radius);              /* 8px */
  --radius-xl: 0.75rem;     /* 12px — panels, dialogs */
  --radius-2xl: 1rem;       /* 16px — hero cards */
  --radius-full: 9999px;    /* pills, avatars, dots */

  /* Shadow — flat product UI: one soft ambient shadow, no double-stack */
  --shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.04);
  --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.06), 0 1px 2px -1px rgb(0 0 0 / 0.04);
  --shadow-md: 0 4px 12px -2px rgb(0 0 0 / 0.08), 0 2px 4px -2px rgb(0 0 0 / 0.04);
  --shadow-lg: 0 12px 24px -6px rgb(0 0 0 / 0.10), 0 4px 8px -4px rgb(0 0 0 / 0.05);
  --shadow-focus-ring: 0 0 0 3px color-mix(in oklch, var(--ring) 35%, transparent);

  /* Motion — quick, purposeful, no bounce/spring */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */
  --ease-out: cubic-bezier(0, 0, 0.2, 1); /* @kind other */
  --ease-in: cubic-bezier(0.4, 0, 1, 1); /* @kind other */
  --duration-fast: 120ms; /* @kind other */
  --duration-base: 180ms; /* @kind other */
  --duration-slow: 280ms; /* @kind other */

  /* Layout constants used across the report app */
  --sidebar-width: 15rem;      /* 240px collapsed nav rail + labels */
  --content-max-width: 72rem;  /* 1152px report column */
  --header-height: 3.5rem;     /* 56px */
}
