/* ==========================================================================
   Exigo Elements — Spacing & Sizing Tokens
   --------------------------------------------------------------------------
   The product spaces everything in `rem` off a 0.25rem (≈4px) base unit, so
   layout scales with the user's browser font size. `1rem` (≈16px) is the
   default gutter between fields, cards and rows.
   ========================================================================== */

:root {
  /* Spacing scale (0.25rem base) */
  --space-0: 0;
  --space-1: 0.25rem;   /*  4px */
  --space-2: 0.5rem;    /*  8px — tight gap, chip padding */
  --space-3: 0.75rem;   /* 12px */
  --space-4: 1rem;      /* 16px — default gutter */
  --space-5: 1.25rem;   /* 20px */
  --space-6: 1.5rem;    /* 24px — section gap, button h-padding */
  --space-8: 2rem;      /* 32px */
  --space-10: 2.5rem;   /* 40px */
  --space-12: 3rem;     /* 48px */
  --space-16: 4rem;     /* 64px */

  /* Component control heights (kept exact to the app) */
  --control-height-sm: 1.5rem;    /* 24px — titlebar / filter buttons */
  --control-height-md: 2rem;      /* 32px — primary action buttons */
  --control-height-lg: 2.25rem;   /* 36px — form fields (text, select) */

  /* App shell metrics */
  --rail-width: 3.75rem;          /* collapsed left icon rail */
  --rail-width-open: 15rem;       /* expanded left menu */
  --titlebar-height: 3.5rem;

  /* Icon sizes (match the app's `size2…size5` steps) */
  --icon-sm: 0.875rem;   /* 14px */
  --icon-md: 1rem;       /* 16px */
  --icon-lg: 1.25rem;    /* 20px */
  --icon-xl: 1.5rem;     /* 24px */
}