/* Aperçu d'une sortie dans une fenêtre (voir includes/apercu-sorties.php) */

/* Bouton « agrandir » en bas à droite de la carte */
body .grid-item-sortie {
	position: relative;
	padding-bottom: 52px;
}

body .bdg-apercu-ouvrir {
	position: absolute;
	right: 10px;
	bottom: 10px;
	display: grid;
	place-items: center;
	width: 36px;
	height: 36px;
	margin: 0;
	padding: 0;
	border: 1px solid #e7501e;
	border-radius: 50%;
	background: #fff;
	color: #e7501e;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .12);
	cursor: pointer;
	transition: background-color .2s ease, color .2s ease, transform .2s ease;
}

body .bdg-apercu-ouvrir:hover,
body .bdg-apercu-ouvrir:focus-visible {
	background: #e7501e;
	color: #fff;
	transform: scale(1.08);
}

body .bdg-apercu-ouvrir:focus-visible {
	outline: 2px solid #e7501e;
	outline-offset: 2px;
}

/* Fenêtre */
html.bdg-apercu-ouvert {
	overflow: hidden; /* la page derrière ne défile pas */
}

.bdg-apercu {
	box-sizing: border-box;
	width: 100%;
	max-width: none;
	height: 100%;
	max-height: none;
	margin: 0;
	padding: 24px 76px;
	border: 0;
	background: transparent;
	overflow: visible;
}

.bdg-apercu[open] {
	display: flex;
	align-items: center;
	justify-content: center;
}

.bdg-apercu::backdrop {
	background: rgba(20, 20, 20, .72);
}

.bdg-apercu-cadre {
	display: flex;
	flex-direction: column;
	width: 100%;
	max-width: 1100px;
	max-height: 100%;
	border-radius: 10px;
	background: #fff;
	box-shadow: 0 12px 40px rgba(0, 0, 0, .35);
	overflow: hidden;
}

.bdg-apercu-barre {
	display: flex;
	flex: none;
	align-items: center;
	gap: 16px;
	padding: 8px 8px 8px 20px;
	border-bottom: 1px solid #eee;
	font-family: Ubuntu, Arial, Tahoma, sans-serif;
	font-size: 14px;
}

.bdg-apercu-compteur {
	color: #777;
}

body .bdg-apercu-fiche-lien {
	margin-left: auto;
	color: #e7501e;
	font-weight: 700;
	text-decoration: none;
}

body .bdg-apercu-fiche-lien:hover {
	text-decoration: underline;
}

body .bdg-apercu-fermer {
	display: grid;
	place-items: center;
	width: 40px;
	height: 40px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: #333;
	cursor: pointer;
}

body .bdg-apercu-fermer:hover,
body .bdg-apercu-fermer:focus-visible {
	background: #f3f3f3;
	color: #e7501e;
}

.bdg-apercu-contenu {
	flex: 1 1 auto;
	padding: 20px 24px 28px;
	overflow-y: auto;
	overscroll-behavior: contain;
	outline: none;
}

/* Contenu de la fiche : mêmes styles que la page, quelques ajustements */
.bdg-apercu-contenu .bdg-apercu-titre {
	margin-top: 0;
}

.bdg-apercu-contenu::after {
	content: "";
	display: table;
	clear: both;
}

.bdg-apercu-contenu img {
	max-width: 100%;
	height: auto;
}

.bdg-apercu-contenu a[rel="lightbox"]:not([href]) {
	cursor: default;
}

/* Flèches précédente / suivante, de part et d'autre de la fenêtre */
body .bdg-apercu-nav {
	position: fixed;
	top: 50%;
	display: grid;
	place-items: center;
	width: 52px;
	height: 52px;
	margin: -26px 0 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: #fff;
	color: #e7501e;
	box-shadow: 0 4px 14px rgba(0, 0, 0, .3);
	cursor: pointer;
	transition: background-color .2s ease, color .2s ease, transform .2s ease;
}

body .bdg-apercu-nav[hidden] {
	display: none;
}

body .bdg-apercu-nav:hover,
body .bdg-apercu-nav:focus-visible {
	background: #e7501e;
	color: #fff;
}

body .bdg-apercu-nav:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 2px;
}

.bdg-apercu-prec {
	left: 12px;
}

.bdg-apercu-suiv {
	right: 12px;
}

.bdg-apercu-suiv svg {
	transform: scaleX(-1);
}

/* Chargement */
.bdg-apercu-attente {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 14px;
	min-height: 260px;
	color: #555;
	font-family: Ubuntu, Arial, Tahoma, sans-serif;
	text-align: center;
}

.bdg-apercu-roue {
	width: 34px;
	height: 34px;
	border: 3px solid #f3c2b0;
	border-top-color: #e7501e;
	border-radius: 50%;
	animation: bdg-apercu-rotation .8s linear infinite;
}

@keyframes bdg-apercu-rotation {
	to {
		transform: rotate(360deg);
	}
}

/* Mobile : fenêtre plein écran, flèches en bas */
@media (max-width: 760px) {
	.bdg-apercu {
		padding: 0;
	}

	.bdg-apercu-cadre {
		height: 100%;
		border-radius: 0;
	}

	.bdg-apercu-contenu {
		padding: 16px 16px 84px;
	}

	body .bdg-apercu-nav {
		top: auto;
		bottom: 16px;
		width: 48px;
		height: 48px;
		margin: 0;
	}

	.bdg-apercu-prec {
		left: 16px;
	}

	.bdg-apercu-suiv {
		right: 16px;
	}

	/* Fiche sur une colonne : texte puis image */
	.bdg-apercu-contenu .info-single-sortie,
	.bdg-apercu-contenu .img-single-sortie {
		float: none;
		width: auto;
		max-width: none;
		min-width: 0;
		max-height: none;
		padding: 0 0 15px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.bdg-apercu-roue {
		animation-duration: 2s;
	}

	body .bdg-apercu-ouvrir:hover,
	body .bdg-apercu-ouvrir:focus-visible {
		transform: none;
	}
}