/* ============================================================
   OleaFlow — Elevation: radii, borders, shadows, motion
   Warm-tinted shadows. Moderate rounding — efficient, not bubbly.
   ============================================================ */

:root {
  /* Radii */
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 8px;    /* default — inputs, buttons, cards */
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-2xl: 22px;
  --radius-pill: 999px;

  /* Border widths */
  --border-hair: 1px; /* @kind spacing */
  --border-thick: 1.5px;
  --border-focus: 2px;

  /* Warm shadows (tinted toward stone-900, never pure black) */
  --shadow-xs: 0 1px 2px oklch(0.232 0.011 144 / 0.06);
  --shadow-sm: 0 1px 2px oklch(0.232 0.011 144 / 0.06),
               0 1px 3px oklch(0.232 0.011 144 / 0.08);
  --shadow-md: 0 2px 4px oklch(0.232 0.011 144 / 0.06),
               0 4px 10px oklch(0.232 0.011 144 / 0.08);
  --shadow-lg: 0 4px 8px oklch(0.232 0.011 144 / 0.06),
               0 12px 28px oklch(0.232 0.011 144 / 0.12);
  --shadow-xl: 0 8px 16px oklch(0.232 0.011 144 / 0.08),
               0 24px 48px oklch(0.232 0.011 144 / 0.16);
  /* Focus ring — olive, used on keyboard focus */
  --ring-focus: 0 0 0 3px oklch(0.505 0.098 141 / 0.28);
  --ring-danger: 0 0 0 3px oklch(0.585 0.185 27 / 0.25);

  /* Z-index — échelle unique, alignée sur celle de Bootstrap car les deux
     cohabitent (modales Bootstrap + dialogs OleaFlow sur la même page).
     Toute nouvelle couche DOIT prendre un token ici, jamais un nombre nu. */
  --z-base: 1;          /* thead sticky dans un tableau */
  --z-fab: 800;         /* bouton d'aide flottant */
  --z-sticky: 900;      /* topbar, en-têtes collants */
  --z-overlay: 1030;    /* voile de la sidebar mobile */
  --z-sidebar: 1040;
  --z-drawer: 1045;     /* = offcanvas Bootstrap */
  --z-dialog: 1055;     /* = modal Bootstrap */
  --z-toast: 1070;
  --z-tooltip: 1080;
  --z-skip: 2000;       /* lien d'évitement — toujours au-dessus */

  /* Motion — quick & functional, no bounce on data UI */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1); /* @kind other */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1); /* @kind other */
  --dur-fast: 120ms; /* @kind other */
  --dur-base: 180ms; /* @kind other */
  --dur-slow: 260ms; /* @kind other */
}