/* ============================================================
   BidLogiQ — Spacing, radii & layout tokens
   SOURCE OF TRUTH: Figma "BidLogiQ" → Design-system page.
   Radii and control heights are transcribed from real components.
   ============================================================ */
:root {
  --space-0:   0;
  --space-1:   0.25rem;  /* 4  */
  --space-2:   0.5rem;   /* 8  — button/chip padding, stepper text pad */
  --space-3:   0.75rem;  /* 12 */
  --space-4:   1rem;     /* 16 — button px, sidebar padding */
  --space-5:   1.5rem;   /* 24 — stepper wrapper px */
  --space-6:   2rem;     /* 32 */
  --space-7:   2.5rem;   /* 40 — header px */
  --space-8:   3rem;     /* 48 */
  --space-9:   4rem;     /* 64 */
  --space-10:  5rem;     /* 80 */
  --space-12:  6rem;     /* 96 */

  /* Radii — the values that actually appear in the file */
  --radius-xs:   4px;    /* small text chips */
  --radius-sm:   5px;
  --radius-md:   8px;    /* DEFAULT: buttons, inputs, cards, nav items */
  --radius-lg:   10px;   /* step number circles */
  --radius-xl:   12px;   /* swatches, larger cards */
  --radius-2xl:  20px;   /* status chips */
  --radius-pill: 999px;

  /* Control heights, from the source components */
  --control-height-sm: 40px;
  --control-height:    48px;  /* Button */
  --control-height-lg: 54px;  /* TextField */
  --chip-height:       28px;  /* Status chip */
  --nav-item-height:   52px;  /* Sidebar item */

  /* Containers */
  --container-sm: 640px;
  --container-md: 880px;
  --container-lg: 1120px;
  --container-xl: 1288px;  /* content width seen on the Info banner */

  /* Layout primitives */
  --sidebar-width:      264px;
  --sidebar-rail-width: 84px;   /* collapsed icon rail */
  --topbar-height:      80px;   /* Header component */
}