/* Habillage des rendus des extensions que la charte ne couvre pas par ses composants : bandeau
   de cookies (Complianz), tunnel d'EDD, portail Fluent Support. Jetons seulement. Les pastilles
   d'état natives sont dans habillage-natif.css (généré), les tableaux natifs prennent
   .wpa-tableau (composants.js). */

/* Complianz déclare ses couleurs de boutons sur :root ; redéclarées sur le bandeau, elles
   l'emportent quel que soit l'ordre des feuilles. Contraste mesuré par socle/verifier-natif.js. */
.cmplz-cookiebanner {
  --cmplz_banner_background_color: var(--wpa-surface);
  --cmplz_text_color: var(--wpa-encre);
  --cmplz_hyperlink_color: var(--wpa-lien);
  --cmplz_button_accept_background_color: var(--wpa-nuit);
  --cmplz_button_accept_border_color: var(--wpa-nuit);
  --cmplz_button_accept_text_color: var(--wpa-surface);
  --cmplz_button_deny_background_color: var(--wpa-surface);
  --cmplz_button_deny_border_color: var(--wpa-nuit);
  --cmplz_button_deny_text_color: var(--wpa-nuit);
  --cmplz_button_settings_background_color: var(--wpa-surface);
  --cmplz_button_settings_border_color: var(--wpa-nuit);
  --cmplz_button_settings_text_color: var(--wpa-nuit);
}

/* Onglet « Gérer le consentement » (bannière fermée) : Complianz le cale à -35 px pour 50 px de haut et
   ne le remonte qu'au survol, d'où une bande blanche de 15 px sans texte en bas à droite de chaque page.
   Ici un onglet compact, entier, aux couleurs du site (body : la feuille de la bannière se charge après). */
body #cmplz-manage-consent .cmplz-manage-consent {
  bottom: 0; right: var(--wpa-espace-40); height: auto; min-width: 0; padding: .45em .9em;
  font: 600 var(--wpa-taille-xs)/1.2 var(--wpa-police-texte); color: var(--wpa-surface);
  background: var(--wpa-nuit); border: 0;
  box-shadow: none; animation: none;
}
body #cmplz-manage-consent .cmplz-manage-consent:is(:hover, :focus-visible) { animation: none; background: var(--wpa-orange); color: var(--wpa-nuit); }

/* Vidéo YouTube bloquée par Complianz (theme/inc/videos.php) : l'affiche à la charte en fond du
   conteneur. L'iframe vide (about:blank) peint un document blanc par-dessus : elle s'efface tant
   que Complianz ne lui a pas rendu son adresse. Le bouton d'accord prend la forme d'un bouton de
   la charte, en bas à gauche, hors du titre de l'affiche. */
.wp-block-embed-youtube .cmplz-blocked-content-container { background-position: center; border-radius: var(--wpa-rayon-carte); overflow: hidden; }
.wp-block-embed-youtube .cmplz-blocked-content-container > iframe[src="about:blank"] { opacity: 0; }
.wp-block-embed-youtube .cmplz-blocked-content-container .cmplz-blocked-content-notice {
  inset: auto auto var(--wpa-espace-40) var(--wpa-espace-40); width: auto; transform: none; max-width: calc(100% - 2 * var(--wpa-espace-40));
  padding: .7em 1.2em; border: 0; border-radius: var(--wpa-rayon-bouton);
  background: var(--wpa-orange); color: var(--wpa-nuit); font-family: inherit; font-weight: 600; font-size: var(--wpa-taille-s); line-height: 1.3; text-align: left; cursor: pointer;
}
.wp-block-embed-youtube .cmplz-blocked-content-container .cmplz-blocked-content-notice:hover,
.wp-block-embed-youtube .cmplz-blocked-content-container .cmplz-blocked-content-notice:focus-visible { background: var(--wpa-surface); outline: 2px solid var(--wpa-nuit); outline-offset: 2px; }
@media (max-width: 600px) {
  .wp-block-embed-youtube .cmplz-blocked-content-container .cmplz-blocked-content-notice { inset: auto auto var(--wpa-espace-30) var(--wpa-espace-30); max-width: calc(100% - 2 * var(--wpa-espace-30)); padding: .5em .9em; font-size: var(--wpa-taille-xs); }
}

/* EDD : l'astérisque des champs requis (son rouge mesurait 4,42). Trois règles d'EDD le colorent,
   dont deux par identifiant — le tunnel en blocs (.wp-block-edd-checkout #edd_purchase_form
   .edd-blocks-form …) et le classique (#edd_checkout_form_wrap span…) : chacune est reprise ici
   avec un niveau de plus. */
body .wp-block-edd-checkout #edd_purchase_form .edd-blocks-form .edd-required-indicator,
body #edd_checkout_form_wrap span.edd-required-indicator,
body .edd-blocks-form .edd-required-indicator,
body .edd-required-indicator { color: var(--wpa-etat-erreur); }

/* Fluent Support (Element Plus) : le texte indicatif des champs et des filtres passe par une
   variable déclarée sur :root, redéclarée ici ; et des cellules qui ne rognent pas leur contenu
   (la pastille d'état était coupée à 390 px). */
.fs_client_portal { --el-text-color-placeholder: var(--wpa-texte-discret); }
.fs_client_portal .el-table .cell { overflow: visible; text-overflow: clip; white-space: normal; }
/* À 390 px la colonne d'état fait 77 px, marges internes comprises, et la pastille 70 : elle
   débordait de 6 px hors du tableau. Marges resserrées, et la pastille tient dans sa cellule. */
@media (max-width: 640px) {
  .fs_client_portal .el-table .cell { padding-inline: 6px; }
  .fs_client_portal .el-table .fs_status_badge { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
}

/* Pied de Blocksy, en colonnes de widgets (bin/configurer-site.php) : même lecture que le
   composant .wpa-pied de la charte. Les titres de colonne sont des blocs Titre, que la couleur
   « titres de widgets » de Blocksy ne vise pas. */
.ct-footer .wpa-pied-titre {
  margin: 0 0 var(--wpa-espace-30);
  font: 800 var(--wpa-taille-m)/1.2 var(--wpa-police-titre);
  color: var(--wpa-surface);
}
.ct-footer :is(.wpa-pied-zone-2, .wpa-pied-zone-3, .wpa-pied-zone-4) .wp-block-navigation__container {
  gap: var(--wpa-espace-20);
}
.ct-footer [class*="wpa-pied-zone-"] .wp-block-navigation {
  font-size: var(--wpa-taille-s);
}
.ct-footer .wpa-pied-zone-1 .wp-block-social-link { color: var(--wpa-surface); }
.ct-footer .wpa-pied-accroche { max-width: 28ch; }

/* Panier de l'en-tête (menu du bureau, lien de l'en-tête mobile) : le nombre en pastille, comme
   .wpa-entete .panier b de la charte. */
.wpa-panier-nombre {
  display: inline-block;
  min-width: 1.4em;
  margin-left: 0.3em;
  padding: 0.1em 0.35em;
  border-radius: var(--wpa-rayon-etiquette);
  background: var(--wpa-nuit);
  color: var(--wpa-surface);
  font-size: 0.85em;
  line-height: 1.3;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
.wpa-panier-mobile {
  color: var(--wpa-nuit);
  font-weight: 600;
  text-decoration: none;
}
