/**
 * Correctifs au CSS de tarteaucitron.js — art-mella.com/blog
 *
 * Auteur : Olivier OSWALD (administrateur du site, pas propriétaire)
 * Projet : Modernisation de l'infrastructure WordPress art-mella.com
 * Documentation : dossier de projet local, docs/bascule-cookie-consent-cookieyes-2026-09-01.md
 *
 * Ce fichier n'est PAS un composant tiers : correctifs écrits pour ce chantier,
 * chargés APRÈS le CSS d'origine de tarteaucitron (voir am-cookie-consent.php).
 *
 * 14 septembre 2026 — retour terrain d'Olivier :
 *
 * 1. Boutons Accepter/Refuser à moitié cachés sur la catégorie « APIs » du panneau.
 *    Cause identifiée dans le CSS d'origine (tarteaucitron.css) : .tarteaucitronName
 *    et .tarteaucitronAsk sont mis en page par `float` (gauche/droite), dans un
 *    conteneur .tarteaucitronLine en `overflow:hidden`. Cette technique ne s'adapte
 *    pas de façon fiable à un texte de description sur plusieurs lignes — la
 *    description de la catégorie APIs est la plus longue des quatre catégories.
 *    Remplacé par une mise en page flexible, qui grandit avec son contenu au lieu
 *    de le découper. Les !important sont nécessaires : le CSS de tarteaucitron
 *    n'est pas chargé par WordPress mais injecté en JS à l'exécution (voir la note
 *    dans am-cookie-consent.php) — son ordre d'arrivée dans le document n'est pas
 *    garanti par rapport à celui-ci.
 *
 *    Confirmé visuellement par Olivier le 14 septembre 2026 : correctif efficace.
 *
 * 1bis. Effet de bord du correctif ci-dessus, découvert le même jour : le message
 *    « Ce site n'utilise aucun cookie nécessitant votre consentement » restait
 *    affiché alors que 3 services sont bien rattachés. Cause : ce message vit dans
 *    un <li class="tarteaucitronLine" id="tarteaucitronNoServicesTitle"> que
 *    tarteaucitron masque lui-même en JS (style en ligne display:none) dès qu'un
 *    service est ajouté au panneau (tarteaucitron.js:1223) — mais mon display:flex
 *    !important ci-dessus s'appliquait aussi à CETTE ligne et l'emportait sur son
 *    style en ligne sans !important, la rendant visible malgré tarteaucitron.
 *    Exclu explicitement avec :not(), pour laisser tarteaucitron gérer normalement
 *    ce cas précis (le message doit pouvoir réapparaître si un jour plus aucun
 *    service n'est rattaché).
 */
#tarteaucitron #tarteaucitronServices .tarteaucitronLine:not(#tarteaucitronNoServicesTitle) {
	overflow: visible !important;
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: center !important;
}

#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronName {
	float: none !important;
	width: auto !important;
	flex: 1 1 260px !important;
}

#tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk {
	float: none !important;
	flex: 0 0 auto !important;
}

/**
 * 2. Message affiché à la place d'une vidéo YouTube bloquée (voir am_youtube.fallback
 *    dans am-cookie-consent.php). Sobre, cohérent avec le jaune de tarteaucitron
 *    (#fbd600) pour le bouton d'action, sans rien copier de son CSS interne.
 */
.am-tac-notice {
	background: #f5f5f5;
	border: 1px dashed #999999;
	border-radius: 6px;
	box-sizing: border-box;
	color: #333333;
	font-size: 14px;
	min-height: 180px;
	padding: 24px;
	text-align: center;
}

.am-tac-notice p {
	margin: 0 0 12px;
}

.am-tac-notice .tarteaucitronAllow {
	background: #fbd600;
	border: 0;
	border-radius: 4px;
	color: #000000;
	cursor: pointer;
	display: inline-block;
	font-size: 14px;
	padding: 8px 16px;
}

/**
 * 3. Centrage du titre visible du panneau — 15 septembre 2026, demande d'Olivier.
 *    Ne pas confondre avec #tac_title (tarteaucitron.js:581/925) : celui-là porte
 *    class="tac_visually-hidden", invisible par conception, réservé aux lecteurs
 *    d'écran (aria-labelledby). Le titre RÉELLEMENT affiché est .tarteaucitronH1
 *    dans #tarteaucitronMainLineOffset (tarteaucitron.js:598) — c'est celui-ci.
 */
#tarteaucitron #tarteaucitronMainLineOffset {
	justify-content: center !important;
}

#tarteaucitron #tarteaucitronMainLineOffset .tarteaucitronName {
	flex: 1 1 100% !important;
	text-align: center !important;
}

/**
 * 4. Message affiché sur un formulaire dont la soumission est bloquée faute de
 *    consentement reCAPTCHA (voir l'interception dans am-cookie-consent.php,
 *    15 septembre 2026). Même famille visuelle que .am-tac-notice, mais posé à
 *    l'intérieur d'un <form> existant plutôt qu'à la place d'un élément retiré.
 */
.am-tac-form-notice {
	background: #f5f5f5;
	border: 1px dashed #999999;
	border-radius: 6px;
	box-sizing: border-box;
	color: #333333;
	font-size: 14px;
	margin-top: 12px;
	padding: 16px 20px;
	text-align: center;
}

.am-tac-form-notice p {
	margin: 0 0 10px;
}

.am-tac-form-notice .tarteaucitronAllow {
	background: #fbd600;
	border: 0;
	border-radius: 4px;
	color: #000000;
	cursor: pointer;
	display: inline-block;
	font-size: 14px;
	padding: 8px 16px;
}