/* ============================================================
   KamiQR 3.0 — Spacing, radii, density, and shadow tokens
   ============================================================ */

:root {

  /* ── Spacing scale ─────────────────────────────────────── */
  --space-1:   4px;
  --space-2:   8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-12: 48px;

  /* ── Radii — pill-leaning system ──────────────────────── */
  /*
     pill   → buttons, status chips, search, segmented controls
     lg 14  → cards, popovers, modals, full-width form inputs
     md 10  → table action menus, compact dropdowns
     sm  8  → inline tags, table cell tokens, dense chips
     0      → sidebar rail, page chrome (architectural surfaces)
  */
  --radius-sm:    8px;
  --radius-md:   10px;
  --radius-lg:   14px;
  --radius-pill: 9999px;

  /* ── Density tokens ────────────────────────────────────── */
  --density-row-h:      44px;   /* table row height                 */
  --density-header-h:   36px;   /* table header row height          */
  --density-topbar-h:   60px;   /* topbar height                    */
  --density-sidebar-w: 244px;   /* sidebar width                    */
  --density-pad-x:      20px;   /* horizontal content padding       */
  --density-gap:        14px;   /* default component gap            */

  /* ── Button heights ────────────────────────────────────── */
  --btn-h-sm:  28px;
  --btn-h-md:  32px;
  --btn-h-lg:  40px;

  /* Surface C admin button heights: 40 form-actions (--btn-h-lg), 36 list-header
     CTAs, 30 inline table CTAs (Открыть меню / + Позиция). */
  --btn-h-adm-cta:    36px;
  --btn-h-adm-inline: 30px;

  /* ── Input height ──────────────────────────────────────── */
  --input-h:   36px;

  /* ── Toggle ────────────────────────────────────────────── */
  --toggle-w:  32px;
  --toggle-h:  18px;

  /* ── Surface A (consumer app) — design-specific metrics ──
     The consumer app has its own softer, larger radius scale (distinct
     from the admin pill-leaning system) and taller touch targets. */
  --radius-consumer-lg:  16px;  /* CTAs, inputs, menu/totals/receipt cards */
  --radius-consumer-xl:  18px;  /* order-list cards, welcome logo tile     */
  --radius-consumer-2xl: 22px;  /* feed campaign cards                     */
  --radius-consumer-qr:  24px;  /* QR container                            */
  --radius-stepper:      11px;  /* qty stepper container                   */
  --radius-stepper-btn:   8px;  /* qty stepper +/- buttons                 */
  --btn-h-consumer:      54px;  /* primary CTA height                      */
  --btn-h-consumer-sm:   48px;  /* secondary / ghost CTA height            */
  --btn-h-consumer-dark: 52px;  /* dark back-to-menu CTA height            */
  --input-h-consumer:    52px;  /* welcome inputs                          */
  --media-h-card:       118px;  /* feed card media band                    */
  --media-h-detail:     172px;  /* detail hero media band                  */

  /* ── Surface C (super-admin) — compact ledger/summary tile radius ──
     The pill-leaning system jumps md 10 → lg 14; the C11 ledger 6-tiles and the
     analytics margin chip sit at 12px (between the two). */
  --radius-tile: 12px;

  /* ── Surface B (venue cabinet) — control + tile radii ────
     The venue cabinet clusters around card r14 (--radius-lg); these two cover
     the tighter controls (r12) and the balance tile (r16). */
  --radius-vb-ctl:  12px;  /* login inputs, secondary/back buttons, status rows */
  --radius-vb-tile: 16px;  /* balance tile                                      */
}
