/* =============================================================
   Leadity — Spacing, radii, shadows, breakpoints
   ============================================================= */

:root {
  /* ---------- Spacing scale (s-prefixed; preferred) ---------- */
  --space-s0:  0;
  --space-s1:  0.125rem; /* 2px   */
  --space-s2:  0.25rem;  /* 4px   */
  --space-s3:  0.5rem;   /* 8px   */
  --space-s4:  0.75rem;  /* 12px  */
  --space-s5:  1rem;     /* 16px  */
  --space-s6:  1.5rem;   /* 24px  */
  --space-s7:  2rem;     /* 32px  */
  --space-s8:  3rem;     /* 48px  */
  --space-s9:  4rem;     /* 64px  */
  --space-s10: 6rem;     /* 96px  */
  --space-s11: 8rem;     /* 128px */
  --space-s12: 12rem;    /* 192px */
  --space-s13: 16rem;    /* 256px */
  --space-s14: 20rem;    /* 320px */

  /* ---------- Border radius ---------- */
  --border-radius-xs:   2px;   /* page sections */
  --border-radius-sm:   4px;   /* chips / small controls */
  --border-radius-md:   8px;   /* cards / inputs */
  --border-radius-lg:   12px;  /* medium cards */
  --border-radius-xl:   20px;  /* large surfaces / flyout panel */
  --border-radius-full: 999px; /* pills / buttons / icon buttons */

  /* ---------- Shadows (whisper-soft) ---------- */
  --box-shadow-default:
    0 2px 15px rgba(49, 60, 84, 0.02),
    0 4px 16px rgba(68, 69, 71, 0.03);
  --box-shadow-default-hover:
    0 2px 18px rgba(49, 60, 84, 0.04),
    0 8px 24px rgba(68, 69, 71, 0.06);
  --box-shadow-floating:
    0 8px 24px rgba(49, 60, 84, 0.06),
    0 16px 40px rgba(68, 69, 71, 0.08);

  /* ---------- Breakpoints ---------- */
  --bp-xs:  480px;
  --bp-sm:  640px;
  --bp-md:  768px;
  --bp-lg:  1024px;
  --bp-xl:  1280px;
  --bp-2xl: 1536px;
  --bp-3xl: 1600px;
  --bp-4xl: 1920px;
}