.vl-gallery-lightbox-open { overflow: hidden; }

/*
 * Galerie horizontale Vox Libra.
 * Les images conservent une largeur équivalente à la galerie Gutenberg
 * trois colonnes, mais sont présentées sur une seule ligne défilable.
 */
.vl-gallery-carousel {
	position: relative;
	width: 100%;
}

.wp-block-gallery.has-nested-images.vl-gallery-horizontal {
	flex-wrap: nowrap !important;
	overflow-x: auto;
	overflow-y: hidden;
	justify-content: flex-start;
	-webkit-overflow-scrolling: touch;
	scroll-behavior: smooth;
	overscroll-behavior-inline: contain;
	touch-action: pan-x;

	/* Masque la barre de défilement sans désactiver le scroll. */
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.wp-block-gallery.has-nested-images.vl-gallery-horizontal::-webkit-scrollbar {
	display: none;
	width: 0;
	height: 0;
}

.wp-block-gallery.has-nested-images.vl-gallery-horizontal > .wp-block-image {
	flex: 0 0 calc((100% - (2 * var(--wp--style--unstable-gallery-gap, 1em))) / 3) !important;
	width: calc((100% - (2 * var(--wp--style--unstable-gallery-gap, 1em))) / 3) !important;
	max-width: none !important;
}

/* Le clic reste actif, mais le curseur reste volontairement normal. */
.wp-block-gallery .wp-block-image img,
.wp-block-gallery .wp-block-image a {
	cursor: default;
}

/* Boutons de navigation de la galerie horizontale. */
.vl-gallery-carousel__button {
	position: absolute;
	top: 50%;
	z-index: 3;
	display: grid;
	place-items: center;
	width: 2.5rem;
	height: 2.5rem;
	margin: 0;
	padding: 0;
	transform: translateY(-50%);
	border: 0;
	border-radius: 50%;
	background: #76518a;
	color: #fff;
	font: inherit;
	font-size: 1.55rem;
	font-weight: 400;
	line-height: 1;
	cursor: pointer;
	box-shadow: 0 2px 12px rgba(0, 0, 0, .16);
	transition: opacity .16s ease, transform .16s ease, box-shadow .16s ease;
}

.vl-gallery-carousel__button--previous { left: .5rem; }
.vl-gallery-carousel__button--next { right: .5rem; }

.vl-gallery-carousel__button:hover:not(:disabled),
.vl-gallery-carousel__button:focus-visible:not(:disabled) {
	transform: translateY(-50%) scale(1.05);
	box-shadow: 0 3px 16px rgba(0, 0, 0, .22);
}

.vl-gallery-carousel__button:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 2px;
}

.vl-gallery-carousel__button:disabled {
	opacity: .25;
	cursor: default;
	box-shadow: none;
}

.vl-gallery-carousel__button[hidden] { display: none; }

/* Lightbox */
.vl-gallery-lightbox {
	position: fixed;
	z-index: 999999;
	inset: 0;
	display: grid;
	place-items: center;
	padding: 1.5rem 4.75rem;
	background: rgba(8, 10, 14, .93);
	color: #fff;
}

.vl-gallery-lightbox[hidden] { display: none; }

.vl-gallery-lightbox__image {
	display: block;
	max-width: 100%;
	max-height: calc(100vh - 3rem);
	width: auto;
	height: auto;
	object-fit: contain;
	box-shadow: 0 12px 48px rgba(0, 0, 0, .5);
}

.vl-gallery-lightbox__button {
	position: absolute;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, .14);
	color: inherit;
	font: inherit;
	cursor: pointer;
	transition: background-color .16s ease, transform .16s ease;
}

.vl-gallery-lightbox__button:hover,
.vl-gallery-lightbox__button:focus-visible {
	background: rgba(255, 255, 255, .3);
	outline: 2px solid #fff;
	outline-offset: 3px;
}

.vl-gallery-lightbox__close {
	top: 1rem;
	right: 1rem;
	width: 2.75rem;
	height: 2.75rem;
	font-size: 2rem;
	line-height: 1;
}

.vl-gallery-lightbox__previous,
.vl-gallery-lightbox__next {
	top: 50%;
	width: 3.25rem;
	height: 3.25rem;
	transform: translateY(-50%);
	font-size: 2.5rem;
	line-height: .8;
}

.vl-gallery-lightbox__previous { left: 1rem; }
.vl-gallery-lightbox__next { right: 1rem; }

.vl-gallery-lightbox__counter {
	position: absolute;
	bottom: 1rem;
	left: 50%;
	transform: translateX(-50%);
	margin: 0;
	padding: .4rem .7rem;
	border-radius: 999px;
	background: rgba(0, 0, 0, .45);
	font-size: .875rem;
}

@media (max-width: 600px) {
	.vl-gallery-carousel__button {
		width: 2.25rem;
		height: 2.25rem;
		font-size: 1.35rem;
	}
	.vl-gallery-carousel__button--previous { left: .3rem; }
	.vl-gallery-carousel__button--next { right: .3rem; }

	.vl-gallery-lightbox { padding: 1rem 3.5rem; }
	.vl-gallery-lightbox__previous { left: .35rem; }
	.vl-gallery-lightbox__next { right: .35rem; }
	.vl-gallery-lightbox__previous,
	.vl-gallery-lightbox__next { width: 2.75rem; height: 2.75rem; }
}

@media (prefers-reduced-motion: reduce) {
	.wp-block-gallery.has-nested-images.vl-gallery-horizontal {
		scroll-behavior: auto;
	}
	.vl-gallery-carousel__button {
		transition: none;
	}
}