/* ===========================================================================
   Design tokens « Sous les Arbres » — source unique de vérité côté CSS.
   Transposition vérifiée du frontmatter de DESIGN.md (Story 1.2).
   Si un écart apparaît avec DESIGN.md, DESIGN.md prime.

   Ce fichier est lié AVANT app.css (les tokens précèdent leurs usages).
   ===========================================================================*/

/* ── Polices auto-hébergées (RGPD/NFR-3 : aucune requête tierce au runtime) ──
   Sous-ensembles latin + latin-extended (accents FR/NL/DE/EN).
   font-display: swap → pas de FOIT bloquant.
   Cormorant Garamond : titres / affichage / wordmark UNIQUEMENT.
   Mulish : tout le reste (corps, libellés, UI). */

/* Cormorant Garamond 600 */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/cormorant-garamond-600-latinext.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;
}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/cormorant-garamond-600-latin.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;
}

/* Cormorant Garamond 700 */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/cormorant-garamond-700-latinext.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;
}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/cormorant-garamond-700-latin.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;
}

/* Mulish 400 */
@font-face {
  font-family: 'Mulish';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/mulish-400-latinext.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;
}
@font-face {
  font-family: 'Mulish';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/mulish-400-latin.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;
}

/* Mulish 600 */
@font-face {
  font-family: 'Mulish';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/mulish-600-latinext.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;
}
@font-face {
  font-family: 'Mulish';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../fonts/mulish-600-latin.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;
}

/* Mulish 700 */
@font-face {
  font-family: 'Mulish';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/mulish-700-latinext.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;
}
@font-face {
  font-family: 'Mulish';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/mulish-700-latin.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;
}

:root {
  /* ── Base & surfaces ── */
  --color-background: #F6F5EE;          /* sable chaud — fond Vitrine */
  --color-background-app: #F1F0EA;      /* sable froid — fond Back-office */
  --color-surface: #FFFFFF;
  --color-surface-muted: #FAF9F4;       /* zones secondaires back-office */
  --color-text-primary: #2C2A26;        /* ≈13,1:1 sur sable */
  --color-text-muted: #6B675E;
  --color-border: #E5E2D8;
  --color-border-soft: #EDEBE2;

  /* ── Marque ── */
  --color-primary: #566B4E;             /* sauge — action + état Disponible (~5,4:1 texte blanc) */
  --color-primary-foreground: #FFFFFF;
  --color-primary-deep: #465A40;        /* hover / texte sur teinte sauge */
  --color-primary-tint: #E8EDE4;        /* nav active, cellule réservée */
  --color-secondary: #7C86BC;           /* lavande — aplats/accents NON-texte (~3,5:1) */
  --color-secondary-deep: #5E69A6;      /* lavande TEXTE/lien (~5,19:1 blanc / 4,75:1 sable) */
  --color-secondary-tint: #EEEFF7;

  /* ── États sémantiques ── */
  --color-success: #5C8A57;
  --color-success-tint: #E8F0E5;
  --color-warning: #C28A2C;             /* aplats/accents NON-texte */
  --color-warning-tint: #F6EBD5;
  --color-warning-foreground: #8A6010;  /* texte chip « En attente » (~4,72:1) */
  --color-danger: #B5715A;              /* terracotta sourd — aplats NON-texte */
  --color-danger-tint: #F2E4DD;
  --color-danger-foreground: #8F4A34;   /* texte chip « Refusée » (~5,29:1) */

  /* ── Calendrier interne back-office (4 états — D13) ── */
  --color-state-reserved: #566B4E;
  --color-state-reserved-cell: #EBF0E8;
  --color-state-blocked-maintenance: #8A8275;
  --color-state-blocked-maintenance-cell: #EEEBE3;
  --color-state-blocked-maintenance-pill: #6E6759;   /* texte blanc ~5,60:1 */
  --color-state-blocked-family: #7C86BC;
  --color-state-blocked-family-cell: #ECEDF5;
  --color-state-blocked-family-pill: #5E69A6;        /* texte blanc ~5,19:1 */
  --color-state-available: #FFFFFF;

  /* ── Typographie ── */
  --font-display: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;  /* titres/affichage/wordmark UNIQUEMENT */
  --font-ui: 'Mulish', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --text-display: 66px;       /* 42px en mobile — règle responsive posée ultérieurement */
  --text-h1: 42px;
  --text-h2: 30px;
  --text-h3: 23px;
  --text-body-lg: 20px;
  --text-body: 17px;          /* corps Vitrine */
  --text-body-app: 14px;      /* corps Back-office */
  --text-label: 14px;         /* Mulish 700 */
  --text-eyebrow: 12.5px;     /* Mulish 700, maj., letter-spacing .22em */
  --text-caption: 12.5px;
  --leading-vitrine: 1.6;
  --leading-app: 1.5;

  /* ── Rayons ── */
  --radius-sm: 9px;
  --radius: 12px;
  --radius-md: 14px;          /* boutons Vitrine */
  --radius-lg: 15px;          /* cartes Vitrine, calendrier */
  --radius-app: 11px;         /* défaut back-office */
  --radius-app-sm: 8px;       /* contrôles denses back-office */
  --radius-full: 9999px;      /* chips / pastilles */

  /* ── Spacing (base 8px — lève le [ASSUMPTION] DESIGN.md) ── */
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-5: 22px; --space-6: 28px; --space-8: 40px; --space-10: 64px;
  --gutter: 24px;
  --section-vitrine: 64px;
  --margin-mobile: 20px;
  --container-vitrine: 1280px;   /* largeur max du gabarit Vitrine (DESIGN.md#Layout-Spacing) */

  /* ── Élévation & focus ── */
  --shadow-card-vitrine: 0 2px 4px rgba(44,42,38,.04), 0 12px 30px rgba(44,42,38,.07);
  --shadow-button-primary: 0 6px 14px rgba(86,107,78,.22);
  --focus-ring: 0 0 0 3px rgba(86,107,78,.18);   /* anneau champs (input) */
}
