/* =========================================================================
   Charte AFRIPILOT — « Indigo & Néon Sahel » (thème sombre, défaut)
   et « Craie & Or » (thème clair). Direction arrêtée au §12 du cadrage.
   Chargée APRÈS app.css : elle redéfinit les variables du starter.
   ========================================================================= */

:root{
  --bg:#0A1230;
  --panel:#101B45;
  --panel-2:#16255A;
  --ink:#EDEAE1;
  --dim:#98A2C0;
  --accent:#2B3A8C;
  --accent-2:#35E0D6;
  --gold:#F2A93B;
  --line:rgba(255,255,255,.12);
  --ok:#3FBF92;
  --danger:#A6432B;
  --radius:12px;
}

html[data-theme="clair"]{
  --bg:#FBF8F2;
  --panel:#FFFFFF;
  --panel-2:#EFE7D8;
  --ink:#14181F;
  --dim:#5C6472;
  --accent:#0E6B4F;
  --accent-2:#0E6B4F;
  --gold:#B98A2E;
  --line:rgba(20,24,31,.14);
  --ok:#0E6B4F;
  --danger:#A6432B;
}

body{
  background:
    radial-gradient(900px 420px at 8% -10%, rgba(53,224,214,.12), transparent 62%),
    radial-gradient(760px 380px at 92% -6%, rgba(242,169,59,.10), transparent 62%),
    var(--bg);
  background-attachment:fixed;
}
html[data-theme="clair"] body{background:var(--bg)}

.topbar{background:color-mix(in srgb, var(--bg) 88%, transparent)}
.brand{letter-spacing:.04em}
.brand span{color:var(--accent-2)}

/* --- Trame wax : filet lumineux discret, jamais décoratif au point de gêner --- */
.trame{
  background-image:
    repeating-linear-gradient(45deg, rgba(53,224,214,.07) 0 1px, transparent 1px 14px),
    repeating-linear-gradient(-45deg, rgba(242,169,59,.05) 0 1px, transparent 1px 22px);
}

/* --- Page publique --- */
.hero{padding:64px 0 40px;border-bottom:1px solid var(--line)}
.hero h1{font-size:2.4rem;line-height:1.16;margin:.2em 0 .3em;max-width:16ch}
.hero p.chapeau{font-size:1.06rem;color:var(--dim);max-width:62ch}
.kicker{letter-spacing:.22em;text-transform:uppercase;font-size:.7rem;color:var(--accent-2);font-weight:700}
.cta{display:inline-block;background:var(--accent-2);color:#062A28;font-weight:700;
     padding:12px 22px;border-radius:10px;margin:18px 10px 0 0}
.cta:hover{text-decoration:none;filter:brightness(1.08)}
.cta.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
html[data-theme="clair"] .cta{background:var(--accent);color:#fff}

.piliers{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:26px 0}
.pilier{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:18px 20px}
.pilier h3{margin:.1em 0 .4em;font-size:1rem;color:var(--gold)}
.pilier p{margin:0;color:var(--dim);font-size:.92rem}
@media(max-width:860px){.piliers{grid-template-columns:1fr}}

.etapes{counter-reset:etape;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:20px 0 8px}
.etape{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px}
.etape:before{counter-increment:etape;content:counter(etape);display:inline-flex;
  width:26px;height:26px;align-items:center;justify-content:center;border-radius:50%;
  background:var(--accent-2);color:#062A28;font-weight:700;font-size:.82rem;margin-bottom:8px}
html[data-theme="clair"] .etape:before{background:var(--accent);color:#fff}
@media(max-width:860px){.etapes{grid-template-columns:1fr}}

.pays-liste{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.pays-liste span{border:1px solid var(--line);border-radius:999px;padding:4px 12px;
  font-size:.82rem;color:var(--dim);background:var(--panel)}

/* --- Tuiles d'indicateurs : UNE SEULE LIGNE (règle des écrans d'administration) --- */
.kpis{display:flex;gap:12px;margin:18px 0}
.kpis .kpi{flex:1;min-width:0;background:var(--panel);border:1px solid var(--line);
  border-radius:var(--radius);padding:14px 16px}
.kpi .valeur{font-size:1.5rem;font-weight:700;font-variant-numeric:tabular-nums;display:block}
.kpi .libelle{color:var(--dim);font-size:.8rem;text-transform:uppercase;letter-spacing:.08em}
@media(max-width:900px){.kpis{flex-wrap:wrap}.kpis .kpi{flex:1 1 45%}}

/* --- Compte, rôle, structure --- */
.pastille{display:inline-flex;width:32px;height:32px;border-radius:50%;align-items:center;
  justify-content:center;background:var(--accent);color:#fff;font-weight:700;font-size:.78rem}
.badge-role{border:1px solid var(--line);border-radius:999px;padding:2px 10px;
  font-size:.74rem;color:var(--dim)}
.badge-structure{color:var(--gold);font-size:.82rem}

.mention{color:var(--dim);font-size:.82rem}
.alert.ok{border-left:3px solid var(--ok)}
.alert.ko{border-left:3px solid var(--danger)}
footer.pied{border-top:1px solid var(--line);margin-top:48px;padding:22px 0;color:var(--dim);font-size:.84rem}

/* --- Barre des modules (engendrée depuis App\Support\Modules) --- */
.modules{border-top:1px solid var(--line);background:color-mix(in srgb, var(--panel) 70%, transparent)}
.modules-in{max-width:1040px;margin:0 auto;padding:0 20px;display:flex;gap:4px;overflow-x:auto}
.modules-in a{color:var(--dim);font-size:.88rem;padding:10px 14px;border-bottom:2px solid transparent;white-space:nowrap}
.modules-in a:hover{color:var(--ink);text-decoration:none}
.modules-in a.on{color:var(--ink);border-bottom-color:var(--accent-2)}
.modules-in .ic{opacity:.8;margin-right:4px}

/* --- Jauge de certification 0 → 5 --- */
.jauge{display:flex;gap:4px;margin:8px 0}
.jauge i{flex:1;height:8px;border-radius:4px;background:var(--panel-2);border:1px solid var(--line)}
.jauge i.plein{background:var(--accent-2);border-color:var(--accent-2)}
.jauge.gelee i.plein{background:var(--danger);border-color:var(--danger)}
.niveau-titre{font-size:1.1rem;font-weight:700}
.niveau-portee{color:var(--dim);font-size:.86rem}

/* --- Cartes de biens --- */
.biens{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:16px 0}
@media(max-width:900px){.biens{grid-template-columns:1fr}}
.bien-carte{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;display:block;color:inherit}
.bien-carte:hover{text-decoration:none;border-color:var(--accent-2)}
.bien-carte h3{margin:0 0 4px;font-size:1rem}
.bien-carte .lieu{color:var(--dim);font-size:.85rem}
.puce{display:inline-block;font-size:.72rem;padding:2px 9px;border-radius:999px;border:1px solid var(--line);color:var(--dim);margin-right:6px}
.puce.alerte{border-color:var(--danger);color:#F0B79A}
.puce.certifie{border-color:var(--ok);color:#9FE3C6}

/* --- Blocs de fiche --- */
.bloc{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;margin:14px 0}
.bloc h2{margin:0 0 8px;font-size:1.02rem;color:var(--gold)}
.manques{margin:6px 0 0 18px;color:var(--dim);font-size:.9rem}
.manques li{margin:3px 0}
.deux{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:900px){.deux{grid-template-columns:1fr}}
table.liste{width:100%;border-collapse:collapse;font-size:.9rem}
table.liste th,table.liste td{border-bottom:1px solid var(--line);padding:7px 8px;text-align:left}
table.liste th{color:var(--dim);font-weight:600;font-size:.78rem;text-transform:uppercase;letter-spacing:.06em}