/* État des services (statut.html, assets/js/statut.js). Page blanche comme les
   pages légales : l'état est dit en toutes lettres ; seules les barres des
   90 derniers jours portent une couleur, rouge pour un jour de panne. */
body.page-legale--statut { background-image: url("/assets/img/fond-statut.svg?v=1"); }
body.page-statut .section > .container.statut { max-width: 960px !important; }
.statut-general { padding: 1.25rem 0 1.5rem; border-bottom: 1px solid #ddd; margin-bottom: 1.5rem; }
.statut-general-texte { font-size: 1.35rem; font-weight: 700; color: #111; margin: 0; }
.statut-maj { color: #555; font-size: 0.9rem; margin: 0.35rem 0 0; }
.statut-annonce { border-left: 3px solid #111; padding: 0.5rem 0 0.5rem 1rem; margin: 0 0 1.5rem; }
.statut-annonce h2 { font-size: 1.05rem; font-weight: 700; margin: 0 0 0.25rem; color: #111; }
.statut-annonce p { margin: 0; color: #222; white-space: pre-line; }
.statut-annonce .statut-annonce-date { color: #555; font-size: 0.85rem; margin-top: 0.35rem; }
.statut-groupe { margin: 0 0 2rem; }
.statut-groupe h2 { font-size: 0.95rem; font-weight: 700; color: #555; text-transform: uppercase; letter-spacing: 0.04em; margin: 0 0 0.5rem; }
.statut-service { border-top: 1px solid #e5e5e5; padding: 0.9rem 0 0.75rem; }
.statut-service:last-child { border-bottom: 1px solid #e5e5e5; }
.statut-ligne { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; }
.statut-nom { font-weight: 600; color: #111; }
.statut-etat { color: #111; font-size: 0.95rem; text-align: right; }
.statut-etat--panne { color: #b3121b; font-weight: 600; }
.statut-barres { display: flex; gap: 2px; height: 30px; margin: 0.6rem 0 0.35rem; }
.statut-barre { flex: 1 1 0; min-width: 2px; border-radius: 1px; background: #1f2937; }
.statut-barre--vide { background: #e5e7eb; }
.statut-barre--partiel { background: #9ca3af; }
.statut-barre--panne { background: #b3121b; }
.statut-barre--maintenance { background: #d1d5db; }
.statut-barre:hover, .statut-barre:focus-visible { outline: 2px solid #111; outline-offset: 1px; }
.statut-bas { display: flex; justify-content: space-between; gap: 1rem; color: #555; font-size: 0.82rem; }
.statut-legende { color: #555; font-size: 0.85rem; margin-top: 1rem; }
@media (max-width: 640px) {
  .statut-barres { gap: 1px; height: 26px; }
  .statut-ligne { flex-direction: column; gap: 0.15rem; }
  .statut-etat { text-align: left; }
  .statut-general-texte { font-size: 1.15rem; }
}
