/*
 * Diaporama plein écran rendu avec Splide (inc/diaporama.php) : la mise en page d'Enfold
 * (slideshow.css, slideshow_fullscreen.css) reste en place ; ces règles remplacent ce que faisait
 * son script (première diapositive visible, image en fond) et habillent les commandes de Splide
 * comme celles d'Enfold.
 */

/* Visible avant le montage de Splide (image LCP, page sans JavaScript) */
.eurocaro13-diaporama.splide {
	visibility: visible;
}

/* Pleine hauteur sans le script d'Enfold (il remplaçait sa hauteur nulle à rapport fixe, « #top
   .av-default-height-applied .avia-slideshow-inner », par celle de la fenêtre) */
.eurocaro13-diaporama .splide__track,
#top .avia-fullscreen-slider .eurocaro13-diaporama .avia-slideshow-inner {
	height: 100%;
	padding: 0;
}

/* La liste déplacée par Splide ne rogne pas ses diapositives (Enfold : overflow hidden) ; la piste s'en charge */
#top .eurocaro13-diaporama .avia-slideshow-inner {
	overflow: visible;
}

/* Rognage sans conteneur de défilement : avec « hidden », la liste déplacée par Splide passe dans une couche
   à part et le flou d'arrière-plan de la barre flottante du Toolkit ne la voit plus */
.eurocaro13-diaporama .splide__track {
	overflow: hidden;
	overflow: clip;
}

/* Diapositives côte à côte (Splide) au lieu d'empilées et masquées (Enfold) */
.js_active .eurocaro13-diaporama .avia-slideshow-inner > li.avia-slideshow-slide,
.eurocaro13-diaporama .avia-slideshow-inner > li.avia-slideshow-slide {
	position: relative;
	visibility: visible;
	opacity: 1;
	z-index: 1;
}

/* L'image remplace le fond « cover » d'Enfold */
.eurocaro13-diaporama .eurocaro13-diaporama__image {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	border-radius: 0;
}

.eurocaro13-diaporama .avia-slide-wrap {
	position: relative;
	height: 100%;
}

/* Flèches : règles d'Enfold pour « .avia-slideshow-arrows a », appliquées aux boutons */
#top .eurocaro13-diaporama .avia-slideshow-arrows button {
	display: block;
	position: absolute;
	top: 50%;
	z-index: 99;
	width: 60px;
	height: 60px;
	margin: -30px 15px 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: #fff;
	font-size: 25px;
	line-height: 62px;
	text-align: center;
	cursor: pointer;
	opacity: 0;
	transition: opacity 0.3s ease-in-out;
}

#top .eurocaro13-diaporama .avia-slideshow-arrows button.next-slide {
	right: 0;
}

#top .eurocaro13-diaporama .avia-slideshow-arrows button::before {
	position: absolute;
	inset: 0;
	z-index: 100;
	border-radius: 3px;
	background: rgba(0, 0, 0, 0.3);
	line-height: 62px;
}

/* Points : règles d'Enfold pour « .avia-slideshow-dots a », appliquées à la pagination de Splide */
.eurocaro13-diaporama .splide__pagination {
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 200;
	width: 100%;
	height: 0;
	margin: 0;
	padding: 0;
	text-align: center;
}

/* « .avia-slideshow li » d'Enfold (diapositives empilées, masquées) ne vaut pas pour la pagination */
#top .eurocaro13-diaporama .splide__pagination li {
	display: inline-block;
	position: static;
	width: auto;
	height: auto;
	overflow: visible;
	margin: 0;
	padding: 0;
	list-style: none;
	visibility: visible;
	opacity: 1;
}

.eurocaro13-diaporama .splide__pagination__page {
	display: inline-block;
	position: relative;
	bottom: 80px;
	width: 13.5px;
	height: 13.5px;
	margin: 0 1px;
	padding: 7px;
	border: 0;
	border-radius: 14px;
	background: #000;
	cursor: pointer;
	opacity: 0;
	transition: opacity 0.3s ease-in-out;
}

.eurocaro13-diaporama .splide__pagination__page.is-active {
	background: #fff;
}

/* Commandes au survol, comme Enfold sur ordinateur (.avia_desktop) : 0,6, et 0,8 sur la commande survolée ;
   au clavier, toujours visibles. #top pour l'emporter sur les règles de base ci-dessus. */
.avia_desktop #top .avia-fullscreen-slider:hover .eurocaro13-diaporama .avia-slideshow-arrows button,
.avia_desktop #top .avia-fullscreen-slider:hover .eurocaro13-diaporama .splide__pagination__page {
	opacity: 0.6;
}

.avia_desktop #top .avia-fullscreen-slider:hover .eurocaro13-diaporama .avia-slideshow-arrows button:hover,
.avia_desktop #top .avia-fullscreen-slider:hover .eurocaro13-diaporama .splide__pagination__page:hover,
#top .eurocaro13-diaporama .avia-slideshow-arrows button:focus-visible,
#top .eurocaro13-diaporama .splide__pagination__page:focus-visible {
	opacity: 0.8;
}
