/* Keelvy — Spacing, geometry & shell tokens
   Values transcribed from the real src/app/globals.css.
   ------------------------------------------------------------------ */

:root {
  /* ── 4px base spacing scale ─────────────────────────────────────── */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;

  /* Marketing rhythm — section padding on web pages. The app scale stops at
     64px, which is a card gap, not a section break. */
  --space-24: 96px;
  --space-32: 128px;
  --space-40: 160px;

  /* ── Corner radii ───────────────────────────────────────────────── */
  --radius-sm:   4px;   /* chips, dots, status pills, small controls */
  --radius:      8px;   /* inputs, buttons, segments */
  --radius-md:   12px;
  --radius-lg:   14px;  /* cards, drawers, popovers, touchbar */
  --radius-xl:   22px;  /* marketing surfaces */
  --radius-2xl:  28px;  /* marketing surfaces */
  --radius-pill: 999px;
  --radius-xs:   6px;   /* legacy alias (shadcn / older components) */

  /* ── Shell geometry ─────────────────────────────────────────────── */
  --sb-w:             84px;   /* sidebar collapsed — 2-COLUMN icon grid */
  --sb-w-open:        200px;  /* sidebar expanded (desktop) */
  --sb-w-open-tablet: 240px;  /* expanded on tablet — labels must not truncate */
  --ticker-h:         44px;
  /* The picker rail: every screen that scopes a table by a parent picked on
     the left (collections, galleries, folders, brands) reads this ONE token. */
  --picker-rail-w:        240px;
  --picker-rail-w-tablet: 200px;

  /* ── Drawer widths — TWO, and the picker uses the wide one ─────────
     Quick-peek / single-record drawers are sm; editors, crosstabs and the
     unified picker are md. `lg` in the app is a dead alias for md, which
     is the "third width" it looks like there are three of. */
  --drawer-sm: 380px;   /* max-width 92vw */
  --drawer-md: 620px;   /* max-width 96vw — also STANDARD_PICKER_DRAWER_WIDTH_PX */

  /* ── Table / list density ───────────────────────────────────────── */
  --row-h:   46px;
  --cell-py: 12px;

  /* ── Shadows ────────────────────────────────────────────────────── */
  --shadow-xs: 0 1px 2px rgba(11, 11, 12, 0.04);
  --shadow-sm: 0 4px 12px rgba(11, 11, 12, 0.06);
  --shadow-md: 0 12px 32px rgba(11, 11, 12, 0.08);
  --shadow-lg: 0 24px 64px rgba(11, 11, 12, 0.10);
}

/* ── Compact density ────────────────────────────────────────────────── */
html.density-compact {
  --row-h:   34px;
  --cell-py: 7px;
}
