/* ============================================================================
   static/tokens.css — SOURCE UNIQUE DE VÉRITÉ VISUELLE (Docveo)
   ============================================================================
   Chaque couleur portant du TEXTE ci-dessous a un ratio de contraste CALCULÉ
   (formule WCAG) et passe la norme AA. Les ratios sont indiqués en commentaire.
   Règles :
     - Ne JAMAIS redéfinir ces variables dans un template.
     - Le vert vif --green est DÉCORATIF (icônes, graphiques, filets) :
       interdit en texte et en fond de bouton (ratio 3,39 < 4,5).
     - Plancher typographique : 12 px. Corps : 14 px.
   ========================================================================== */
:root{
  /* ── Couleurs ─────────────────────────────────────────────────────────── */
  --green:#1D9E75;        /* accent décoratif — 3,39 sur blanc (≥3,0 non-texte) */
  --green-dark:#0F6E56;   /* actions, liens, valeurs — blanc dessus : 6,20 */
  --green-darker:#0B5A46; /* survol des boutons pleins */
  --green-light:#E1F5EE;  /* fonds doux ; texte --green-dark dessus : 5,46 */
  --bg:#F8FAF9;
  --card:#FFFFFF;
  --border:#C2CDC8;        /* séparateurs décoratifs — 1,63 */
  --border-input:#7F948D;  /* bordure de CHAMP (interactif) — 3,22 (seuil 3,0) */
  --text:#1A3A3A;          /* 12,28 */
  --muted:#5A6B67;         /* texte secondaire — 5,62 (avant : 4,39, échec) */
  --danger:#C93736;        /* texte danger — 5,14 (avant : 3,93, échec) */
  --danger-bg:#FCEBEB;
  --amber:#8A5800;         /* texte avertissement — 6,04 (avant : 2,17, échec) */
  --amber-bg:#FAEEDA;
  --radius:10px;

  /* ── Échelle typographique (6 tailles, rien d'autre) ─────────────────── */
  --fs-kpi:26px;      /* grands chiffres */
  --fs-title:20px;    /* titre de page */
  --fs-section:16px;  /* titres de section, valeurs KPI secondaires */
  --fs-body:14px;     /* corps, formulaires, tableaux */
  --fs-small:13px;    /* texte secondaire */
  --fs-label:12px;    /* libellés techniques, badges — PLANCHER ABSOLU */
}

/* Corps de texte : 14 px (ne touche pas au rem racine pour ne pas
   rétrécir les espacements existants exprimés en rem). */
body{font-size:var(--fs-body)}

/* ── Champs de saisie : bordure de composant interactif ───────────────────
   !important : nécessaire pour battre les 1 900+ styles écrits en ligne
   dans les templates hérités — sera retiré au fil de leur résorption. */
input,select,textarea{border-color:var(--border-input)!important}
input:focus,select:focus,textarea:focus{
  border-color:var(--green-dark)!important;
  outline:2px solid rgba(15,110,86,.22);outline-offset:0;
}
input::placeholder,textarea::placeholder{color:var(--muted)}

/* ── Mobile : cibles tactiles ≥ 44 px + bouton flottant ──────────────────── */
@media (max-width:768px){
  .btn{min-height:44px}
  .btn-sm{min-height:40px}
  .sidebar nav a{min-height:44px;display:flex;align-items:center}
  input:not([type=checkbox]):not([type=radio]),select,textarea{min-height:44px}

  /* Bouton flottant « Nouveau document » — validé (vs barre basse) */
  #fab-new{
    position:fixed;right:16px;bottom:16px;width:56px;height:56px;
    border-radius:50%;background:var(--green-dark);color:#fff;
    display:flex;align-items:center;justify-content:center;
    font-size:30px;line-height:1;text-decoration:none;
    box-shadow:0 6px 18px rgba(11,90,70,.35);z-index:998;
  }
  #fab-new:active{transform:scale(.96)}
}
@media (min-width:769px){ #fab-new{display:none} }
