/* ============================================================================
   Alix Ops — Design tokens partagés (portail / gestion / equipe)
   REVUE 2026-07-02 — source de vérité UNIQUE des variables (remplace les :root
   copiés-collés des 3 apps). Direction « conciergerie de maison », version SOBRE :
   Inter en pilier, Cormorant Garamond réservé aux rares moments signature, or
   discipliné (accents/filets/CTA financier — jamais un aplat de fond).
   100% vanilla, aucun build. Chargé via <link> AVANT le <style> inline de chaque app.
   ========================================================================== */
:root {
  /* ===== Couleurs marque (inchangées — cohérentes avec le site public) ===== */
  --vert: #1A5C35;
  --vert-fonce: #154D2C;
  --vert-clair: #EBF3EE;
  --or: #B8935A;
  --or-texte: #8A6A2F;        /* or assombri, AA sur clair (>4.5:1) */
  --accent-vif: #1FD872;      /* LOGO/accent uniquement : focus, point de statut, coche — jamais du texte/aplat */
  --creme: #F7F5F1;
  --blanc: #FFFFFF;
  --blanc-chaud: #FDFCFA;
  --charbon: #2A2A27;
  --gris: #5E5E58;
  --gris-doux: #8A8A82;
  --bord: #E4E2DC;
  --bord-doux: #EEECE6;
  --rouge: #B8423A;
  --rouge-clair: #FBEDEC;

  /* Rôles de surface (pilotés dark mode plus bas) */
  --page: var(--creme);
  --surface: var(--blanc);
  --surface-2: var(--blanc-chaud);
  --texte: var(--charbon);
  --texte-doux: var(--gris);

  /* ===== Typographie ===== */
  --font-titre: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --font-corps: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --fs-11: 11px; --fs-12: 12px; --fs-13: 13px; --fs-14: 14px; --fs-15: 15px;
  --fs-16: 16px; --fs-18: 18px; --fs-20: 20px; --fs-23: 23px; --fs-28: 28px; --fs-34: 34px;
  --lh: 1.5;

  /* ===== Espacement (échelle 4/8) ===== */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px; --sp-6: 24px; --sp-7: 32px; --sp-8: 40px;

  /* ===== Rayons ===== */
  --r-sm: 8px; --r-md: 12px; --r-lg: 16px; --r-full: 999px;
  --r-card: var(--r-md);

  /* ===== Ombres (douces = premium, jamais dures) ===== */
  --shadow-sm: 0 1px 3px rgba(30,28,22,.06), 0 1px 2px rgba(30,28,22,.04);
  --shadow-md: 0 4px 14px rgba(30,28,22,.09);
  --shadow-lg: 0 10px 30px rgba(30,28,22,.14);

  /* ===== Mouvement ===== */
  --dur: 160ms;
  --dur-lent: 260ms;
  --ease: cubic-bezier(.2,.7,.3,1);
  --focus-ring: 0 0 0 3px rgba(31,216,114,.5);
}

/* Densité par app (surcharge locale possible) */
[data-app="portail"] { --sp-card: var(--sp-5); --r-card: var(--r-lg); }  /* aéré, vitrine */
[data-app="gestion"] { --sp-card: var(--sp-3); --r-card: var(--r-md); }  /* compact */
[data-app="equipe"]  { --sp-card: var(--sp-4); --r-card: var(--r-md); }  /* gros doigts */

/* ===== Dark mode piloté par tokens ===== */
@media (prefers-color-scheme: dark) {
  :root {
    --page: #16150F;
    --surface: #201F19;
    --surface-2: #262520;
    --creme: #16150F;
    --blanc: #201F19;
    --blanc-chaud: #262520;
    --texte: #EEEAE0;
    --charbon: #EEEAE0;
    --texte-doux: #B6B1A4;
    --gris: #B6B1A4;
    --gris-doux: #8F8A7D;
    /* QA 2026-07-02 — or ÉCLAIRCI en dark : le #8A6A2F clair tombe sous AA sur les
       surfaces sombres. #D8B778 ≈ 6:1 sur --surface (#201F19), ≈ 4.9:1 sur
       --vert-clair (#1B3527) → texte or porteur d'info reste lisible. */
    --or-texte: #D8B778;
    --or: #CBA968;
    --bord: #38362E;
    --bord-doux: #2E2C25;
    --vert-clair: #1B3527;
    --rouge-clair: #3A211E;
    --shadow-sm: 0 1px 3px rgba(0,0,0,.5);
    --shadow-md: 0 4px 14px rgba(0,0,0,.55);
    --shadow-lg: 0 10px 30px rgba(0,0,0,.6);
  }
}

/* ===== Accessibilité mouvement (WCAG 2.3.3) ===== */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}