/* Outils gratuits (/outils/, /en/tools/) : par-dessus site.css, mêmes jetons :root.
   Gabarit : outils/lib/gabarit.php. Niveaux : niv-ok, niv-attn, niv-err, niv-info. */

:root {
	--ok: #2f6a2f;       --ok-fond: #e8f3e5;   --ok-trait: #4c9a4c;
	--attn: #875400;     --attn-fond: #fdf2d9; --attn-trait: #e3a21a;
	--err: #b3261e;      --err-fond: #fbeae8;  --err-trait: #d64532;
	--info: #4f5f70;     --info-fond: #eef3f6; --info-trait: #9fb3c0;
}

/* En-tête : logo, liens, bouton */
.outil-entete { flex-wrap: wrap; padding-left: max(1.1em, calc((100% - 60em) / 2)); padding-right: max(1.1em, calc((100% - 60em) / 2)); }
.outil-entete .entete-logo { width: 6.5em; } /* 4.2em ailleurs (site.css) */
.outil-nav { display: flex; align-items: center; gap: 0.4em 1.2em; flex-wrap: wrap; }
.outil-nav-lien { font-weight: 600; text-decoration: none; color: var(--gris); }
.outil-nav-lien:hover { color: var(--encre); text-decoration: underline; text-underline-offset: 0.25em; }
.outil-langue { font-family: var(--mono); font-size: 0.85em; font-weight: 500; }
@media (max-width: 36em) {
	.outil-nav .bouton { padding: 0.7em 1.1em; font-size: 0.9em; }
}

/* Conteneur */
.outil { max-width: 60em; margin: 0 auto; padding: 3em 1.1em 2em; }
.outil-pied { max-width: 60em; margin: 1.5em auto 0; padding-left: 1.1em; padding-right: 1.1em; }

/* Signature (gabarit.php, pd_pied) : qui offre les outils, lien vers les réalisations */
.outil-signature { max-width: 60em; margin: 3em auto 0; padding: 0 1.1em; }
.outil-signature > div { display: flex; align-items: flex-start; gap: 1em; padding: 1.3em 1.4em; border-radius: 1em; background: var(--brume); }
.outil-signature img { flex: 0 0 auto; width: 2.75em; height: 2.75em; border-radius: 0.6em; }
.outil-signature p { margin: 0; color: var(--gris); line-height: 1.55; }
.outil-signature strong { color: var(--encre); }
.outil-signature a { display: inline-block; margin-top: 0.2em; font-weight: 700; color: var(--orange-texte); text-underline-offset: 0.2em; }
.outil-signature a:hover { color: var(--encre); }

/* Tête de page */
.outil-tete { margin-bottom: 2em; }
.outil-tete h1 {
	margin: 0;
	font-family: var(--titre);
	font-weight: 700;
	font-size: clamp(2.1em, 5.5vw, 3.4em);
	line-height: 1.02;
	letter-spacing: -0.025em;
	max-width: 16em;
}
.outil-tete h1 em { font-style: normal; background: linear-gradient(transparent 62%, #f079195e 62%); }
.outil-chapeau { margin: 0.8em 0 0; font-size: 1.2em; color: var(--gris); max-width: 36em; }

/* Formulaire */
.outil-form {
	padding: 1.4em;
	border-radius: 1.1em;
	background: #fff;
	border: 1px solid var(--trait);
	box-shadow: 0 1.5em 3em -2em #13243a66;
}
.outil-form label.outil-etiquette { display: block; margin-bottom: 0.5em; font-weight: 700; }
.outil-rangee { display: flex; gap: 0.6em; flex-wrap: wrap; }
.outil-rangee input {
	flex: 1 1 14em;
	min-width: 0;
	padding: 0.85em 1em;
	border: 1px solid transparent;
	border-radius: 0.7em;
	background: var(--brume);
	color: var(--encre);
	font: 500 1.1em/1.3 var(--mono);
}
.outil-rangee input:focus { outline: 0; border-color: var(--encre); background: #fff; }
.outil-rangee .bouton { flex: 0 0 auto; font-size: 1.05em; }
.outil-options { margin-top: 0.9em; }
.outil-options summary { cursor: pointer; color: var(--gris); font-size: 0.92em; font-weight: 600; }
.outil-options summary:hover { color: var(--encre); }
.outil-options[open] summary { margin-bottom: 0.7em; }
.outil-options input {
	width: 100%;
	max-width: 24em;
	padding: 0.65em 0.85em;
	border: 1px solid transparent;
	border-radius: 0.6em;
	background: var(--brume);
	font: 400 1em/1.3 var(--mono);
	color: var(--encre);
}
.outil-options input:focus { outline: 0; border-color: var(--encre); background: #fff; }
.outil-aide { margin: 0.5em 0 0; font-size: 0.88em; color: var(--gris); }
.outil-exemples { margin: 0.9em 0 0; font-size: 0.88em; color: var(--gris); }
.outil-exemples a { color: var(--orange-texte); font-family: var(--mono); text-underline-offset: 0.2em; overflow-wrap: anywhere; }
.outil-confidentiel { margin: 0.9em 0 0; font-size: 0.85em; color: var(--gris); }

/* Chargement */
.resultats { margin-top: 2.2em; scroll-margin-top: 1em; }
.resultats:empty { display: none; }
.chargement { display: flex; align-items: center; gap: 1em; padding: 1.4em; border-radius: 1em; background: var(--grisé); color: var(--gris); font-weight: 600; }
.chargement::before {
	content: "";
	flex: none;
	width: 1.4em;
	height: 1.4em;
	border-radius: 50%;
	border: 0.2em solid var(--brume-2);
	border-top-color: var(--orange);
	animation: tourne .8s linear infinite;
}
@keyframes tourne { to { transform: rotate(1turn); } }
.erreur-outil { padding: 1.2em 1.4em; border-radius: 1em; background: var(--err-fond); color: var(--err); font-weight: 600; }

/* Pastilles */
.pastille {
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
	padding: 0.25em 0.75em;
	border-radius: 3em;
	font: 700 0.8em/1.3 var(--texte);
	max-width: 100%; /* ne sort jamais de sa boîte : le texte passe à la ligne au besoin */
	overflow-wrap: anywhere;
}
.pastille::before { content: ""; flex: none; width: 0.55em; height: 0.55em; border-radius: 50%; background: currentColor; }
.pastille.niv-ok { background: var(--ok-fond); color: var(--ok); }
.pastille.niv-attn { background: var(--attn-fond); color: var(--attn); }
.pastille.niv-err { background: var(--err-fond); color: var(--err); }
.pastille.niv-info { background: var(--info-fond); color: var(--info); }

/* Sommaire */
.res-sommaire {
	padding: 1.6em 1.4em;
	border-radius: 1.1em;
	background: var(--brume);
}
.res-sommaire-tete { display: flex; justify-content: space-between; align-items: flex-start; gap: 1em; flex-wrap: wrap; margin-bottom: 1.2em; }
.res-domaine { margin: 0; font-family: var(--titre); font-weight: 700; font-size: clamp(1.5em, 4vw, 2.2em); line-height: 1.1; letter-spacing: -0.02em; overflow-wrap: anywhere; }
.res-meta { margin: 0.3em 0 0; color: var(--gris); font-size: 0.9em; }
.res-verdict { margin: 0 0 1.2em; font-size: 1.1em; font-weight: 600; }
.res-lien { display: flex; gap: 0.5em; align-items: center; flex-wrap: wrap; }
.tuiles { display: grid; gap: 0.8em; grid-template-columns: repeat(auto-fit, minmax(13em, 1fr)); }
.tuile {
	display: block;
	padding: 1em 1.1em;
	border-radius: 0.9em;
	background: #fff;
	border-top: 0.3em solid var(--info-trait);
	text-decoration: none;
	transition: transform .2s, box-shadow .2s;
}
.tuile:hover { transform: translateY(-0.12em); box-shadow: 0 0.8em 1.5em -1em #13243a55; }
.tuile.niv-ok { border-top-color: var(--ok-trait); }
.tuile.niv-attn { border-top-color: var(--attn-trait); }
.tuile.niv-err { border-top-color: var(--err-trait); }
/* Pastille à droite du nom, ou dessous quand la place manque */
.tuile-tete { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 0.3em 0.5em; margin-bottom: 0.4em; }
.tuile-nom { min-width: 0; font-family: var(--titre); font-weight: 700; font-size: 1.3em; overflow-wrap: anywhere; }
.tuile p { margin: 0; color: var(--gris); font-size: 0.92em; }

/* Liste de contrôle (Gmail et Yahoo) */
.controle { margin-top: 1.2em; padding: 1.2em 1.3em; border-radius: 0.9em; background: #fff; }
.controle h3 { margin: 0 0 0.7em; font-family: var(--titre); font-size: 1.1em; }
.controle ul { margin: 0; padding: 0; list-style: none; }
.controle li { display: flex; gap: 0.7em; align-items: baseline; padding: 0.35em 0; }
.controle-icone { flex: none; display: inline-grid; place-items: center; width: 1.4em; height: 1.4em; border-radius: 50%; font-size: 0.8em; font-weight: 700; transform: translateY(0.15em); }
.controle-icone.niv-ok { background: var(--ok-fond); color: var(--ok); }
.controle-icone.niv-err { background: var(--err-fond); color: var(--err); }
.controle-icone.niv-attn { background: var(--attn-fond); color: var(--attn); }
.controle-note { margin: 0.8em 0 0; font-size: 0.86em; color: var(--gris); }

/* Blocs de résultats */
.res-bloc { margin-top: 2.6em; scroll-margin-top: 1em; }
.res-bloc-tete { display: flex; align-items: center; gap: 0.8em; flex-wrap: wrap; padding-top: 0.9em; border-top: 0.19em solid var(--encre); }
.res-bloc-tete h3 { margin: 0; font-family: var(--titre); font-weight: 700; font-size: 1.6em; letter-spacing: -0.01em; }
.res-role { margin: 0.5em 0 1.2em; color: var(--gris); max-width: 42em; }
.res-bloc h4 { margin: 1.6em 0 0.6em; font-size: 0.8em; font-family: var(--mono); font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; color: var(--gris); }

/* Enregistrement DNS */
.enreg { position: relative; margin: 0 0 0.8em; border-radius: 0.8em; background: var(--grisé); border: 1px solid var(--trait); overflow: hidden; }
.enreg-tete { display: flex; justify-content: space-between; align-items: center; gap: 0.6em; padding: 0.5em 0.6em 0.5em 1em; border-bottom: 1px solid var(--trait); color: var(--gris); font-family: var(--mono); font-size: 0.78em; overflow-wrap: anywhere; }
.enreg code { display: block; padding: 0.9em 1em; font: 400 0.92em/1.6 var(--mono); color: var(--encre); overflow-wrap: anywhere; white-space: pre-wrap; }
.copier {
	flex: none;
	padding: 0.35em 0.8em;
	border: 1px solid var(--trait);
	border-radius: 3em;
	background: #fff;
	color: var(--encre);
	font: 600 0.95em/1.2 var(--texte);
	cursor: pointer;
}
.copier:hover { border-color: var(--encre); }
.copier.copie { background: var(--ok-fond); border-color: var(--ok-fond); color: var(--ok); }

/* Décodage terme par terme */
.decode { width: 100%; border-collapse: collapse; font-size: 0.95em; }
.decode th { padding: 0.5em 0.8em 0.5em 0; border-bottom: 1px solid var(--trait); text-align: left; font: 400 0.72em/1.3 var(--mono); letter-spacing: 0.08em; text-transform: uppercase; color: var(--gris); }
.decode td { padding: 0.65em 0.8em 0.65em 0; border-bottom: 1px solid var(--trait); vertical-align: top; }
.decode td:first-child { width: 38%; }
.decode td.nb, .decode th.nb { width: 5em; text-align: right; padding-right: 0; font-family: var(--mono); }
.decode code { font: 400 0.95em/1.4 var(--mono); overflow-wrap: anywhere; }
.decode .service { display: inline-block; margin: 0.25em 0 0; padding: 0.1em 0.55em; border-radius: 3em; background: var(--peche); color: var(--orange-texte); font-size: 0.8em; font-weight: 600; }
.decode tr.ignore td { opacity: .55; }
.decode tr.erreur td:first-child code { color: var(--err); }
.decode .note { display: block; margin-top: 0.2em; font-size: 0.88em; color: var(--gris); }
.decode tr.sous > td { padding: 0 0 0.6em; border-bottom: 1px solid var(--trait); }
.sous-detail { margin: 0.2em 0 0 1em; padding: 0.2em 0 0.2em 1em; border-left: 0.2em solid var(--brume-2); }
.sous-detail > summary { cursor: pointer; padding: 0.3em 0; font-size: 0.9em; font-weight: 600; color: var(--gris); }
.sous-detail > summary:hover { color: var(--encre); }
.sous-detail .enreg { margin-top: 0.4em; }

/* Compteur de recherches DNS (SPF) */
.compteur { margin: 1.2em 0 0.4em; }
.compteur-tete { display: flex; justify-content: space-between; gap: 1em; font-weight: 600; margin-bottom: 0.45em; }
.compteur-tete .mono { color: var(--gris); }
.compteur-barre { display: grid; grid-template-columns: repeat(10, 1fr); gap: 0.25em; }
.compteur-barre i { height: 0.6em; border-radius: 0.3em; background: var(--brume); }
.compteur.niv-ok .compteur-barre i.plein { background: var(--ok-trait); }
.compteur.niv-attn .compteur-barre i.plein { background: var(--attn-trait); }
.compteur.niv-err .compteur-barre i.plein { background: var(--err-trait); }

/* Constats */
.constats { margin: 1em 0 0; padding: 0; list-style: none; display: grid; gap: 0.6em; }
.constat {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 0.2em 0.9em;
	overflow-wrap: anywhere;
	padding: 1em 1.1em;
	border-radius: 0.8em;
	border-left: 0.3em solid var(--info-trait);
	background: var(--info-fond);
}
.constat.niv-ok { border-left-color: var(--ok-trait); background: var(--ok-fond); }
.constat.niv-attn { border-left-color: var(--attn-trait); background: var(--attn-fond); }
.constat.niv-err { border-left-color: var(--err-trait); background: var(--err-fond); }
.constat-icone { display: grid; place-items: center; width: 1.6em; height: 1.6em; border-radius: 50%; background: #fff; font-weight: 700; font-size: 0.9em; }
.constat.niv-ok .constat-icone { color: var(--ok); }
.constat.niv-attn .constat-icone { color: var(--attn); }
.constat.niv-err .constat-icone { color: var(--err); }
.constat.niv-info .constat-icone { color: var(--info); }
.constat-titre { margin: 0.1em 0 0.25em; font-weight: 700; }
.constat p { margin: 0 0 0.4em; }
.constat p:last-child { margin-bottom: 0; }
.constat-correctif { font-size: 0.95em; }
.constat code, .res-role code, .suggestion code, .guide code, .controle code {
	font-family: var(--mono);
	font-size: 0.88em;
	padding: 0.05em 0.3em;
	border-radius: 0.3em;
	background: #ffffffb3;
}

/* Clés DKIM */
.cles { display: grid; gap: 0.8em; }
.cle { padding: 1em 1.1em; border-radius: 0.9em; border: 1px solid var(--trait); background: #fff; }
.cle-tete { display: flex; justify-content: space-between; align-items: center; gap: 0.6em; flex-wrap: wrap; margin-bottom: 0.6em; }
.cle-nom { font-family: var(--mono); font-weight: 500; overflow-wrap: anywhere; }
.cle-faits { display: flex; gap: 0.4em 1.2em; flex-wrap: wrap; margin: 0 0 0.6em; padding: 0; list-style: none; color: var(--gris); font-size: 0.9em; }
.cle-faits strong { color: var(--encre); }
.essayes { margin: 0.8em 0 0; font-size: 0.85em; color: var(--gris); }
.essayes code { font-family: var(--mono); font-size: 0.9em; }

/* MX */
.mx-liste { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--trait); }
.mx-liste li { display: flex; gap: 1em; padding: 0.55em 0; border-bottom: 1px solid var(--trait); font-family: var(--mono); font-size: 0.92em; overflow-wrap: anywhere; }
.mx-liste span { flex: none; width: 3em; color: var(--gris); }

/* Extras (MTA-STS, TLS-RPT, BIMI) */
.extras { display: grid; gap: 0.8em; grid-template-columns: repeat(auto-fit, minmax(15em, 1fr)); }
.extra { padding: 1em 1.1em; border-radius: 0.9em; background: var(--grisé); }
.extra-tete { display: flex; justify-content: space-between; gap: 0.5em; align-items: center; margin-bottom: 0.4em; }
.extra-tete strong { font-family: var(--titre); font-size: 1.1em; }
.extra p { margin: 0; font-size: 0.9em; color: var(--gris); }
.extra a { color: var(--orange-texte); }

/* Suggestion d'enregistrement */
.suggestion { margin-top: 1em; padding: 1.1em 1.2em; border-radius: 0.9em; border: 1px dashed var(--orange-texte); background: #fff; }
.suggestion-titre { margin: 0 0 0.3em; font-weight: 700; color: var(--orange-texte); }
.suggestion p { margin: 0 0 0.6em; }
.suggestion .enreg { margin-bottom: 0.6em; }
.suggestion-note { font-size: 0.9em; color: var(--gris); }

/* Guide (texte explicatif sous l'outil) */
.guide { margin-top: 4.5em; }
.guide > section { margin-top: 3.2em; }
.guide h2 {
	margin: 0 0 0.8em;
	padding-top: 0.9em;
	border-top: 0.19em solid var(--encre);
	font-family: var(--titre);
	font-weight: 700;
	font-size: clamp(1.5em, 3.4vw, 2.1em);
	line-height: 1.1;
	letter-spacing: -0.02em;
}
.guide h3 { margin: 1.4em 0 0.4em; font-family: var(--titre); font-size: 1.2em; }
.guide p, .guide li { max-width: 44em; }
.guide p { margin: 0 0 1em; }
.guide a { color: var(--orange-texte); text-underline-offset: 0.2em; }
.guide-chapeau { font-size: 1.15em; color: var(--gris); }
.guide-cartes { display: grid; gap: 1em; grid-template-columns: repeat(auto-fit, minmax(15em, 1fr)); margin: 1.4em 0; }
.guide-carte { padding: 1.3em 1.3em 1.1em; border-radius: 1em; background: var(--grisé); }
.guide-carte .mono { color: var(--orange-texte); }
.guide-carte h3 { margin: 0.3em 0 0.5em; font-size: 1.35em; }
.guide-carte p { margin: 0 0 0.6em; font-size: 0.97em; }
.guide-carte p:last-child { margin: 0; color: var(--gris); font-size: 0.9em; }
.etapes { margin: 1.2em 0; padding: 0; list-style: none; counter-reset: etape; }
.etapes li { position: relative; padding: 0.2em 0 1.1em 3.4em; counter-increment: etape; }
.etapes li::before {
	content: counter(etape, decimal-leading-zero);
	position: absolute;
	left: 0;
	top: 0.1em;
	font: 500 0.95em/1.6 var(--mono);
	color: var(--orange-texte);
}
.etapes strong { display: block; }
.exigences { display: grid; gap: 1em; grid-template-columns: repeat(auto-fit, minmax(16em, 1fr)); margin: 1.2em 0; }
.exigence { padding: 1.2em 1.3em; border-radius: 1em; border: 1px solid var(--trait); }
.exigence h3 { margin: 0 0 0.5em; }
.exigence ul { margin: 0; padding-left: 1.1em; }
.exigence li { margin-bottom: 0.35em; }
.faq details { border-bottom: 1px solid var(--trait); }
.faq details:first-of-type { border-top: 1px solid var(--trait); }
.faq summary { cursor: pointer; padding: 1em 2em 1em 0; font-weight: 700; list-style: none; position: relative; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: 0.3em; top: 0.8em; font: 400 1.3em/1 var(--mono); color: var(--orange-texte); }
.faq details[open] summary::after { content: "−"; }
.faq details > div { padding: 0 0 1em; }
.cta {
	margin-top: 3.5em;
	padding: 1.8em 1.6em;
	border-left: 0.35em solid var(--orange);
	border-radius: 1em;
	background: var(--peche);
}
.cta h2 { margin: 0 0 0.4em; padding: 0; border: 0; font-size: 1.5em; }
.cta p { margin: 0 0 1.1em; max-width: 38em; }

/* Page d'index des outils */
.outils-groupe { margin-top: 2.8em; }
.outils-groupe h2 {
	margin: 0 0 1em;
	padding-top: 0.8em;
	border-top: 0.19em solid var(--encre);
	font-family: var(--titre);
	font-size: 1.5em;
	letter-spacing: -0.01em;
}
.outils-cartes { display: grid; gap: 1em; grid-template-columns: repeat(auto-fill, minmax(16em, 1fr)); margin: 0; padding: 0; list-style: none; }
.outil-carte {
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: 1.3em 1.3em 1.1em;
	border-radius: 1em;
	background: #fff;
	border: 1px solid var(--trait);
	text-decoration: none;
	transition: transform .2s, box-shadow .2s, border-color .2s;
}
.outil-carte:hover { transform: translateY(-0.15em); border-color: var(--encre); box-shadow: 0 1em 2em -1.4em #13243a66; }
.outil-carte h3 { margin: 0 0 0.4em; font-family: var(--titre); font-size: 1.2em; line-height: 1.15; }
.outil-carte p { margin: 0 0 1em; color: var(--gris); font-size: 0.95em; }
.outil-carte .mono { margin-top: auto; color: var(--orange-texte); }
.outil-carte.vedette { background: var(--peche); border-color: transparent; }

@media (max-width: 40em) {
	.outil { padding-top: 2em; }
	.outil-form { padding: 1.1em; }
	.outil-rangee .bouton { width: 100%; justify-content: center; }
	.res-sommaire { padding: 1.3em 1.1em; }
	/* Le tableau de décodage devient une liste */
	.decode thead { display: none; }
	.decode, .decode tbody, .decode tr, .decode td { display: block; width: auto !important; }
	.decode tr { padding: 0.6em 0; border-bottom: 1px solid var(--trait); }
	.decode td { padding: 0.1em 0; border: 0; }
	.decode td.nb { text-align: left; color: var(--gris); font-size: 0.85em; }
	.decode td.nb:empty { display: none; }
	.decode td.nb[data-etiquette]::before { content: attr(data-etiquette) " : "; }
	.decode tr.sous { padding: 0; }
	.sous-detail { margin-left: 0.3em; }
}

@media (prefers-reduced-motion: reduce) {
	.chargement::before { animation: none; }
}

/* Texte lu par les lecteurs d'écran seulement */
.visuellement-cache { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.res-lien a.copier { text-decoration: none; display: inline-block; }
#resultats:focus { outline: 0; }
.constat a { color: var(--orange-texte); text-underline-offset: 0.2em; }
.insecable { white-space: nowrap; }

/* Bilan de tous les outils (/outils/bilan/) */
.bilan { margin-top: 2.4em; scroll-margin-top: 1em; }
.bilan-tete { display: flex; justify-content: space-between; align-items: baseline; gap: 0.5em 1em; flex-wrap: wrap; padding-top: 0.8em; border-top: 0.19em solid var(--encre); margin-bottom: 0.6em; }
.bilan-tete h2 { margin: 0; font-family: var(--titre); font-size: 1.5em; letter-spacing: -0.01em; }
.bilan-compte { margin: 0; color: var(--gris); }
.bilan-tableau { width: 100%; border-collapse: collapse; }
.bilan-tableau thead th { padding: 0.5em 0.8em 0.5em 0; border-bottom: 1px solid var(--trait); text-align: left; font: 400 0.72em/1.3 var(--mono); letter-spacing: 0.08em; text-transform: uppercase; color: var(--gris); }
.bilan-groupe th { padding: 1.4em 0 0.4em; text-align: left; font: 500 0.78em/1.3 var(--mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--orange-texte); border-bottom: 1px solid var(--trait); }
.bilan-ligne > * { padding: 0.8em 0.9em 0.8em 0; border-bottom: 1px solid var(--trait); vertical-align: top; text-align: left; }
.bilan-ligne th { width: 42%; font-weight: 600; }
.bilan-ligne th a { text-decoration: none; }
.bilan-ligne th a:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.bilan-desc { display: block; margin-top: 0.15em; font-weight: 400; font-size: 0.88em; color: var(--gris); }
.bilan-etat-in { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35em 0.6em; }
.bilan-resume { flex-basis: 100%; font-size: 0.9em; color: var(--gris); }
.bilan-note { display: inline-grid; place-items: center; width: 1.9em; height: 1.9em; border-radius: 0.45em; font: 700 1em/1 var(--titre); background: var(--info-fond); color: var(--info); }
.bilan-note.niv-ok { background: var(--ok-fond); color: var(--ok); }
.bilan-note.niv-attn { background: var(--attn-fond); color: var(--attn); }
.bilan-note.niv-err { background: var(--err-fond); color: var(--err); }
.bilan-cours::before { animation: pulsation 1s ease-in-out infinite; }
@keyframes pulsation { 50% { opacity: 0.25; } }
.bilan-action { width: 9em; text-align: right !important; padding-right: 0 !important; white-space: nowrap; }
.bilan-lien { color: var(--orange-texte); font-weight: 600; text-decoration: none; font-size: 0.92em; }
.bilan-lien:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.bilan-ligne[data-niveau="err"] > th, .bilan-ligne[data-niveau="erreur"] > th { box-shadow: inset 0.25em 0 0 var(--err-trait); padding-left: 0.8em; }
.bilan-ligne[data-niveau="attn"] > th { box-shadow: inset 0.25em 0 0 var(--attn-trait); padding-left: 0.8em; }
.bilan-ligne[data-niveau="ok"] > th, .bilan-ligne[data-niveau="info"] > th { box-shadow: inset 0.25em 0 0 var(--ok-trait); padding-left: 0.8em; }
.bilan + .outils-groupe { margin-top: 3.5em; }
@media (max-width: 40em) {
	.bilan-tableau thead { display: none; }
	.bilan-tableau, .bilan-tableau tbody, .bilan-tableau tr, .bilan-ligne > * { display: block; width: auto !important; }
	.bilan-ligne { padding: 0.7em 0 0.8em; border-bottom: 1px solid var(--trait); }
	.bilan-ligne > * { padding: 0.15em 0 !important; border: 0; text-align: left !important; }
	.bilan-ligne[data-niveau] { padding-left: 0.8em; box-shadow: inset 0.25em 0 0 var(--info-trait); }
	.bilan-ligne[data-niveau="ok"], .bilan-ligne[data-niveau="info"] { box-shadow: inset 0.25em 0 0 var(--ok-trait); }
	.bilan-ligne[data-niveau="attn"] { box-shadow: inset 0.25em 0 0 var(--attn-trait); }
	.bilan-ligne[data-niveau="err"], .bilan-ligne[data-niveau="erreur"] { box-shadow: inset 0.25em 0 0 var(--err-trait); }
	.bilan-ligne > th { box-shadow: none !important; padding-left: 0 !important; background: none !important; }
	.bilan-groupe th { display: block; }
}
@media (prefers-reduced-motion: reduce) { .bilan-cours::before { animation: none; } }
.bilan-imprimer { margin-left: auto; }
.bilan-pied-imprime { display: none; }
/* Impression du bilan : titre, tableau et mention Physalis Design, sur fond blanc */
@media print {
	body > *:not(main), .outil > *:not(.outil-tete):not(.bilan), .outil-tete > *:not(h1), .bilan-imprimer, .bilan-action, .bilan-tableau thead th:last-child { display: none !important; }
	body { background: #fff !important; }
	.outil { padding: 0; max-width: none; }
	.bilan { margin-top: 1em; }
	.bilan-tableau { font-size: 10pt; }
	.bilan-ligne { page-break-inside: avoid; }
	.bilan-ligne th a { color: inherit; }
	.bilan-pied-imprime { display: block; margin-top: 1.2em; font-size: 0.8em; color: #555; }
}

/* Exemples d'éléments fautifs sous un constat (outils pv/) */
.pv-exemples { margin: 0.5em 0 0; padding: 0; list-style: none; display: grid; gap: 0.25em; }
.pv-exemples li { font-size: 0.88em; color: var(--gris); overflow-wrap: anywhere; }

/* Générateur SPF et DMARC */
.pv-gen .res-bloc { margin-top: 2.2em; }
.pv-cases { display: grid; gap: 0.5em; grid-template-columns: repeat(auto-fill, minmax(15em, 1fr)); margin: 0 0 1.2em; }
.pv-case { display: flex; gap: 0.6em; align-items: flex-start; padding: 0.65em 0.8em; border-radius: 0.7em; border: 1px solid var(--trait); background: #fff; cursor: pointer; }
.pv-case:hover { border-color: var(--encre); }
.pv-case input { margin-top: 0.3em; accent-color: var(--orange-texte); }
.pv-case small { display: block; color: var(--gris); font-size: 0.78em; overflow-wrap: anywhere; }
.pv-choix { margin: 1.2em 0; padding: 0; border: 0; display: grid; gap: 0.4em; }
.pv-choix legend { margin-bottom: 0.4em; font-weight: 700; }
.pv-choix label { cursor: pointer; }
.pv-choix input { accent-color: var(--orange-texte); }
.pv-gen .outil-rangee + .outil-aide { margin-bottom: 0.4em; }
.pv-gen .enreg { margin-top: 1em; }

/* Longues chaînes (empreintes, adresses, jetons) : coupées plutôt que de faire déborder la page */
.outil code, .outil kbd, .outil samp { overflow-wrap: anywhere; }
.outil p a, .outil li a, .outil dd a { overflow-wrap: anywhere; }

/* Lien de retour vers tous les outils, sous l'analyse globale */
.bilan-tous { margin: 2.5em 0 0; }
.bilan-tous a { color: var(--orange-texte); font-weight: 600; text-decoration: none; }
.bilan-tous a:hover { text-decoration: underline; text-underline-offset: 0.2em; }

/* Rapport complet de l'analyse globale (outils-bilan.js) : tous les résultats, ouverts, l'un sous l'autre */
.bilan-complet-bouton { margin-left: auto; }
.bilan-complet-bouton + .bilan-imprimer { margin-left: 0; }
.bilan-complet { margin-top: 3em; scroll-margin-top: 1em; }
.bilan-complet-titre { margin: 0 0 0.4em; padding-top: 0.8em; border-top: 0.19em solid var(--encre); font-family: var(--titre); font-size: 1.5em; letter-spacing: -0.01em; }
.bilan-complet-groupe { margin: 2.6em 0 0; font: 500 0.78em/1.3 var(--mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--orange-texte); }
.bilan-complet-outil { margin-top: 1.4em; padding-top: 1.2em; border-top: 1px solid var(--trait); }
.bilan-complet-nom { margin: 0 0 0.8em; font-family: var(--titre); font-size: 1.3em; line-height: 1.2; }
.bilan-complet-nom a { text-decoration: none; }
.bilan-complet-nom a:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.bilan-complet-attente { color: var(--gris); font-style: italic; }
@media print {
	.bilan-complet-bouton { display: none !important; }
	.bilan-complet-outil { page-break-inside: auto; }
	.bilan-complet-nom { page-break-after: avoid; }
}