/*
	Habillage commun des modales plein ecran du site public (GLightbox : photos,
	videos, affiches, photo du mois...). Feuille PARTAGEE, chargee par
	liste_site_header.php juste apres glightbox.min.css : contrairement au
	header/footer, ce bloc n'est volontairement pas duplique dans chaque
	css_<page>.css.

	Style vise : voile sombre translucide (la page reste devinable dessous),
	image centree aux coins arrondis avec ombre portee, boutons ronds
	precedent / suivant / fermer, et compteur "3 / 6" en pastille en bas
	(pastille ajoutee par theme_zenblog_main.js).
*/

/* Voile */
.glightbox-container .goverlay,
.glightbox-mobile .glightbox-container .goverlay{
	background: rgba(17, 19, 14, .86);
	-webkit-backdrop-filter: blur(3px);
	backdrop-filter: blur(3px);
}

/* Media : coins arrondis + ombre, pas de cadre */
.glightbox-clean .gslide-media,
.glightbox-container .gslide-media{
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 24px 60px rgba(0, 0, 0, .55);
}
.glightbox-container .gslide-image img{
	border-radius: 10px;
	/* !important : GLightbox ecrit une max-height en ligne (hauteur - legende) ;
	   on garde de l'air en haut (bouton fermer) et en bas (compteur). */
	max-height: calc(100vh - 170px) !important;
}
.glightbox-container .gslide-video,
.glightbox-container .gslide-external{
	border-radius: 10px;
	overflow: hidden;
}

/* Boutons ronds (precedent / suivant / fermer) */
.glightbox-clean .gprev,
.glightbox-clean .gnext,
.glightbox-clean .gclose{
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background-color: rgba(20, 22, 17, .55);
	border: 1px solid rgba(255, 255, 255, .22);
	opacity: 1;
	transition: background-color .2s ease, border-color .2s ease, transform .2s ease;
}
.glightbox-clean .gprev:hover,
.glightbox-clean .gnext:hover,
.glightbox-clean .gclose:hover,
.glightbox-clean .gbtn.focused{
	background-color: rgba(255, 255, 255, .14);
	border-color: rgba(255, 255, 255, .5);
	outline: none;
}
.glightbox-clean .gbtn:focus-visible{
	outline: 2px solid #E8A868;
	outline-offset: 2px;
}
.glightbox-clean .gprev svg,
.glightbox-clean .gnext svg{
	width: 14px;
}
.glightbox-clean .gclose svg{
	width: 14px;
}
.glightbox-clean .gprev path,
.glightbox-clean .gnext path,
.glightbox-clean .gclose path{
	fill: #fff;
}

/* Position : fleches centrees verticalement au bord, fermer en haut a droite */
.glightbox-clean .gprev,
.glightbox-clean .gnext{
	top: 50%;
	transform: translateY(-50%);
}
.glightbox-clean .gprev{ left: 12px; }
.glightbox-clean .gnext{ right: 12px; }
.glightbox-clean .gclose{
	top: 12px;
	right: 12px;
}
.glightbox-clean .gprev.disabled,
.glightbox-clean .gnext.disabled{
	opacity: .35;
}

/* Compteur "n / total" en pastille, centre en bas */
.ddp-lb-counter{
	position: fixed;
	left: 50%;
	bottom: 14px;
	transform: translateX(-50%);
	z-index: 99999;
	padding: 4px 12px;
	border-radius: 999px;
	background: rgba(20, 22, 17, .7);
	border: 1px solid rgba(255, 255, 255, .18);
	color: #fff;
	font-family: 'Nunito', sans-serif;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: .02em;
	pointer-events: none;
}
.ddp-lb-counter[hidden]{ display: none; }
.glightbox-closing .ddp-lb-counter{ opacity: 0; }

/* Description (titre / dicton) : texte clair sur le voile */
.glightbox-clean .gslide-description{ background: transparent; }
.glightbox-clean .gdesc-inner{ padding: 12px 0 0; text-align: center; }
.glightbox-clean .gslide-title{
	color: #fff;
	font-family: 'Zilla Slab', serif;
	font-size: 18px;
	margin-bottom: 8px;
}
.glightbox-clean .gslide-desc{ color: rgba(255, 255, 255, .85); font-family: 'Nunito', sans-serif; }

/* Mobile : boutons un peu plus petits, fleches en bas pour ne pas masquer l'image */
@media (max-width: 768px){
	.glightbox-clean .gprev,
	.glightbox-clean .gnext,
	.glightbox-clean .gclose{
		width: 38px;
		height: 38px;
	}
	.glightbox-clean .gprev,
	.glightbox-clean .gnext{
		top: auto;
		bottom: 8px;
		transform: none;
	}
	.glightbox-container .gslide-image img{
		max-height: calc(100vh - 160px) !important;
	}
}

/* Image seule : GLightbox ajoute .glightbox-button-hidden aux fleches mais sa
   propre regle .gprev/.gnext (display: flex, declaree plus loin) l'emporte. */
.glightbox-clean .gbtn.glightbox-button-hidden{ display: none; }