/* ============================================================
   Polionys — Spacing, radii, shadows, motion
   ============================================================ */

:root {
  /* ---------- Spacing scale (px) ---------- */
  --space-0:  0px;
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  10px;
  --space-4:  12px;
  --space-5:  16px;
  --space-6:  20px;
  --space-7:  24px;
  --space-8:  32px;
  --space-9:  40px;
  --space-10: 48px;
  --space-12: 64px;

  /* ---------- Radii ----------
     The system is built on pills + softly-rounded cards.        */
  --radius-pill: 100px;   /* buttons, inputs, search, date filter */
  --radius-chip: 50px;    /* status badges, tags                  */
  --radius-card: 20px;    /* stat cards, panels                   */
  --radius-card-lg: 24px; /* large cards, company switcher, popovers */
  --radius-md: 12px;      /* inner tiles, icon wells              */
  --radius-sm: 8px;       /* small chips, menu items              */
  --radius-xs: 6px;

  /* ---------- Borders ---------- */
  --border-width: 1px; /* @kind spacing */
  /* Hairline outline used everywhere instead of a heavy border.
     Apply as box-shadow so it never affects layout box size.    */
  --ring-hairline: inset 0 0 0 1px var(--border-hairline);
  --ring-input:    inset 0 0 0 1px var(--border-input);
  --ring-subtle:   inset 0 0 0 1px var(--border-subtle);
  /* Selection inputs: neutral grey stroke in every state; keyboard focus keeps --focus-ring. */
  --ring-select:        inset 0 0 0 1px var(--border-input);
  --ring-select-active: inset 0 0 0 1.5px var(--border-strong);

  /* ---------- Shadows ----------
     Polionys shadows are whisper-soft; elevation comes from
     hairline rings + faint ambient shadow, never dark drops.    */
  --shadow-none: none;
  --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.03), 0 4px 16px rgba(0, 0, 0, 0.03);
  --shadow-raised: 0 8px 24px rgba(0, 0, 0, 0.06), 0 2px 6px rgba(0, 0, 0, 0.04);
  --shadow-pop: 0 12px 40px rgba(0, 0, 0, 0.10), 0 4px 12px rgba(0, 0, 0, 0.05);
  --shadow-inverse: 0 12px 32px rgba(4, 27, 46, 0.28);

  /* ---------- Motion ---------- */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1); /* @kind other */
  --dur-fast: 120ms; /* @kind other */
  --dur-base: 200ms; /* @kind other */
  --dur-slow: 320ms; /* @kind other */

  /* ---------- Layout ---------- */
  --sidebar-width: 290px;
  --sidebar-width-collapsed: 88px;
  --topbar-height: 96px;
  --content-max: 1320px;
}
