/* MENTION D'INFORMATION - PIED DE FORMULAIRE, TON DE NOTE DE BAS DE PAGE */

/*
 * Sous-composant en cascade (§4.12) : les feuilles de `contacts` et de `heros`
 * ciblent des elements generiques descendants — `.contact-1 p` pese (0,2,0) et
 * ecraserait une classe nue. Chaque regle est donc qualifiee par le bloc racine
 * PLUS l'element (`.mention-donnees p.mention-donnees__texte`, (0,2,1)), comme
 * le fait deja upload-zone.
 *
 * LA COULEUR NE PEUT PAS ETRE DECIDEE ICI. Le meme bloc se pose sur une carte
 * blanche (contact-1..5), sur une carte de verre au-dessus d'un hero sombre
 * (hero-1, hero-2) et sur un aplat --primary (hero-5) : une valeur en dur
 * serait juste une fois sur trois. Le sous-composant expose donc deux
 * variables, LUES AVEC REPLI : le cas courant — fond clair — est le repli, et
 * chaque parent qui n'est pas dans ce cas pose la variable sur SON conteneur de
 * formulaire, d'ou elle descend par heritage.
 *
 * Le repli est dans le var(), PAS dans une declaration sur .mention-donnees :
 * une variable posee sur l'element lui-meme l'emporterait sur celle heritee du
 * parent, et l'ecriture du parent n'aurait aucun effet — c'est exactement ce
 * qui a laisse la mention en gris sur l'aplat --primary de hero-5.
 */
.mention-donnees {
  margin-top: 14px;
}

.mention-donnees p.mention-donnees__texte {
  margin: 0;
  color: var(--mention-donnees-couleur, var(--gray-dark));
  font-family: var(--font-body);
  font-size: 0.72rem;
  font-weight: 400;
  line-height: 1.55;
}

/* L'etoile rappelle la note de bas de page : elle se detache sans crier. */
.mention-donnees span.mention-donnees__etoile {
  margin-right: 2px;
  color: var(--mention-donnees-lien, var(--secondary));
  font-family: var(--font-body);
  font-size: 0.8rem;
  font-weight: 700;
  line-height: 1;
}

/* Reset explicite (§4.6) : le main.css du theme stylise les liens. */
.mention-donnees a.mention-donnees__lien {
  color: var(--mention-donnees-lien, var(--secondary));
  font-family: inherit;
  font-size: inherit;
  font-weight: 600;
  line-height: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
}

.mention-donnees a.mention-donnees__lien:hover {
  color: var(--mention-donnees-lien, var(--secondary));
  text-decoration: none;
}

.mention-donnees a.mention-donnees__lien:focus-visible {
  outline: 2px solid var(--mention-donnees-lien, var(--secondary));
  outline-offset: 3px;
  border-radius: 2px;
}
