/**
 * BETO — Badge « Direct / Direct terminé » (universel)
 *
 * PRINCIPE ABSOLU : tout post avec `_beto_is_live=1` DOIT afficher son badge
 * partout ou il est rendu (widgets, archives, single, blocs theme, recherches,
 * pages custom). Cette feuille est enqueuee globalement sur le front.
 *
 * Classes emises :
 *   - `.beto-live-badge`           : helper beto_live_badge() (DOM explicite)
 *   - `.is-live`                   : filtre post_class -> applique sur wrapper article
 *   - `.is-live-ended`             : cumul avec `.is-live` quand _beto_live_ended=1
 *
 * Les widgets peuvent surcharger (Board, Newsboard, Echo, etc.) — le badge
 * helper est cependant neutre visuellement (fond rouge / gris) et marche
 * partout par defaut.
 */

/* ═══ Badge inline (helper beto_live_badge) ═══════════════════════════════ */
.beto-live-badge {
	display: inline-flex;
	align-items: center;
	gap: .35em;
	font: 800 .625rem/1 var(--b-ui, 'Barlow', Arial, sans-serif);
	text-transform: uppercase;
	letter-spacing: .05em;
	white-space: nowrap;
	vertical-align: middle;
	border-radius: 2px;
	background: var(--b-red, #ce1021);
	color: #fff;
	padding: .3rem .5rem;
	margin-right: .5em;
	animation: beto-live-slide .6s ease-out both;
}
.beto-live-badge--sm { font-size: .5625rem; padding: .2rem .4rem; }
.beto-live-badge--lg { font-size: .75rem;   padding: .35rem .65rem; }

.beto-live-badge__dot {
	width: .5em;
	height: .5em;
	border-radius: 50%;
	background: #fff;
	animation: beto-live-pulse 1.6s ease-in-out infinite;
}
.beto-live-badge__dot--ended { animation: none; background: #fff; opacity: .7; }

/*
 * __text : herite de .beto-live-badge pour ne JAMAIS prendre la couleur
 * du titre ambiant (ex: .bfi__card--live .bfi__card-title{color:#fff}
 * ferait un texte blanc dans un badge a fond blanc apres override).
 * On force l'heritage direct depuis le parent badge.
 */
.beto-live-badge__text { color: inherit; }

/* Etat termine — bandeau gris desature.
   !important : empeche les CSS widgets (board, newsboard) qui redefinissent
   .beto-live-badge{background:red} d'ecraser le gris par cascade tardive. */
.beto-live-badge--ended {
	background: var(--b-txt3, #6b7280) !important;
	color: #fff !important;
	animation: none !important;
}

@media (prefers-reduced-motion: reduce) {
	.beto-live-badge, .beto-live-badge__dot { animation: none; }
}

/* Accessibilite : texte cache visible lecteurs d'ecran */
.beto-live-badge .screen-reader-text {
	position: absolute !important;
	clip: rect(1px,1px,1px,1px);
	width: 1px; height: 1px;
	overflow: hidden;
}

/* ═══ Classes universelles (.is-live / .is-live-ended via post_class) ═════ */
/*
 * Quand un theme ou un widget utilise `post_class()` WordPress, ces classes
 * sont automatiquement appliquees par le filtre beto_post_class_live_flags().
 * On ajoute un badge visuel via ::before si aucun helper explicite n'a deja
 * rendu un `.beto-live-badge` dans le markup (guard :not).
 */
article.is-live,
.is-live {
	position: relative;
}

/* Filet rouge discret a gauche pour differencier visuellement */
article.is-live > .entry-title::before,
article.is-live > h1::before,
article.is-live > h2::before,
article.is-live > h3::before {
	content: "DIRECT";
	display: inline-block;
	margin-right: .5em;
	padding: .15em .4em;
	background: var(--b-red, #ce1021);
	color: #fff;
	font: 800 .625rem/1 var(--b-ui, 'Barlow', Arial, sans-serif);
	text-transform: uppercase;
	letter-spacing: .05em;
	vertical-align: middle;
	border-radius: 2px;
	animation: beto-live-pulse-badge 1.8s ease-in-out infinite;
}

article.is-live.is-live-ended > .entry-title::before,
article.is-live.is-live-ended > h1::before,
article.is-live.is-live-ended > h2::before,
article.is-live.is-live-ended > h3::before {
	content: "DIRECT TERMINÉ";
	background: var(--b-txt3, #6b7280);
	animation: none;
}

/* Si le helper beto_live_badge() a deja emis un badge, on supprime le ::before auto (anti-doublon) */
article.is-live:has(.beto-live-badge) > .entry-title::before,
article.is-live:has(.beto-live-badge) > h1::before,
article.is-live:has(.beto-live-badge) > h2::before,
article.is-live:has(.beto-live-badge) > h3::before {
	content: none;
}

/* Desaturation douce sur l'article entier si termine (convention visuelle BETO) */
article.is-live-ended { opacity: .88; }
article.is-live-ended a { color: inherit; }

@media (prefers-reduced-motion: reduce) {
	article.is-live > .entry-title::before,
	article.is-live > h1::before,
	article.is-live > h2::before,
	article.is-live > h3::before { animation: none; }
}

/* ═══ Keyframes partagees ═════════════════════════════════════════════════ */
@keyframes beto-live-pulse {
	0%, 100% { transform: scale(1);   opacity: 1; }
	50%      { transform: scale(.7);  opacity: .6; }
}
@keyframes beto-live-pulse-badge {
	0%, 100% { box-shadow: 0 0 0 0    rgba(206,16,33,.5); }
	50%      { box-shadow: 0 0 0 .25em rgba(206,16,33,0); }
}
@keyframes beto-live-slide {
	from { opacity: 0; transform: translateX(-.5em); }
	to   { opacity: 1; transform: translateX(0); }
}
