/* =========================================================
   [TU-CLIMATE-BADGE-33 / 33B 2026-07-09]
   Badge Stripe Climate - footers publics, light/dark.
   ?v= immutable : bumper la reference a CHAQUE modification.
   33B : badge place DANS .footer-bottom (flex row wrap
   space-between align-center gap 1rem, style.css) :
   flex-basis/width 100% => wrappe SEUL sous la ligne copyright ;
   justify-content:flex-start => aligne a gauche (desktop) ;
   mobile (footer-bottom column align-center) : width 100%
   conserve la pleine largeur, contenu a gauche ; le gap 1rem
   du parent fournit l'espacement vertical.
   Dark = html.dark (boot pre-paint) OU body.dark-mode (toggle)
   - memes signaux que le site ; pas de fallback media (sans JS
   le site reste clair). L'iframe dark porte display:none inline :
   si ce CSS ne charge pas, seul le badge clair s'affiche.
   ========================================================= */
.footer-climate-badge {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-basis: 100%;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
}
.footer-climate-badge__iframe {
  display: block;
  border: 0;
  width: 380px;
  max-width: 100%;
  height: 38px;
}
.footer-climate-badge__iframe--dark {
  display: none;
}
html.dark .footer-climate-badge__iframe--light,
body.dark-mode .footer-climate-badge__iframe--light {
  display: none !important;
}
html.dark .footer-climate-badge__iframe--dark,
body.dark-mode .footer-climate-badge__iframe--dark {
  display: block !important;
}

/* =========================================================
   [TU-CLIMATE-BADGE-33C 2026-07-09] Placement CONTENU (hors footer)
   Badge centre reutilisant le composant iframe light/dark ci-dessus
   (aucune 3e variante). Sous « Propulse par Stripe » (paiement.php)
   et section Engagements (about.html). Le footer (.footer-climate-badge
   33B) n'est PAS affecte. ?v= immutable => bumper (clim02->clim03).
   ========================================================= */
.tu-content-climate-badge {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  margin: 2px 0 12px;
  max-width: 100%;
}
/* Sous ~420px le badge Stripe (size=small) passe sur 2 lignes ; la hauteur
   fixe 38px couperait la 2e ligne. On donne la place pour 2 lignes SANS
   redimensionner le badge (largeur inchangee). Scope = contenu uniquement. */
@media (max-width: 420px) {
  .tu-content-climate-badge { min-height: 56px; }
  .tu-content-climate-badge .footer-climate-badge__iframe { height: 56px; }
}