/* =====================================================================
   THÈME — identité visuelle du client. Pour adapter l'outil à un autre
   organisme de formation : modifier ces variables (couleurs, rayons,
   police) — aucun autre fichier à toucher.

   Style « Claude » : fond crème chaleureux, accent terracotta, statuts
   en vert sauge / ocre. Apaisant et rassurant.
   - --accent : couleur de l'INTERFACE (appli)
   - --brand  : couleur des DOCUMENTS générés (charte BrainUpdate, teal)
   ===================================================================== */
:root {
  --accent:        #BD5D3A;   /* terracotta Claude — interface */
  --accent-soft:   #EEDFD5;
  --accent-ink:    #8A4527;

  --brand:         #103C48;   /* teal BrainUpdate — attestations/PDF */
  --brand-ink:     #0B2A33;

  --bg:            #E7E2D6;    /* fond crème chaleureux */
  --surface:       #FBF9F3;    /* cartes — crème clair */
  --surface-2:     #EFE9DC;    /* remplissages doux (barres, puces) */
  --ink:           #2B2A26;    /* texte — presque noir chaud */
  --ink-soft:      #6B675F;
  --ink-faint:     #9C978B;
  --line:          #D9D3C5;    /* bordures discrètes et chaudes */

  --ok:            #5E7C57;    /* vert sauge */
  --ok-soft:       #E6EBDC;
  --warn:          #97671C;    /* ocre */
  --warn-soft:     #F1E7CF;
  --todo:          #9C978B;

  --radius:        10px;
  --radius-lg:     14px;
  --font:          "Segoe UI", system-ui, -apple-system, Arial, sans-serif;
}

/* --- Écran « Complétude » (réutilise .ci/.bar/.card-row ; strict nécessaire) --- */
.ind-row { padding: 5px 0; }
.ind-row .ind-lbl { flex: 1; min-width: 0; color: var(--ink);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ind-row .ind-bar { width: 110px; flex: none; }
.ind-row.ok .bar i { background: var(--ok); }
.ind-row.ko .bar i { background: var(--warn); }
.ind-row .ind-count { width: 48px; text-align: right; color: var(--ink-soft); font-variant-numeric: tabular-nums; }
.ind-row .ind-pct { width: 44px; text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }
.ind-row.ok .ind-pct { color: var(--ok); }
.ind-row.ko .ind-pct { color: var(--warn); }
.card-row .miss { font-size: 12px; color: var(--ink-soft); margin-top: 4px; }
.card-row .miss b { color: var(--ink); font-weight: 600; }
@media (max-width: 640px) { .ind-row .ind-bar { display: none; } }