/* Galerie produit en mosaïque — madame-heritage/product-gallery
   Toutes les couleurs viennent de la palette theme.json. Aucun !important. */

.mh-gallery {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 6px;
}

.mh-gallery__item {
	grid-column: span 2;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 2px;
	background: var(--wp--preset--color--color-1);
	box-shadow: none;
	overflow: hidden;
	cursor: zoom-in;
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	position: relative;
}

.mh-gallery__item--span-2 { grid-column: span 2; }
.mh-gallery__item--span-3 { grid-column: span 3; }
.mh-gallery__item--span-6 { grid-column: span 6; }

.mh-gallery__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 2px;
	transition: transform 0.45s ease;
}

.mh-gallery__item:hover .mh-gallery__img,
.mh-gallery__item:focus-visible .mh-gallery__img {
	transform: scale(1.045);
}

.mh-gallery__item:focus-visible {
	outline: 1px solid var(--wp--preset--color--primary);
	outline-offset: 2px;
}

/* --- Plein écran ------------------------------------------------------ */
/* Fond ivoire plein cadre plutôt qu'un voile noir : la charte n'admet pas
   de superposition sombre, et ::backdrop n'hérite pas des variables de
   façon fiable selon les navigateurs. */

.mh-gallery__lightbox {
	width: 100vw;
	max-width: 100vw;
	height: 100vh;
	max-height: 100vh;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: var(--wp--preset--color--page-background);
	color: var(--wp--preset--color--page-text);
	box-shadow: none;
	overflow: hidden;
}

.mh-gallery__lightbox::backdrop {
	background: transparent;
}

.mh-gallery__lightbox-inner {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	padding: clamp(12px, 4vw, 56px);
	box-sizing: border-box;
}

.mh-gallery__lightbox-img {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	object-fit: contain;
	border-radius: 2px;
	box-shadow: none;
}

.mh-gallery__lightbox-count {
	position: absolute;
	left: 50%;
	bottom: 12px;
	transform: translateX(-50%);
	margin: 0;
	font-family: var(--wp--preset--font-family--inter);
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--desactive-texte);
}

.mh-gallery__nav,
.mh-gallery__close {
	position: absolute;
	border: 1px solid var(--wp--preset--color--grey);
	border-radius: 2px;
	background: var(--wp--preset--color--page-background);
	color: var(--wp--preset--color--page-text);
	font-family: var(--wp--preset--font-family--inter);
	line-height: 1;
	cursor: pointer;
	box-shadow: none;
}

.mh-gallery__nav {
	top: 50%;
	transform: translateY(-50%);
	width: 44px;
	height: 44px;
	font-size: 26px;
}

.mh-gallery__nav--prev { left: 12px; }
.mh-gallery__nav--next { right: 12px; }

.mh-gallery__close {
	top: 12px;
	right: 12px;
	width: 44px;
	height: 44px;
	font-size: 24px;
}

.mh-gallery__nav:hover,
.mh-gallery__close:hover,
.mh-gallery__nav:focus-visible,
.mh-gallery__close:focus-visible {
	background: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--page-background);
}

.mh-gallery__nav[hidden] { display: none; }

/* --- Éditeur ---------------------------------------------------------- */

.mh-gallery-placeholder {
	border: 1px dashed var(--wp--preset--color--grey);
	border-radius: 2px;
	background: var(--wp--preset--color--color-1);
	padding: 2.5rem 1.5rem;
	text-align: center;
}

.mh-gallery-placeholder__text {
	margin: 0;
	font-family: var(--wp--preset--font-family--inter);
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--desactive-texte);
}

/* --- Écrans étroits : on garde la planche contact mais on l'aère ------- */

@media (max-width: 480px) {
	.mh-gallery { gap: 4px; }
	.mh-gallery__item--span-2 { grid-column: span 3; }
}

/* --- Mouvement réduit -------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	.mh-gallery__img {
		transition: none;
	}

	.mh-gallery__item:hover .mh-gallery__img,
	.mh-gallery__item:focus-visible .mh-gallery__img {
		transform: none;
	}
}

/* --- Mise en page de la fiche produit ----------------------------------
   La colonne de droite a ete collante jusqu'au 01/09/2026. Retiree : un
   element en position:sticky ne franchit jamais le haut du viewport, donc
   le bouton d'ajout n'en sortait jamais et la barre de rappel ne pouvait
   pas se declencher. Mesure a l'appui, boundingClientRect.top relevait
   346, 1468, 1946 — toujours positif. La barre de rappel a ete jugee plus
   utile que le confort de la colonne fixe.

   Vit ici parce que ce fichier n'est charge que sur is_product(). */

.mh-product-info {
	position: static;
}
