/* Parcours au clavier (outils/lib/pd/clavier.php) */

.pdx-cl-liste { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--trait); }
.pdx-cl-i { display: grid; grid-template-columns: 3em minmax(0, 1fr); gap: 0.6em; align-items: baseline; padding: 0.55em 0; border-bottom: 1px solid var(--trait); overflow-wrap: anywhere; }
.pdx-cl-n { justify-self: end; font: 500 0.85em/1.6 var(--mono); color: var(--orange-texte); }
.pdx-cl-type {
	display: inline-block;
	margin-right: 0.3em;
	padding: 0.05em 0.5em;
	border-radius: 0.3em;
	background: var(--brume);
	font: 500 0.72em/1.5 var(--mono);
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--gris);
	vertical-align: 0.1em;
}
.pdx-cl-nom { font-weight: 600; }
.pdx-cl-vide { font-weight: 400; font-style: italic; color: var(--gris); }
.pdx-cl-dest, .pdx-cl-source { font-family: var(--mono); font-size: 0.78em; color: var(--gris); }
.pdx-cl-note { display: block; font-size: 0.85em; color: var(--gris); }
.pdx-cl-i .pastille { margin-left: 0.2em; vertical-align: 0.1em; }
.pdx-cl-positif { background: var(--attn-fond); }
/* Séparation « Début du contenu principal » */
.pdx-cl-repere { padding: 0.8em 0 0.4em; border-bottom: 1px solid var(--trait); }
.pdx-cl-repere span { display: inline-block; padding: 0.15em 0.7em; border-radius: 3em; background: var(--peche); color: var(--orange-texte); font: 500 0.75em/1.4 var(--mono); letter-spacing: 0.05em; text-transform: uppercase; }

@media (max-width: 40em) {
	.pdx-cl-i { grid-template-columns: 2.2em minmax(0, 1fr); gap: 0.4em; }
}