/*
	Accessibilite : navigation clavier et contenus reserves aux lecteurs d'ecran.
	Cette feuille est appelee explicitement, juste avant </head>, par chaque page
	du kiosque comportant un lien d'evitement, afin d'etre chargee apres les
	feuilles de charte graphique.

	References : RGAA 4.1.2 criteres 10.7 (visibilite de la prise de focus) et
	12.7 (lien d'evitement), WCAG 2.1 2.4.7 et 1.4.11.
*/

/* --------------------------------------------------------------------------
	Lien d'evitement : hors ecran tant qu'il n'a pas le focus clavier.
	-------------------------------------------------------------------------- */
.lien-evitement {
	position: absolute;
	left: -10000px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.lien-evitement:focus {
	position: fixed;
	left: 1rem;
	top: 1rem;
	width: auto;
	height: auto;
	overflow: visible;
	z-index: 10000;
	padding: .75rem 1rem;
	background: #fff;
	color: #000;
}

/* --------------------------------------------------------------------------
	Texte restitue par les lecteurs d'ecran mais non affiche a l'ecran.
	Equivalent de la classe Bootstrap .visually-hidden, pour les pages qui ne
	chargent pas Bootstrap.
	-------------------------------------------------------------------------- */
.texte-lecteur-ecran {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

/* --------------------------------------------------------------------------
	Indicateur de prise de focus clavier.

	Double anneau : halo blanc collant a l'element (0 a 2 px) puis trait noir
	de 3 px (2 a 5 px). L'anneau reste ainsi perceptible sur fond clair comme
	sur fond sombre (en-tetes et pieds de page de la charte).

	Le prefixe "html body" et la double pseudo-classe ":focus-visible:focus"
	sont necessaires pour depasser la regle ".ext-webkit *:focus { outline:
	none !important; }" de ext-js/resources/css/ext-all.css, qui supprime sinon
	l'anneau de focus des boutons et des champs de saisie. Sans cela, seuls les
	liens conservent un indicateur.
	-------------------------------------------------------------------------- */
html body a[href]:focus-visible:focus,
html body area[href]:focus-visible:focus,
html body button:focus-visible:focus,
html body input:focus-visible:focus,
html body select:focus-visible:focus,
html body textarea:focus-visible:focus,
html body summary:focus-visible:focus,
html body [contenteditable="true"]:focus-visible:focus,
html body [tabindex]:not([tabindex="-1"]):focus-visible:focus,
html body div#tarteaucitronAlertBig:focus {
	outline: 3px solid #000 !important;
	outline-offset: 2px !important;
	box-shadow: 0 0 0 5px #fff !important;
}

/* Cible d'un lien d'evitement : la prise de focus est technique, inutile
	d'encadrer tout le contenu de la page. */
#contenu-principal:focus {
	outline: none;
}
