/*
 * Affichage public des formules spéciales : pastille d'âge du vocabulaire de
 * cartes partagé (ml_carte_formule_html(), inc/section-formules.php), en tête
 * de la section « destinations » de la page Formule, et fenêtre modale
 * « moins de 18 ans ». Lit les tokens du :root de main.css, n'en redéclare
 * aucun (voir CLAUDE.md, section « Design tokens »). Enfilée par
 * inc/popup-formules.php sur tout le site public.
 *
 * Le squelette des cartes (.ml-grille-formules, .ml-carte-formule) vit dans
 * main.css (section de l'accueil) : ce fichier ne fait que l'augmenter d'une
 * pastille d'âge et le recadrer dans la fenêtre.
 */

/* ── Pastille d'âge du vocabulaire de cartes partagé ──────────────────────── */
/* Posée sur le média de la carte (fenêtre « moins de 18 ans » et section des
   formules d'une fiche ville), au dessus du voile. Décorative pour le pointeur :
   le clic traverse vers le lien couvrant de la carte. Absente sur l'accueil et
   la page de langue, où ml_carte_formule_html() est appelée sans âge. */
.ml-carte-formule-age {
  position: absolute;
  inset-block-start: var(--ml-space-sm);
  inset-inline-start: var(--ml-space-sm);
  z-index: 1;
  padding: 0.3em 0.85em;
  background: rgba(255, 255, 255, 0.92);
  color: var(--ml-accent);
  border-radius: var(--ml-radius-pill);
  font-family: var(--ml-font-heading);
  font-size: var(--ml-fs-sm);
  font-weight: 700;
  pointer-events: none;
}

/* ── En tête sobre de la section « destinations » de la page Formule ──────── */

.ml-formule-destinations-entete {
  margin-block-end: var(--ml-space-lg);
  text-align: center;
}
.ml-formule-destinations-entete p {
  max-width: 52ch;
  margin-inline: auto;
  color: var(--ml-text-mid);
}