/* ==========================================================================
   SIMPLE Accessibility — feuille de style de la façade

   La déclaration d'accessibilité ([simple_accessibility]) et la mention de
   pied de page. La déclaration est une page ordinaire : elle hérite du thème
   (police, couleurs, titres) ; seules quelques marges sont posées ici.
   Tout est en em.
   ========================================================================== */

/* ------------------------------------------------------------------ Déclaration */

/* Adresses longues (https://…) : coupées où il faut, sinon la page défile sur le côté à 320 pixels (RGAA 10.11). */
.sphf-accessibility-statement p, .sphf-accessibility-statement li, .sphf-accessibility-statement a { overflow-wrap: anywhere; word-break: break-word; }
.sphf-accessibility-statement a { text-decoration: underline; }
.sphf-accessibility-statement__note { font-style: italic; }

/* ------------------------------------------------------------------ Contrôles automatiques (en tête) */

/* Bloc graphique : anneau de score, tuiles, barres par principe. Il hérite du thème ; ses couleurs
   (variables posées par SPHF_Accessibility_Front::dash_colors()) font au moins 4,5:1 sur fond clair. */
.sphf-accessibility-dash { margin: 0 0 2.5em; padding: 1.25em 1.5em; border: 1px solid var(--sphf-accessibility-line); border-radius: .75em; }
.sphf-accessibility-dash h2 { margin-top: 0; }
.sphf-accessibility-dash__top { display: flex; flex-wrap: wrap; align-items: center; gap: 1.5em; margin-bottom: 1.25em; }
.sphf-accessibility-dash__ring { position: relative; display: flex; flex: 0 0 auto; flex-direction: column; align-items: center; justify-content: center; width: 9.5em; height: 9.5em; margin: 0; text-align: center; }
.sphf-accessibility-dash__ring::before { content: ""; position: absolute; inset: 0; border-radius: 50%; background: conic-gradient(var(--sphf-accessibility-ok) calc(var(--sphf-accessibility-score) * 1%), var(--sphf-accessibility-ko) 0); -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - .85em), currentColor calc(100% - .8em)); mask: radial-gradient(farthest-side, transparent calc(100% - .85em), currentColor calc(100% - .8em)); }
.sphf-accessibility-dash__pct { font-size: 2.1em; font-weight: 700; line-height: 1.1; }
.sphf-accessibility-dash__lbl { max-width: 6.5em; font-size: .8em; line-height: 1.2; }
.sphf-accessibility-dash__tiles { display: grid; flex: 1 1 16em; grid-template-columns: repeat(auto-fit, minmax(5.5em, 1fr)); gap: .75em; margin: 0; padding: 0; list-style: none; }
/* Le thème pose souvent un retrait sur les listes du contenu : annulé ici. */
.sphf-accessibility-statement .sphf-accessibility-dash__tiles { margin: 0; padding: 0; }
.sphf-accessibility-dash__tiles li::marker { content: ""; }
.sphf-accessibility-dash__tiles li { list-style: none; margin: 0; padding: .6em .8em; border: 1px solid var(--sphf-accessibility-line); border-radius: .5em; }
.sphf-accessibility-dash__tiles strong { display: block; font-size: 1.7em; line-height: 1.1; }
.sphf-accessibility-dash__tiles .is-fail strong { color: var(--sphf-accessibility-ko); }
.sphf-accessibility-dash__tiles .is-review strong { color: var(--sphf-accessibility-warn); }
.sphf-accessibility-dash__tiles .is-pass strong { color: var(--sphf-accessibility-ok); }
.sphf-accessibility-dash__table { width: 100%; margin: 0 0 1em; border-collapse: collapse; }
.sphf-accessibility-dash__table th, .sphf-accessibility-dash__table td { padding: .45em .5em; border-bottom: 1px solid var(--sphf-accessibility-line); text-align: left; vertical-align: middle; }
.sphf-accessibility-dash__score { white-space: nowrap; }
.sphf-accessibility-dash__bar { display: inline-block; width: 8em; max-width: 30vw; height: .65em; margin-right: .4em; vertical-align: middle; border: 1px solid var(--sphf-accessibility-edge); border-radius: .35em; background: linear-gradient(90deg, var(--sphf-accessibility-ok) calc(var(--sphf-accessibility-score) * 1%), transparent 0); }
.sphf-accessibility-dash__failed { margin: 0 0 1em; }
.sphf-accessibility-dash__failed summary { cursor: pointer; font-weight: 600; }
.sphf-accessibility-dash__note { margin: 0; font-size: .9em; font-style: italic; }
.sphf-accessibility-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (max-width: 30em) {
	.sphf-accessibility-dash { padding: 1em; }
	.sphf-accessibility-dash__bar { display: none; }
	/* Sur un téléphone : le principe et son score ; les nombres sont dans les tuiles. */
	.sphf-accessibility-dash__table th:nth-child(n+3), .sphf-accessibility-dash__table td:nth-child(n+3) { display: none; }
}

/* ------------------------------------------------------------------ Mention de pied de page */

/* Hors de toute enveloppe SIMPLE : elle suit le thème (police, couleurs) et reste lisible. */
/* Couleurs système Canvas / CanvasText : contraste garanti quel que soit le thème. */
.sphf-accessibility-mention { margin: 0; padding: .75em 1em; text-align: center; font-size: .9em; background: Canvas; color: CanvasText; }
.sphf-accessibility-mention p { margin: 0; }
.sphf-accessibility-mention a { color: CanvasText; text-decoration: underline; }
