/**
 * UbiK - Corrections Accessibilité Divi : lien d'évitement, focus visible,
 * neutralisation des boutons, sous-menus et accordéons au clavier.
 * Jamais chargé dans le Visual Builder (UbiK_Divi_A11y::is_divi_builder()).
 */

/* Lien d'évitement : hors écran tant qu'il n'a pas le focus clavier */
.ubik-skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 100000;
	padding: 12px 20px;
	background: #fff;
	color: #000;
	border: 2px solid var(--ubik-focus-color);
	text-decoration: none;
	font-size: 16px;
	border-radius: 7px;
}
.ubik-skip-link:focus {
	left: 6px;
	top: 6px;
}

/* Couleur de l'indicateur de focus, à ajuster ici selon la charte du site.
   RGAA 10.7 : contraste minimum 3:1 avec le fond adjacent. */
:root {
	--ubik-focus-color: #0d6efd;
}

/* Focus des liens, boutons et éléments rendus focusables.
   Anneau détaché classique : ces éléments ne s'allument qu'au clavier
   (heuristique navigateur), le halo n'apparaît donc jamais au clic souris.
   Le lien d'évitement est exclu : sa bordure colorée fait déjà office
   d'indicateur, un anneau par-dessus serait redondant et rogné.
   Les éléments à tabindex='-1' sont exclus aussi : ils ne sont jamais
   atteignables au Tab, ils ne reçoivent qu'un focus programmatique
   (notices WooCommerce, cible du lien d'évitement...). Un anneau autour
   de tout un bloc de contenu n'aurait aucun sens. */
a:focus-visible:not(.ubik-skip-link),
button:focus-visible,
[tabindex]:not([tabindex='-1']):focus-visible {
	outline: 3px solid var(--ubik-focus-color) !important;
	outline-offset: 2px !important;
}

/* Focus des champs de formulaire : contour FIN et COLLÉ au bord du champ
   (offset 0 : il épouse l'arrondi et se lit comme un épaississement de
   bordure, pas comme un halo flottant). Le changement de couleur de
   bordure vient en renfort quand le champ en a une au repos ; le contour
   garantit que l'indicateur reste visible même sur les champs sans bordure.
   Rappel : les navigateurs affichent volontairement cet indicateur aussi
   au clic souris sur les champs de saisie — ce n'est pas modifiable en CSS. */
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
	outline: 2px solid var(--ubik-focus-color) !important;
	outline-offset: 0 !important;
	border-color: var(--ubik-focus-color) !important;
}

/* Repli mode contraste forcé (contraste élevé de Windows) : le système
   y remplace les couleurs déclarées. Aucun effet en affichage normal. */
@media (forced-colors: active) {
	a:focus-visible:not(.ubik-skip-link),
	button:focus-visible,
	[tabindex]:not([tabindex='-1']):focus-visible,
	input:focus-visible,
	textarea:focus-visible,
	select:focus-visible {
		outline-color: Highlight !important;
	}
}

.et_pb_toggle_title {
	cursor: pointer;
}

/* Bouton inséré dans le titre des Toggle / Accordéons (bloc JS 1) : il ne
   doit pas se voir en tant que bouton, le titre garde son apparence (police,
   taille, couleur, alignement hérités du titre stylé dans Divi). L'icône
   plus/moins de Divi reste un pseudo-élément du titre, hors du bouton. */
.et_pb_toggle_title > button.ubik-toggle-button {
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	box-shadow: none;
	appearance: none;
	-webkit-appearance: none;
	font: inherit;
	color: inherit;
	letter-spacing: inherit;
	text-transform: inherit;
	text-align: inherit;
	line-height: inherit;
	cursor: pointer;
}

/* Sous-menus des menus Divi ouverts au clavier (bloc JS 2).
   Divi masque un sous-menu par visibility:hidden ET opacity:0, et ne
   l'affiche entièrement qu'au survol réel (li:hover > ul) ou au toucher
   (.et-touch-hover). Sa classe et-hover ne rend que visibility:visible :
   elle sert au fondu de fermeture, et laisse le sous-menu transparent
   mais atteignable au Tab. On affiche donc sur et-show-dropdown, la classe
   que la fonction d'ouverture de Divi pose aussi à la souris : au survol,
   rien ne change. Second sélecteur : plugin Divi Builder (préfixe plus
   fort). */
.nav li.et-show-dropdown > ul,
.et-db #et-boc .et-l .nav li.et-show-dropdown > ul {
	opacity: 1;
	visibility: visible;
}

/* Module passé en <button> natif (Semantic Elements Divi 5) : neutralise
   les styles bouton du navigateur et les icônes que Divi injecte en
   pseudo-élément (police ETmodules), pour laisser apparaître le SVG custom
   placé dans le module.
   - ubik-menu-toggle : hamburger, reçoit EN PLUS le comportement du bloc JS 5 ;
   - ubik-btn-reset : apparence seule (boutons de recherche...). */
button.ubik-menu-toggle,
button.ubik-btn-reset {
	background: none;
	border: none;
	padding: 0;
	margin: 0;
	appearance: none;
	-webkit-appearance: none;
	cursor: pointer;
	font: inherit;
	color: inherit;
	line-height: 0;
}
button.ubik-menu-toggle::before,
button.ubik-menu-toggle::after,
button.ubik-btn-reset::before,
button.ubik-btn-reset::after {
	content: none !important;
}

/* Animations réduites : seulement chez les visiteurs qui ont activé « réduire
   les animations » dans leur système (vertiges, troubles vestibulaires,
   épilepsie, troubles de l'attention). Divi ne lit pas ce réglage sur les
   pages publiques. WCAG 2.3.3.
   Durée quasi nulle plutôt que « none » : l'animation va quand même à son
   état final (une animation d'entrée part d'une opacité 0, « none » laisserait
   l'élément invisible), et les événements animationend / transitionend
   attendus par les scripts sont toujours émis. Les animations jQuery de Divi
   sont traitées par le JS (bloc 7). */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-delay: 0s !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		transition-delay: 0s !important;
		scroll-behavior: auto !important;
	}
}
