/**
 * Carte « Autour du riad ».
 *
 * Reprend l'habillage de la maquette carte.html, appliqué à la carte intégrée
 * directement dans la page (plus d'iframe).
 */

.rt-carte-vive {
	position: relative;
	isolation: isolate;
	z-index: 0;
	height: min(75vh, 620px);
	min-height: 520px;
	border-radius: 24px;
	overflow: hidden;
	background: var(--rt-vert-clair);
	box-shadow: var(--rt-ombre-panneau);
	font-family: var(--rt-texte-police);
	font-weight: 300;
	color: var(--rt-encre);
}

.rt-carte-vive--haute {
	height: min(78vh, 680px);
	min-height: 540px;
}

.rt-carte-plan {
	position: absolute;
	inset: 0;
}

.leaflet-container {
	font-family: var(--rt-texte-police);
	background: var(--rt-vert-clair);
}

/* Les deux sortes de points --------------------------------------------- */

.rt-point-riad {
	width: 20px;
	height: 20px;
	background: var(--rt-encre);
	border: 3px solid #fff;
	border-radius: 50%;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .45);
}

.rt-point-lieu {
	width: 28px;
	height: 28px;
	background: var(--rt-vert);
	border: 4px solid #fff;
	border-radius: 50%;
	box-shadow: 0 3px 10px rgba(0, 0, 0, .4);
	transition: transform .2s ease, background .2s ease;
	cursor: pointer;
}

.rt-point-lieu:hover {
	transform: scale(1.15);
}

.rt-point-lieu--actif {
	background: var(--rt-terre);
	transform: scale(1.4);
}

/* Filtres --------------------------------------------------------------- */

.rt-carte-filtres {
	position: absolute;
	z-index: 500;
	top: 14px;
	left: 14px;
	right: 14px;
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.rt-carte-filtres button {
	font-family: inherit;
	font-size: 13px;
	font-weight: 500;
	border: 1px solid rgba(23, 33, 29, .15);
	background: rgba(246, 243, 236, .94);
	color: var(--rt-encre);
	border-radius: var(--rt-rayon-pilule);
	padding: 8px 15px;
	cursor: pointer;
	backdrop-filter: blur(6px);
	box-shadow: 0 6px 18px -12px rgba(23, 33, 29, .7);
	transition: background .2s ease, color .2s ease, border-color .2s ease;
}

.rt-carte-filtres button:hover {
	border-color: rgba(23, 33, 29, .4);
}

.rt-carte-filtres button[aria-pressed="true"] {
	background: var(--rt-encre);
	border-color: var(--rt-encre);
	color: #fff;
}

/* Fiche du lieu --------------------------------------------------------- */

.rt-carte-fiche {
	position: absolute;
	z-index: 600;
	right: 14px;
	bottom: 14px;
	width: min(380px, calc(100% - 28px));
	max-height: calc(100% - 90px);
	overflow-y: auto;
	background: var(--rt-creme);
	border-radius: 20px;
	padding: 22px 22px 24px;
	box-shadow: 0 30px 70px -40px rgba(23, 33, 29, .9);
}

.rt-carte-fiche[hidden] {
	display: none;
}

.rt-carte-fiche p {
	margin: 0 0 12px;
	font-size: 15px;
	line-height: 1.65;
	color: var(--rt-texte);
}

.rt-carte-fiche__fermer {
	position: absolute;
	top: 14px;
	right: 16px;
	border: 0;
	background: transparent;
	font-family: inherit;
	font-size: 20px;
	line-height: 1;
	color: var(--rt-gris);
	cursor: pointer;
}

.rt-carte-fiche__fermer:hover {
	color: var(--rt-encre);
}

.rt-carte-fiche__cat {
	margin: 0 0 8px !important;
	font-size: 11px;
	letter-spacing: .2em;
	text-transform: uppercase;
	font-weight: 500;
	color: var(--rt-vert) !important;
}

.rt-carte-fiche__titre {
	margin: 0 0 10px;
	padding-right: 22px;
	font-family: var(--rt-titre);
	font-weight: 400;
	font-size: 27px;
	line-height: 1.12;
	color: var(--rt-encre);
}

.rt-carte-fiche__section {
	margin: 18px 0 8px;
	font-size: 11px;
	letter-spacing: .18em;
	text-transform: uppercase;
	font-weight: 500;
	color: var(--rt-vert);
}

.rt-carte-fiche__chips {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	margin-bottom: 14px;
}

.rt-carte-fiche__liste {
	margin: 0 0 6px;
	padding: 0 0 0 18px;
	font-size: 15px;
	line-height: 1.6;
	color: var(--rt-texte);
}

.rt-carte-fiche__liste li {
	margin-bottom: 6px;
}

.rt-carte-fiche__rangs {
	margin: 0 0 6px;
	border-top: 1px solid var(--rt-ligne);
}

.rt-carte-fiche__rang {
	display: flex;
	justify-content: space-between;
	gap: 14px;
	padding: 10px 0;
	border-bottom: 1px solid var(--rt-ligne);
	font-size: 14px;
}

.rt-carte-fiche__rang dt {
	color: var(--rt-gris);
}

.rt-carte-fiche__rang dd {
	margin: 0;
	text-align: right;
}

.rt-carte-fiche__note {
	font-size: 13px !important;
	color: var(--rt-gris) !important;
	line-height: 1.55;
}

.rt-carte-fiche__actions {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	margin-top: 16px;
}

.rt-carte-fiche__actions .rt-btn {
	padding: 12px 22px;
}

@media (max-width: 700px) {
	.rt-carte-fiche {
		right: 8px;
		left: 8px;
		bottom: 8px;
		width: auto;
		max-height: 64%;
	}
}