/* Feuille de style commune aux manuels GestPlan et GestRapport (21/07/2026) */
:root{--bleu:#0E2040;--accent:#2563eb;--bord:#e2e8f0;--gris:#64748b;--fond:#f8fafc}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",sans-serif;color:#0f172a;background:var(--fond);line-height:1.65}
header{background:linear-gradient(135deg,var(--bleu),#1e3a5f);color:#fff;padding:1.8rem 1rem}
header .in{max-width:920px;margin:0 auto}
header h1{margin:0;font-size:1.6rem}
header p{margin:.5rem 0 0;opacity:.85;font-size:.95rem}
.barre{position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid var(--bord);padding:.7rem 1rem;box-shadow:0 1px 3px rgba(0,0,0,.04)}
.barre .in{max-width:920px;margin:0 auto;display:flex;gap:.6rem;align-items:center;flex-wrap:wrap}
.barre input{flex:1;min-width:200px;padding:.6rem .9rem;border:1px solid var(--bord);border-radius:8px;font-size:1rem}
.barre .cnt{font-size:.85rem;color:var(--gris);white-space:nowrap}
main{max-width:920px;margin:0 auto;padding:1rem}
.som{background:#fff;border:1px solid var(--bord);border-radius:12px;padding:1.1rem;margin-bottom:1.5rem}
.som h2{margin:0 0 .7rem;font-size:1rem;color:var(--bleu)}
.som .grp{margin-bottom:.7rem}
.som .grp b{display:block;font-size:.78rem;text-transform:uppercase;letter-spacing:.05em;color:var(--gris);margin-bottom:.3rem}
.som a{display:inline-block;margin:.12rem .45rem .12rem 0;color:var(--accent);text-decoration:none;font-size:.9rem}
.som a:hover{text-decoration:underline}
section{background:#fff;border:1px solid var(--bord);border-radius:12px;padding:1.2rem 1.3rem;margin-bottom:1rem;scroll-margin-top:70px}
section h3{margin:0 0 .3rem;font-size:1.15rem;color:var(--bleu)}
.role{display:inline-block;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
      background:#eff6ff;color:#1d4ed8;padding:.15rem .5rem;border-radius:999px;margin-bottom:.6rem}
.role.admin{background:#fef3c7;color:#a16207}
section p{margin:.55rem 0}
.quoi{font-weight:600;font-size:1.02rem}
ol.etapes{margin:.6rem 0;padding-left:1.3rem}
ol.etapes li{margin:.35rem 0}
.enc{border-left:3px solid var(--accent);background:var(--fond);padding:.65rem .9rem;border-radius:0 8px 8px 0;margin:.7rem 0}
.att{border-left:3px solid #d97706;background:#fffbeb;padding:.65rem .9rem;border-radius:0 8px 8px 0;margin:.7rem 0}
.ast{border-left:3px solid #16a34a;background:#f0fdf4;padding:.65rem .9rem;border-radius:0 8px 8px 0;margin:.7rem 0}
.err{border-left:3px solid #dc2626;background:#fef2f2;padding:.65rem .9rem;border-radius:0 8px 8px 0;margin:.7rem 0}
code{background:#f1f5f9;padding:.12rem .38rem;border-radius:4px;font-size:.88em}
table{width:100%;border-collapse:collapse;margin:.7rem 0;font-size:.92rem}
th,td{text-align:left;padding:.45rem .6rem;border-bottom:1px solid var(--bord)}
th{background:var(--fond);font-size:.85rem;color:var(--gris)}
.cache{display:none}
.vide{text-align:center;color:var(--gris);padding:2rem}
footer{text-align:center;color:var(--gris);font-size:.85rem;padding:2.5rem 1rem}
@media(prefers-color-scheme:dark){
  body{background:#0f172a;color:#e2e8f0}
  .barre,section,.som{background:#1e293b;border-color:#334155}
  /* 21/07 : les encadres gardaient un fond clair avec du texte sombre en
     theme sombre -> illisible. On impose fond ET couleur de texte. */
  .enc,.att,.ast,.err{color:#f1f5f9}
  .enc{background:#172554;border-left-color:#60a5fa}
  .att{background:#422006;border-left-color:#f59e0b}
  .ast{background:#052e16;border-left-color:#4ade80}
  .err{background:#450a0a;border-left-color:#f87171}
  .enc b,.att b,.ast b,.err b{color:#fff}
  table td,table th{color:#e2e8f0}
  section h3,.som h2{color:#93c5fd}
  code{background:#334155}
  th{background:#0f172a}
  .role{background:#1e3a8a;color:#bfdbfe}
  .role.admin{background:#78350f;color:#fde68a}
}
@media print{
  .barre,.som{display:none}
  section{break-inside:avoid;border:none;border-bottom:1px solid #ccc;border-radius:0}
  body{background:#fff}
}

/* Sous-titres de section (A. / B. / C.) — ajoutes le 21/07 avec la procedure
   d'installation detaillee : sans style, ils se confondaient avec le texte. */
section h4{margin:1.4rem 0 .4rem;font-size:1.02rem;color:var(--bleu);
  border-bottom:2px solid var(--bord);padding-bottom:.3rem}
section h4+p{margin-top:.5rem}
section p>b:first-child{color:var(--bleu)}
@media(prefers-color-scheme:dark){
  section h4{color:#93c5fd;border-bottom-color:#334155}
  section p>b:first-child{color:#bfdbfe}
}