/**
Stylesheet: Slideshow.css — CORRIGÉ v4 (définitif) 2026-06-23 (Agent FR)
	Le script slideshow.js fixe en INLINE : .slideshow-images = width:1000px height:450px,
	et sur chaque <img> un left/top calculé pour centrer l'image à sa taille NATURELLE.
	-> sur mobile le cadre reste à 1000px (déborde) et les images sont décalées.
	FIX : on force le conteneur en 100% + hauteur responsive, et on neutralise le left/top
	du JS (left:0/top:0) en redimensionnant l'image avec object-fit:cover. Tout en !important
	pour passer au-dessus des styles inline posés par le script.
	Copyright (c) 2008 Aeron Glemann — MIT-style license.
*/

.slideshow {
	display: block;
	position: relative;
	z-index: 0;
	width: 100% !important;       /* override du width:1000 inline */
	height: 450px !important;
	margin: 0 auto;
	overflow: hidden !important;
}
.slideshow-images {
	display: block !important;
	position: relative !important;
	width: 100% !important;       /* override du 1000px inline posé par le JS */
	height: 450px !important;
	overflow: hidden !important;
}
.slideshow-thumbnails { overflow: hidden; }
.slideshow a img { border: 0; }

/* CORRECTION CLÉ : neutralise le left/top inline du JS + remplit le cadre proprement */
.slideshow-images img {
	position: absolute !important;
	left: 0 !important;            /* annule le centrage left/top calculé par le JS */
	top: 0 !important;
	margin: 0 !important;
	width: 100% !important;
	height: 100% !important;       /* suit la hauteur (responsive) du conteneur */
	object-fit: cover !important;  /* redimensionne l'image pour remplir, recadrage centré */
	max-width: none !important;
}
.slideshow-images-visible { opacity: 1; z-index: 2; }
.slideshow-images-prev    { opacity: 0; }
.slideshow-images-next    { opacity: 0; }

/* CAPTION MASQUÉE : on n'affiche PAS le texte alt sur l'image (inutile, pollue).
   Les attributs alt restent sur les <img> -> SEO/accessibilité conservés. */
.slideshow-captions,
.slideshow-captions-hidden,
.slideshow-captions-visible {
	display: none !important;
}

/* RESPONSIVE : seule la hauteur du conteneur change ; l'image suit (height:100%) */
@media (max-width: 768px) {
	.slideshow, .slideshow-images { height: 300px !important; }
}
@media (max-width: 480px) {
	.slideshow, .slideshow-images { height: 220px !important; }
}