/* ============================================================
   DESIGN SYSTEM — spacing.css
   Escala de espaçamento, radius e sombras extraídas de
   REFERENCIA.png. Base 4px. Remapeia os radius/shadow legados.
   ============================================================ */
:root{
  /* Escala de espaçamento (4 / 8 / 12 / 16 / 20 / 24 / 32 / 40) */
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:20px;
  --space-6:24px;
  --space-8:32px;
  --space-10:40px;

  /* Larguras de layout */
  --sidebar-w:248px;
  --content-max:1320px;
  --content-pad:28px;

  /* Radius (cards ~16px, pills, inputs ~10px) */
  --radius-xs:6px;
  --radius-sm:10px;
  --radius-md:12px;
  --radius-lg:16px;
  --radius-xl:20px;
  --radius-pill:999px;

  /* Sombras suaves (estilo da referência) */
  --shadow-sm:0 1px 2px rgba(16,24,40,.05);
  --shadow-card:0 1px 3px rgba(16,24,40,.06),0 1px 2px rgba(16,24,40,.04);
  --shadow-md:0 8px 24px -10px rgba(16,24,40,.12);
  --shadow-pop:0 18px 44px -14px rgba(16,24,40,.22);

  /* Remapeamento dos tokens legados (dashboard.css) */
  --r-sm:var(--radius-sm);
  --r-md:var(--radius-md);
  --r-lg:var(--radius-lg);
  --r-pill:var(--radius-pill);
  --sh-sm:var(--shadow-sm);
  --sh-md:var(--shadow-card);
  --sh-pop:var(--shadow-pop);
}