/* ==========================================================================
   S06 — Carte des événements
   Palette : variables globales --s06-* du site, avec valeurs de secours.
   ========================================================================== */
.s06-cv {
	--cv-fond: var(--s06-fond, #FFFFFF);
	--cv-fond-clair: var(--s06-fond-clair, #F7F5F1);
	--cv-texte: var(--s06-texte, #1E1C1A);
	--cv-att: var(--s06-texte-att, #6B6560);
	--cv-bordure: var(--s06-bordure, #E7E2DA);
	--cv-or: var(--s06-principale-1, #D4AF37);
	--cv-or-fonce: var(--s06-principale-2, #B8952C);
	--cv-or-clair: var(--s06-principale-3, #F3E4C9);

	max-width: 1200px;
	margin: 0 auto;
	padding: 0 16px;
	box-sizing: border-box;
	color: var(--cv-texte);
}

.s06-cv .s06-cv__title { margin: 0 0 6px; text-align: center; text-transform: uppercase; font-size: clamp(1.4rem, 2.6vw, 2rem); letter-spacing: .02em; }
.s06-cv .s06-cv__title::after { content: ""; display: block; width: 64px; height: 4px; border-radius: 2px; background: var(--cv-or); margin: 12px auto 0; }
.s06-cv .s06-cv__subtitle { margin: 10px 0 22px; text-align: center; color: var(--cv-att); }

.s06-cv .s06-cv__map {
	width: 100%;
	height: var(--cv-h, 520px);
	border-radius: 14px;
	overflow: hidden;
	border: 1px solid var(--cv-bordure);
	box-shadow: 0 6px 24px rgba(11, 18, 32, .10);
	background: var(--cv-fond-clair);
	z-index: 0;
}
.s06-cv .s06-cv__count { margin: 10px 0 0; text-align: center; font-size: .9rem; color: var(--cv-att); }

/* Marqueurs : un lieu = un marqueur doré, avec le nombre d'événements s'il y en a plusieurs */
.s06-cv-pin { background: none; border: 0; }
.s06-cv-pin span {
	display: flex; align-items: center; justify-content: center;
	width: 30px; height: 30px; box-sizing: border-box; border-radius: 50%;
	background: var(--s06-principale-1, #D4AF37); color: var(--s06-texte, #1E1C1A);
	border: 3px solid #fff; box-shadow: 0 2px 8px rgba(0, 0, 0, .35);
	font: 700 13px/1 system-ui, sans-serif;
}
.s06-cv-pin .s06-cv-dot { width: 22px; height: 22px; margin: 4px; border-width: 3px; }
.s06-cv-pin--multi span { background: var(--s06-principale-2, #B8952C); color: #fff; }

/* Regroupements de marqueurs */
.s06-cv-cluster { background: none; }
.s06-cv-cluster div {
	width: 44px; height: 44px; border-radius: 50%; box-sizing: border-box; padding: 5px;
	background: rgba(212, 175, 55, .4);
}
.s06-cv-cluster span {
	display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; border-radius: 50%;
	background: var(--s06-principale-1, #D4AF37); color: var(--s06-texte, #1E1C1A);
	font: 800 14px/1 system-ui, sans-serif; box-shadow: 0 2px 6px rgba(0, 0, 0, .3);
}

/* Fenêtre d'information */
.s06-cv-pop { font-size: .9rem; }
.s06-cv-pop__head { margin-bottom: 8px; line-height: 1.3; }
.s06-cv-pop__lieu { font-size: 1rem; }
.s06-cv-pop__ville { color: #6B6560; }
.s06-cv-pop__list { list-style: none; margin: 0; padding: 0; max-height: 220px; overflow-y: auto; }
.s06-cv-pop__item { padding: 8px 0; border-top: 1px solid #E7E2DA; display: flex; flex-direction: row; align-items: center; gap: 10px; }
.s06-cv-pop__thumb { flex: 0 0 56px; width: 56px; height: 56px; border-radius: 8px; overflow: hidden; background: #F7F5F1; display: block; }
.s06-cv-pop__thumb img { width: 56px; height: 56px; object-fit: cover; display: block; margin: 0; max-width: none; }
.s06-cv-pop__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.s06-cv-pop__date { font-size: .75rem; font-weight: 700; color: var(--s06-principale-2, #B8952C); }
.s06-cv-pop__title { font-weight: 600; color: #1E1C1A; text-decoration: none; }
.s06-cv-pop__title:hover { color: var(--s06-principale-2, #B8952C); text-decoration: underline; }
.s06-cv-pop__tarif { font-size: .75rem; color: #6B6560; }

/* Diagnostic (administrateurs, ?s06debug=1) */
.s06-cv .s06-cv__debug { margin-top: 14px; padding: 12px 14px; border-radius: 8px; background: #fff3cd; border: 1px solid #ffe08a; color: #5c4a00; font-size: .85rem; }
.s06-cv .s06-cv__debug ul { margin: 8px 0 0 18px; padding: 0; }
.s06-cv .s06-cv__debug a { color: inherit; text-decoration: underline; }

/* Mise en page : types d'événement à gauche, carte à droite (même hauteur) */
.s06-cv .s06-cv__layout { --cv-h: 520px; }
.s06-cv .s06-cv__layout.has-filters {
	display: grid;
	grid-template-columns: 250px minmax(0, 1fr);
	gap: 16px;
	align-items: start;
}

.s06-cv .s06-cv__filters {
	display: flex; flex-direction: column; gap: 4px;
	max-height: var(--cv-h); overflow-y: auto; box-sizing: border-box;
	padding: 10px; border: 1px solid var(--cv-bordure); border-radius: 14px; background: var(--cv-fond);
	scrollbar-width: thin;
}
.s06-cv .s06-cv__filters[hidden] { display: none; }
.s06-cv .s06-cv__filters-title { margin: 2px 6px 6px; font-weight: 800; font-size: .95rem; color: var(--cv-texte); }

.s06-cv .s06-cv__chip {
	display: flex; align-items: center; justify-content: space-between; gap: 8px;
	width: 100%; margin: 0; padding: 9px 12px; text-align: left; cursor: pointer;
	border: 1px solid transparent; border-radius: 10px; background: transparent; color: var(--cv-texte);
	font: inherit; font-size: .92rem; font-weight: 600; line-height: 1.2;
	transition: background .15s, border-color .15s;
}
.s06-cv .s06-cv__chip:hover { background: var(--cv-or-clair); }
.s06-cv .s06-cv__chip.is-active { background: var(--s06-bouton-1, #D4AF37); color: var(--s06-bouton-1-texte, #1E1C1A); }
.s06-cv .s06-cv__chip-n { flex: 0 0 auto; font-size: .8rem; font-weight: 700; opacity: .65; }

/* Tablette / mobile : les types repassent au-dessus de la carte, sur une ligne défilante */
@media (max-width: 820px) {
	.s06-cv .s06-cv__layout { --cv-h: 420px !important; }
	.s06-cv .s06-cv__layout.has-filters { grid-template-columns: minmax(0, 1fr); gap: 10px; }
	.s06-cv .s06-cv__filters {
		flex-direction: row; gap: 8px; max-height: none; overflow-x: auto; overflow-y: hidden;
		padding: 0 0 6px; border: 0; background: none; -webkit-overflow-scrolling: touch;
	}
	.s06-cv .s06-cv__filters-title { display: none; }
	.s06-cv .s06-cv__chip {
		flex: 0 0 auto; width: auto; gap: 6px; padding: 8px 14px; border-radius: 999px;
		border: 1px solid var(--cv-bordure); background: var(--cv-fond);
	}
	.s06-cv .s06-cv__chip.is-active { border-color: var(--s06-bouton-1, #D4AF37); }
}