/*
Theme Name: Avada Child
Description: Child theme for Avada theme
Author: ThemeFusion
Author URI: https://theme-fusion.com
Template: Avada
Version: 1.0.0
Text Domain:  Avada
*/

/* ==========================================================================
   Cibles tactiles
   Mesure du 2026-08-18 : 58 elements interactifs sous 44 px sur la seule page
   de contact, les liens de menu a 17 px de haut et les champs de formulaire a
   21 px. Au doigt, on vise a cote, et sur un telephone c'est la difference
   entre un formulaire envoye et un formulaire abandonne.

   Portee volontairement limitee aux commandes : champs, boutons, liens de menu,
   liens de pied. Les liens en pleine phrase sont exclus, la norme les exemptant
   explicitement, et les agrandir disloquerait les paragraphes.
   ========================================================================== */

/* La hauteur des champs et des boutons se regle dans Avada, sous Elements puis
   Formulaires : « Hauteur des champs » vaut 50 px, au-dessus des 44 exiges. */

.fusion-form-field textarea {
	min-height: 132px;   /* trois lignes atteignables, pas une seule */
}

/* Les liens de navigation restent alignes, seule leur zone cliquable grandit. */
.awb-menu__main-a,
.awb-menu__sub-a,
.fusion-menu > li > a,
.fusion-secondary-menu > li > a {
	min-height: 44px;
	display: flex;
	align-items: center;
}

/* Le bouton d'ouverture d'un sous-menu mesurait 16 x 6 px : impossible a viser. */
.awb-menu__open-nav-submenu,
.awb-menu__m-toggle,
.fusion-mobile-nav-holder .fusion-mobile-menu-icons a {
	min-width: 44px;
	min-height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* Les listes de liens du pied de page et des accordeons d'acces. */
.fusion-footer-widget-area ul li a,
.fusion-accordian .panel-title a {
	min-height: 44px;
	display: flex;
	align-items: center;
}

@media (min-width: 1025px) {
	/* Au clavier et a la souris la contrainte ne s'applique pas : on rend leur
	   hauteur naturelle aux liens de menu pour ne pas deformer l'en-tete. */
	.awb-menu__main-a,
	.awb-menu__sub-a {
		min-height: 0;
	}
}

/* --------------------------------------------------------------------------
   Deuxieme passe, apres mesure : 58 cibles ramenees a 21, et la raison de ce
   qui resistait est instructive. `min-height` n'a AUCUN effet sur un element
   `inline`, ce que sont les liens par defaut : les regles ci-dessus n'ont porte
   que la ou elles fixaient aussi `display`. Les selecteurs suivants le posent
   donc systematiquement.
   -------------------------------------------------------------------------- */

.fusion-button,
.fusion-privacy-bar-acceptance,
.fusion-privacy-bar-reject,
.fusion-sb-toggle,
.fusion-top-top-link,
.awb-menu__open-nav-submenu {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	min-width: 44px;
}

/* Le bouton d'ouverture d'un sous-menu mesurait 16 x 6 px : Avada lui impose sa
   propre taille, d'ou la surcharge explicite. */
.awb-menu__open-nav-submenu {
	padding: 0 12px !important;
}

/* Le lien du logo enveloppe une image : c'est elle qui doit porter la hauteur. */
.fusion-logo a,
.fusion-header .fusion-logo-link {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
}

/* ── Encarts d'attente (jalon 4.6 bis) ────────────────────────────────────────
   Un encart nomme une piece que l'association doit encore fournir. Il n'existe
   que pour elle : le visiteur ne doit pas voir les trous d'un site en cours de
   remplissage. La classe « ojbt-edition » est posee sur le corps de page par le
   theme enfant, pour un role d'edition ou pendant la maintenance. */
.ojbt-encart { display: none !important; }
.ojbt-edition .ojbt-encart { display: flex !important; }
.ojbt-edition .ojbt-encart::after {
	content: "à fournir";
	position: absolute; top: 4px; right: 6px;
	font-size: .55rem; letter-spacing: .04em; text-transform: uppercase;
	color: var(--awb-color6);
}
.ojbt-partenaires .place { position: relative; }
.ojbt-edition p.ojbt-encart{display:block !important}

/* -- Documents a telecharger (jalon 4.17) -----------------------------------
   Une ligne de telechargement dit ce qu'on va ouvrir, son format et son poids :
   un visiteur en itinerance decide sur ce dernier. L'encart d'attente reprend le
   meme gabarit, de sorte que la mise en page ne bouge pas quand le document
   arrive. */
.ojbt-document, .ojbt-document-attendu {
	display: flex; flex-direction: column; gap: 2px;
	padding: 12px 16px; margin: 8px 0;
	border: 1px solid var(--awb-color3); border-radius: 2px;
	background: var(--awb-color1); text-decoration: none;
}
.ojbt-document-attendu { border-style: dashed; }
.ojbt-document b, .ojbt-document-attendu b { color: var(--awb-color7); font-weight: 600; }
.ojbt-document span, .ojbt-document-attendu span { font-size: .8rem; color: var(--awb-custom_color_2); }
.ojbt-document:hover, .ojbt-document:focus-visible { border-color: var(--awb-color5); }
.ojbt-document-attendu code { font-size: .8rem; }

/* -- Pages d'etat, maintenance et bientot disponible (jalon 4.2 bis) --------
   WHY : la zone principale garde le remplissage prevu pour une page ordinaire,
   ce qui laisse un bandeau blanc au-dessus de l'ecran d'etat — alors que celui-ci
   est cense occuper la hauteur entiere. Le fond du corps est pose ici aussi, faute
   de quoi il reste blanc derriere le conteneur. */
body.fusion-body:has(.awb-maintenance-content) { background-color: var(--awb-color8); }
.awb-maintenance-content { margin: 0; }
main:has(> .fusion-row > .awb-maintenance-content) { padding: 0 !important; }
.awb-maintenance-content .fusion-button { margin-left: 5px; margin-right: 5px; }

/* -- Repli typographique calé sur Josefin Sans -----------------------------
 *
 * WHY ce bloc : la pile de repli du thème était « Verdana, Geneva, sans-serif »,
 * la valeur d'usine d'Avada. Or Verdana est la plus large des sans-serif système
 * et Josefin l'une des plus étroites. Mesuré sur les fichiers de police :
 * la chasse du « n » vaut 0,487 em en Josefin contre 0,622 em en Verdana, soit
 * 28 % de largeur en plus. Tant que la fonte n'est pas chargée, et
 * « font-display: swap » garantit que cet instant existe, la page occupe donc
 * 28 % de largeur en trop, puis se replace d'un bloc.
 *
 * WHY caler sur la chasse et non sur la hauteur d'x : c'est le décalage de mise
 * en page qu'on cherche à supprimer, donc le nombre de lignes qui doit rester
 * constant. Un calage sur la hauteur d'x préserverait la taille perçue mais
 * changerait les retours à la ligne, ce qui est précisément le défaut.
 *
 * WHY Arial comme source : ses métriques sont les plus prévisibles d'un système
 * à l'autre, et une substitution locale n'entraîne aucun téléchargement.
 *
 * Valeurs calculées depuis les fichiers réels, Josefin Sans contre Arial :
 * unités par em 1000 contre 2048, ascendante 750 contre 1854, descendante 250
 * contre 434, chasse du « n » 487 contre 1139.
 */
@font-face {
  font-family: "Josefin Sans repli";
  src: local("Arial"), local("Helvetica Neue"), local("Liberation Sans"), local("Nimbus Sans");
  font-style: normal;
  font-weight: 100 700;
  size-adjust: 87.6%;
  ascent-override: 85.6%;
  descent-override: 28.5%;
  line-gap-override: 0%;
}

/* -- Cibles tactiles au doigt (WCAG 2.5.8) ---------------------------------
 *
 * WHY ce bloc : mesuré au rendu réel à 375 px de large, sur appareil tactile.
 * Le contrôle d'ouverture d'un sous-menu mesurait 16 par 6 pixels, ce qui le
 * rend presque impossible à atteindre au doigt. Les entrées de menu faisaient
 * 17 pixels de haut, les points de la frise 24 par 21.
 *
 * WHY seulement ces éléments : le critère 2.5.8 exempte explicitement les liens
 * placés dans une phrase ou un bloc de texte. Les « Lire la suite » et les
 * ancres de titre restent donc tels quels, agrandir leur zone déformerait
 * l'interligne du paragraphe qui les porte.
 *
 * WHY par la hauteur minimale et non par une pastille invisible : une zone
 * ajoutée en absolu déborderait sur l'entrée voisine d'un menu vertical, et
 * l'on toucherait la mauvaise. Une hauteur minimale sur un élément déjà en
 * bloc s'inscrit dans la mise en page sans rien recouvrir.
 */
/* WHY la largeur seule et non « pointer: coarse » : la detection du type de
 * pointeur n'est pas fiable partout, notamment sur les tablettes hybrides et
 * dans les outils de verification. Sous 640 px la mise en page est de toute
 * facon celle du telephone, et des cibles confortables n'y genent personne,
 * meme a la souris. */
@media (max-width: 640px) {

  .awb-menu__main-a,
  .awb-menu__sub-a {
    min-height: 44px;
    display: flex;
    align-items: center;
  }

  .awb-menu__open-nav-submenu_mobile.awb-menu__open-nav-submenu_mobile {
    min-width: 44px;
    min-height: 44px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .awb-menu__m-toggle.awb-menu__m-toggle {
    min-height: 44px;
  }

}

/* -- Aucun defilement horizontal de la page --------------------------------
 *
 * WHY ce garde-fou : mesuré au rendu, une rangée de l'en-tête vaut
 * `max-width: 104%` avec des marges négatives de 28,8 px de chaque côté. C'est
 * la compensation qu'Avada applique aux gouttières de colonnes, et elle suppose
 * que le conteneur porte une marge intérieure qui l'absorbe. Ce conteneur-là
 * n'en a aucune, le débordement s'échappe donc et élargit le document de 29 px.
 * La page se fait alors glisser latéralement, pour ne montrer que du vide.
 *
 * WHY `clip` et non `hidden` : `hidden` ferait du corps de page un conteneur de
 * défilement, ce qui casse les positions collantes de l'en-tête et le
 * défilement d'ancre. `clip` coupe sans rien de tout cela.
 *
 * WHY sur l'axe horizontal seulement : couper la verticale rendrait la page
 * illisible au-delà de la hauteur de fenêtre.
 */
html,
body {
  overflow-x: clip;
}

/* WHY hors media query : le critere 2.5.8 demande 24 par 24 pixels quel que
 * soit le pointeur, et les points de la frise mesuraient 24 par 21. La regle
 * du bloc precedent les porte a 44 sous 640 px ; celle-ci assure le minimum
 * partout ailleurs, souris comprise. */
/* -- Bloc des conditions du moment ------------------------------------------
   Ces regles mettent en forme la sortie du raccourci « ojbt_conditions », pose
   sur les pages « Venir observer » des deux langues. Elles ne peuvent pas venir
   d Avada : le raccourci produit son propre balisage, que le constructeur ne voit
   pas et sur lequel il n offre donc aucun reglage.

   WHY ce commentaire nomme le raccourci : ces classes n apparaissent dans aucune
   page, puisqu elles naissent au rendu. Un inventaire qui chercherait les classes
   dans les contenus les croirait mortes, ce qui est deja arrive. */
.ojbt-conditions {
  border: 1px solid var(--awb-custom_color_2);
  border-radius: 3px;
  padding: 20px 22px;
  margin: 24px 0;
  background: var(--awb-custom_color_3);
}
.ojbt-etat {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 14px;
}
.ojbt-etat strong {
  color: var(--awb-color7);
  font-size: 1.05rem;
}
.ojbt-etat__detail {
  color: var(--awb-custom_color_1);
  font-size: 0.92rem;
}
.ojbt-etat__pastille {
  width: 0.75em;
  height: 0.75em;
  border-radius: 50%;
  flex: 0 0 auto;
  background: var(--awb-color3);
  align-self: center;
}
.ojbt-etat--vert .ojbt-etat__pastille,
.ojbt-etat--green .ojbt-etat__pastille {
  background: var(--awb-custom_color_4);
}
.ojbt-etat--orange .ojbt-etat__pastille {
  background: var(--awb-color6);
}
.ojbt-etat--rouge .ojbt-etat__pastille,
.ojbt-etat--red .ojbt-etat__pastille {
  background: #b4453c;
}
.ojbt-conditions__titre {
  color: var(--awb-custom_color_2);
  font-size: 0.78rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin: 0 0 8px;
}
.ojbt-conditions__liste {
  list-style: none;
  margin: 0 0 12px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ojbt-conditions__liste li {
  color: var(--awb-custom_color_1);
  font-size: 0.94rem;
}
.ojbt-conditions__heure {
  display: inline-block;
  min-width: 5.5em;
  color: var(--awb-color7);
  font-variant-numeric: tabular-nums;
}
.ojbt-conditions__source {
  color: var(--awb-custom_color_1);
  font-size: 0.82rem;
  margin: 0;
  opacity: 0.8;
}
@media (max-width: 560px) {
	/* WHY sous 560 pixels seulement : l'heure passe sur sa propre ligne quand la
	   largeur ne permet plus de la poser à côté de son libellé. Sans cette
	   condition, la règle l'emportait sur la version large et le bloc s'affichait
	   en colonne sur tous les écrans. */
	.ojbt-conditions { padding: 16px 18px; }
	.ojbt-conditions__heure { min-width: 0; display: block; }
}
