/* =====================================================
   ELVA — RADIUS & SHADOW TOKENS
   Elva rounds generously (12–30px) and shadows are soft,
   low-contrast and warm-neutral. There are no hard, dark
   drop shadows anywhere in the product.
   ===================================================== */

:root {
  /* ---- Border radius ---- */
  --radius-xlarge: 30px;
  --radius-large: 24px;   /* cards, dialogs */
  --radius-medium: 16px;  /* default --radius */
  --radius-small: 12px;   /* buttons, small controls */
  --radius-input: 20px;   /* text inputs round more than buttons */
  --radius-full: 9999px;  /* pills, avatars, due-date badges */

  --radius: var(--radius-medium);

  /* Tailwind-named aliases (md/lg/xl…) */
  --radius-2xl: var(--radius-xlarge);
  --radius-xl: var(--radius-large);
  --radius-lg: var(--radius-medium);
  --radius-md: var(--radius-small);
  --radius-sm: calc(var(--radius-small) - 4px); /* 8 */

  /* ---- Shadows — 7 soft levels ---- */
  --shadow-xxsmall: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
  --shadow-xsmall: 0px 1px 3px 0px rgba(0, 0, 0, 0.1), 0px 1px 2px 0px rgba(0, 0, 0, 0.06);
  --shadow-small: 0px 4px 8px -2px rgba(0, 0, 0, 0.1), 0px 2px 4px -2px rgba(0, 0, 0, 0.06);
  --shadow-medium: 0px 12px 16px -4px rgba(0, 0, 0, 0.08), 0px 4px 6px -2px rgba(0, 0, 0, 0.03);
  --shadow-large: 0px 20px 24px -4px rgba(0, 0, 0, 0.08), 0px 8px 8px -4px rgba(0, 0, 0, 0.03);
  --shadow-xlarge: 0px 24px 48px -12px rgba(0, 0, 0, 0.18);
  --shadow-xxlarge: 0px 32px 64px -12px rgba(0, 0, 0, 0.14);

  /* Tailwind-named aliases */
  --shadow-2xs: var(--shadow-xxsmall);
  --shadow-xs: var(--shadow-xsmall);
  --shadow-sm: var(--shadow-small);
  --shadow: var(--shadow-small);
  --shadow-md: var(--shadow-medium);
  --shadow-lg: var(--shadow-large);
  --shadow-xl: var(--shadow-xlarge);
  --shadow-2xl: var(--shadow-xxlarge);
}