/* Ordre des couches, déclaré une fois ici (chargé en premier par chaque espace) : une couche plus loin dans la liste
   l'emporte sur les précédentes, quel que soit le poids de ses sélecteurs et l'ordre des <link>. Les tokens, puis la
   base commune des backoffices (ops.css), puis le shell du backoffice (backoffice.css) ; la vitrine a sa couche. */
@layer tokens, base, backoffice, landing;

@layer tokens {
/* Source unique des tokens du design system (docs/DESIGN_SYSTEM.md §9). Aucune valeur en dur ailleurs. */

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/inter-latin-wght-Gz7AlRl.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/inter-latin-ext-wght-1Br77OV.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  /* accent — point de swap unique de l'identité */
  --color-accent: #14B8B0;
  --color-accent-pressed: #27BEB6;
  --color-accent-deep: #0B6F6A;
  --color-accent-soft: #E2F7F6;

  /* neutres */
  --color-ink: #2F313F;
  --color-ink-muted: #5C5F70;
  --color-ink-subtle: #8B8E9C;
  --color-line: #E3E5EA;
  --color-line-strong: #8B8E9C;
  --color-neutral-soft: #F2F4F7;
  --color-surface: #FFFFFF;
  --color-canvas: #F9FAFB;

  /* sémantiques */
  --color-danger: #B42318;
  --color-danger-soft: #FEF3F2;
  --color-warning: #B54708;
  --color-warning-soft: #FFFAEB;
  --color-info: #175CD3;
  --color-info-soft: #EFF8FF;

  /* données (DESIGN_SYSTEM §12) : palette catégorielle validée (daltonisme, contraste ≥ 3:1),
     une couleur par entité, dans cet ordre ; pastille claire et trait foncé pour les icônes */
  --viz-1: #0E8F86;
  --viz-1-soft: #E2F7F6;
  --viz-1-deep: #0B6F6A;
  --viz-2: #EB6834;
  --viz-2-soft: #FDEEE8;
  --viz-2-deep: #B04A1B;
  --viz-3: #2A78D6;
  --viz-3-soft: #EAF2FC;
  --viz-3-deep: #1D5FAE;
  --viz-4: #4A3AA7;
  --viz-4-soft: #EDEBF7;
  --viz-4-deep: #4A3AA7;

  /* navigation sombre des backoffices */
  --color-nav: #2F313F;
  --color-nav-hover: #3B3E4E;
  --color-nav-text: #F2F4F7;
  --color-nav-muted: #B9BBC6;

  /* rayons */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-full: 999px;

  /* élévation */
  --shadow-raised: 0 2px 8px rgba(47, 49, 63, .08);
  --shadow-overlay: 0 -4px 24px rgba(47, 49, 63, .16);

  /* motion */
  --ease-standard: cubic-bezier(.2, 0, 0, 1);
  --dur-fast: 120ms;
  --dur-base: 200ms;
  --dur-slow: 320ms;

  /* espacement (base 4) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-14: 56px;
  --space-18: 72px;
  --space-20: 80px;
  --space-24: 96px;

  /* hauteurs de contrôle (DESIGN_SYSTEM §13) : la cible tactile ne descend jamais sous --tap-min */
  --tap-min: 44px;
  --control-h: 48px;
  --control-h-lg: 52px;

  /* anneau de focus — une seule définition pour les quatre espaces */
  --focus-width: 2px;
  --focus-offset: 2px;

  /* type */
  --font-sans: "Inter", -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --measure: 72ch;
  --page-width: 1120px;
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 0ms; --dur-base: 0ms; --dur-slow: 0ms; }
}
}
