/* =========================================================================
   Refuge de Taveyanne — page « Rando »
   Carte swisstopo plein écran + typographie uniforme + mise en page moderne.
   Tout est limité à .page-id-145 pour ne pas toucher au reste du site.
   ========================================================================= */

:root {
	--tav-accent: #e8722b;
	--tav-accent-dark: #c85d1e;
	--tav-green: #2f6d4f;
	--tav-ink: #20272e;
	--tav-muted: #6b7280;
	--tav-line: #e8e3da;
	--tav-soft: #faf8f4;
	--tav-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
		Helvetica, Arial, sans-serif;
}

/* ---- 1. TYPOGRAPHIE UNIFORME --------------------------------------------- */
/* On force une police unique sur tout le contenu de la page (les <span> en
   "Albert Sans" inline et les titres en "Montserrat Alternates" sont
   neutralisés grâce à !important). */
body.page-id-145 #main-content,
body.page-id-145 #main-content h1,
body.page-id-145 #main-content h2,
body.page-id-145 #main-content h3,
body.page-id-145 #main-content h4,
body.page-id-145 #main-content h5,
body.page-id-145 #main-content h6,
body.page-id-145 #main-content p,
body.page-id-145 #main-content a,
body.page-id-145 #main-content li,
body.page-id-145 #main-content span,
body.page-id-145 #main-content strong,
body.page-id-145 #main-content em,
body.page-id-145 #main-content div,
.taveyanne-map-wrap,
.taveyanne-map-wrap * {
	font-family: var(--tav-font) !important;
}

body.page-id-145 #main-content {
	color: var(--tav-ink);
}

/* ---- 2. SECTION TITRE (HERO) --------------------------------------------- */
body.page-id-145 #main-content h1 {
	text-align: center;
	font-weight: 800;
	font-size: clamp(2.7rem, 6vw, 4.4rem);
	line-height: 1.05;
	letter-spacing: -0.025em;
	color: var(--tav-ink);
	margin: 0.2em 0 0.35em;
	position: relative;
}
body.page-id-145 #main-content h1::before {
	content: 'Tour des Alpes Vaudoises';
	display: block;
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--tav-accent);
	margin-bottom: 0.9rem;
}
body.page-id-145 #main-content h1::after {
	content: '';
	display: block;
	width: 64px;
	height: 4px;
	border-radius: 4px;
	background: var(--tav-accent);
	margin: 0.7rem auto 0;
}

/* ---- 3. LIEN PDF « VTT / E-BIKE » EN BOUTON ------------------------------ */
body.page-id-145 #main-content .et_pb_text h3 a[href$='.pdf'] {
	display: inline-flex;
	align-items: center;
	gap: 0.6em;
	padding: 0.7em 1.4em;
	background: var(--tav-ink);
	color: #fff !important;
	font-size: 0.92rem;
	font-weight: 600;
	letter-spacing: 0.01em;
	border-radius: 999px;
	text-decoration: none;
	transition: transform 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
	box-shadow: 0 6px 18px rgba(32, 39, 46, 0.18);
}
body.page-id-145 #main-content .et_pb_text h3 a[href$='.pdf']::before {
	content: '↧';
	font-size: 1.05em;
	line-height: 1;
}
body.page-id-145 #main-content .et_pb_text h3 a[href$='.pdf']:hover {
	background: var(--tav-accent);
	transform: translateY(-2px);
	box-shadow: 0 10px 24px rgba(232, 114, 43, 0.32);
}
/* Le h3 qui contient ce lien devient un simple conteneur centré. */
body.page-id-145 #main-content .et_pb_text h3:has(a[href$='.pdf']) {
	text-align: center;
}

/* ---- 4. SECTION DESCRIPTION + STATS -------------------------------------- */
body.page-id-145 #main-content .et_pb_text h3 {
	font-weight: 700;
	font-size: clamp(1.45rem, 2.6vw, 2rem);
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: var(--tav-ink);
}
body.page-id-145 #main-content .et_pb_text p {
	font-size: 1.06rem;
	line-height: 1.75;
	color: #44505a;
}
body.page-id-145 #main-content .et_pb_text strong {
	color: var(--tav-accent-dark);
	font-weight: 700;
}

/* Carte d'infos (Longueur / Temps / Exigences) construite à partir du
   balisage existant (.content.seperator > .tablecell). */
body.page-id-145 #main-content .et_pb_text .content.seperator {
	background: var(--tav-soft);
	border: 1px solid var(--tav-line);
	border-radius: 16px;
	padding: 0.4rem 1.3rem;
	margin-top: 1.4rem;
}
/* Les blocs imbriqués ne re-dessinent pas de carte. */
body.page-id-145 #main-content .et_pb_text .content.seperator .content.seperator {
	background: none;
	border: 0;
	padding: 0;
	margin: 0;
	border-radius: 0;
}
body.page-id-145 #main-content .et_pb_text .tablecell {
	display: block;
	padding: 0.62rem 0;
	font-size: 1.02rem;
	color: var(--tav-ink);
	border-bottom: 1px solid var(--tav-line);
}
body.page-id-145 #main-content .et_pb_text .content.seperator > .tablecell:last-child,
body.page-id-145 #main-content .et_pb_text .tablecell:empty {
	border-bottom: 0;
}
/* Cellules « conteneur » (qui en contiennent d'autres) : ce ne sont pas des
   lignes, on neutralise bordure et padding. */
body.page-id-145 #main-content .et_pb_text .content.seperator .tablecell:has(.tablecell) {
	padding: 0;
	border: 0;
}
/* Lignes réellement vides (vides ou ne contenant qu'un <span> vide) masquées. */
body.page-id-145 #main-content .et_pb_text .tablecell:empty,
body.page-id-145 #main-content .et_pb_text .tablecell:has(> span:only-child:empty) {
	display: none;
	padding: 0;
}
/* Titres et paragraphes « fantômes » du contenu importé : on les supprime
   pour resserrer la mise en page. */
body.page-id-145 #main-content .et_pb_text h2:empty,
body.page-id-145 #main-content .et_pb_text h2:has(> span:only-child:empty),
body.page-id-145 #main-content .et_pb_text p:has(> span:only-child:empty) {
	display: none;
}
body.page-id-145 #main-content .et_pb_text .tablelabel,
body.page-id-145 #main-content .et_pb_text .tablecell:first-child {
	font-weight: 700;
}
body.page-id-145 #main-content .et_pb_text .clear {
	clear: both;
}

/* Image « poster » de l'itinéraire. */
body.page-id-145 #main-content .et_pb_image img {
	border-radius: 16px;
	box-shadow: 0 18px 44px rgba(32, 39, 46, 0.16);
}

/* ---- 5. CARTE INTERACTIVE PLEIN ÉCRAN ------------------------------------ */
.taveyanne-map-wrap {
	position: relative;
	width: 100%;
	margin: 0;
}
.taveyanne-rando-map {
	width: 100%;
	height: min(82vh, 860px);
	min-height: 460px;
	background: #e9eef0;
	border-top: 1px solid var(--tav-line);
	border-bottom: 1px solid var(--tav-line);
	z-index: 1;
}
.taveyanne-rando-map.is-fullscreen {
	height: 100% !important;
	min-height: 100% !important;
}
.leaflet-container {
	font-family: var(--tav-font);
	font-size: 13px;
	background: #e9eef0;
}

/* Étiquette flottante (titre de l'itinéraire) */
.taveyanne-map-caption {
	position: absolute;
	top: 14px;
	left: 56px;
	z-index: 600;
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 11px 16px;
	background: rgba(20, 26, 31, 0.74);
	backdrop-filter: blur(7px);
	-webkit-backdrop-filter: blur(7px);
	border-radius: 13px;
	color: #fff;
	pointer-events: none;
	max-width: min(60%, 360px);
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25);
}
.taveyanne-map-caption__eyebrow {
	font-size: 0.66rem;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #ffc49a;
}
.taveyanne-map-caption__title {
	font-size: 1.16rem;
	font-weight: 700;
	line-height: 1.15;
}
.taveyanne-map-caption__meta {
	font-size: 0.82rem;
	font-weight: 400;
	color: rgba(255, 255, 255, 0.82);
}

/* ---- 6. MARQUEURS PERSONNALISÉS ------------------------------------------ */
.tav-pin {
	background: none !important;
	border: 0 !important;
}
.tav-pin__svg {
	display: block;
	width: 100%;
	height: 100%;
	filter: drop-shadow(0 4px 5px rgba(0, 0, 0, 0.35));
}
.tav-pin__svg svg {
	width: 100%;
	height: 100%;
	display: block;
}
.tav-pin--home {
	z-index: 1000 !important;
}
.tav-pin__label {
	position: absolute;
	left: 50%;
	top: -8px;
	transform: translate(-50%, -100%);
	white-space: nowrap;
	background: var(--tav-accent);
	color: #fff;
	font-size: 0.78rem;
	font-weight: 700;
	padding: 4px 10px;
	border-radius: 8px;
	box-shadow: 0 4px 12px rgba(232, 114, 43, 0.4);
}
.tav-pin__label::after {
	content: '';
	position: absolute;
	left: 50%;
	bottom: -5px;
	transform: translateX(-50%);
	border: 5px solid transparent;
	border-top-color: var(--tav-accent);
	border-bottom: 0;
}

/* ---- 7. CONTRÔLES & POPUPS LEAFLET --------------------------------------- */
.taveyanne-map-wrap .leaflet-bar {
	border: 0;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
	border-radius: 12px;
	overflow: hidden;
}
.taveyanne-map-wrap .leaflet-bar a,
.taveyanne-map-wrap .leaflet-touch .leaflet-bar a {
	width: 36px;
	height: 36px;
	line-height: 36px;
	color: var(--tav-ink);
	font-size: 18px;
	border-bottom-color: var(--tav-line);
}
.taveyanne-map-wrap .leaflet-bar a:hover {
	background: var(--tav-soft);
	color: var(--tav-accent-dark);
}
.tav-ctl__ico {
	font-size: 17px;
}

.taveyanne-map-wrap .leaflet-control-layers {
	border: 0;
	border-radius: 14px;
	padding: 6px;
	box-shadow: 0 6px 22px rgba(0, 0, 0, 0.16);
}
.taveyanne-map-wrap .leaflet-control-layers-expanded {
	padding: 12px 14px 12px 12px;
	min-width: 188px;
}
.taveyanne-map-wrap .leaflet-control-layers label {
	font-size: 0.9rem;
	font-weight: 500;
	color: var(--tav-ink);
	margin: 3px 0;
	display: flex;
	align-items: center;
	gap: 7px;
}
.taveyanne-map-wrap .leaflet-control-layers-separator {
	border-top: 1px solid var(--tav-line);
	margin: 8px 0;
}
.taveyanne-map-wrap .leaflet-control-layers input {
	accent-color: var(--tav-accent);
}

.tav-popup .leaflet-popup-content-wrapper {
	border-radius: 14px;
	box-shadow: 0 12px 34px rgba(0, 0, 0, 0.22);
	padding: 4px 6px;
}
.tav-popup .leaflet-popup-content {
	margin: 12px 16px;
	font-size: 0.92rem;
	line-height: 1.5;
}
.tav-popup .leaflet-popup-content strong {
	display: block;
	font-size: 1.04rem;
	font-weight: 700;
	color: var(--tav-ink);
	margin-bottom: 3px;
}
.tav-popup .leaflet-popup-content span {
	color: var(--tav-muted);
}
.tav-tip {
	background: var(--tav-ink);
	color: #fff;
	border: 0;
	border-radius: 7px;
	font-weight: 600;
	font-size: 0.8rem;
	padding: 4px 9px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
}
.tav-tip::before {
	border-top-color: var(--tav-ink);
}
.taveyanne-map-wrap .leaflet-control-attribution {
	background: rgba(255, 255, 255, 0.82);
	font-size: 11px;
	border-radius: 8px 0 0 0;
}

/* ---- 8. RESPONSIVE ------------------------------------------------------- */
@media (max-width: 980px) {
	.taveyanne-rando-map {
		height: 70vh;
	}
}
@media (max-width: 720px) {
	.taveyanne-map-caption {
		display: none;
	}
	.taveyanne-rando-map {
		height: 62vh;
		min-height: 380px;
	}
}