/* carte.css — page /carte (carte interactive + liste synchronisée) */
.carte-page { padding: 24px var(--container-padding) 60px; }
.carte-page__head { margin-bottom: 16px; }

.carte-filters {
  display: flex; align-items: flex-end; gap: 18px; flex-wrap: wrap;
  background: #fff; border: 1px solid var(--bordure); border-radius: 14px; padding: 14px 18px; margin-bottom: 18px;
}
.carte-filter { display: flex; flex-direction: column; gap: 4px; font-size: 12.5px; font-weight: 800; color: var(--vert-primaire); }
.carte-filter select {
  border: 1.5px solid var(--bordure-input); border-radius: 9px; padding: 8px 10px; font: inherit; font-size: 13.5px;
  color: var(--texte-principal); background: #fff; min-width: 160px;
}
.carte-filter__list-link {
  margin-left: auto; display: flex; align-items: center; gap: 6px; font-weight: 700; font-size: 13.5px;
  color: var(--vert-primaire); text-decoration: none;
}
.carte-filter__list-link:hover { text-decoration: underline; }

.carte-layout { display: grid; grid-template-columns: 1fr 360px; gap: 18px; align-items: start; }
.carte-map {
  height: 640px; border-radius: 16px; overflow: hidden; border: 1px solid var(--bordure);
  box-shadow: var(--shadow-card);
}
.carte-results {
  background: #fff; border: 1px solid var(--bordure); border-radius: 16px; padding: 14px;
  height: 640px; display: flex; flex-direction: column;
}
.carte-results__count { margin: 0 0 10px; font-size: 13px; font-weight: 700; color: var(--texte-secondaire); }
.carte-results__list { overflow-y: auto; display: flex; flex-direction: column; gap: 8px; flex: 1; }

.carte-result-card {
  display: flex; gap: 10px; align-items: center; padding: 8px; border-radius: 10px;
  text-decoration: none; color: inherit; border: 1px solid transparent;
}
.carte-result-card:hover { background: var(--vert-pale); border-color: var(--bordure); }
.carte-result-card__img { width: 56px; height: 56px; border-radius: 9px; object-fit: cover; flex: 0 0 auto; background: var(--beige-fond); }
.carte-result-card__img--ph { display: flex; align-items: center; justify-content: center; }
.carte-result-card__img--ph i { width: 18px; height: 18px; color: var(--texte-gris-clair); }
.carte-result-card__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.carte-result-card__body strong { font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.carte-result-card__stars { font-size: 11px; color: var(--orange); letter-spacing: 1px; }
.carte-result-card__city { font-size: 12px; color: var(--texte-secondaire); }

.carte-popup { min-width: 160px; }
.cmc-marker { background: transparent; border: none; }
/* 1 doigt = scroll la page, 2 doigts = deplace la carte (mobile) */
.carte-map.leaflet-container, .map-embed-block.leaflet-container { touch-action: pan-y !important; }

@media (max-width: 900px) {
  .carte-layout { grid-template-columns: 1fr; }
  .carte-map { height: 420px; }
  .carte-results { height: 360px; }
}

/* ── Étape 1 : sélection de région (réutilise .regions-layout/.france-map/.region-chip de main.css) ── */
#carte-region-picker { margin-bottom: 8px; }

/* ── Étape 2 : entête (région choisie + retour) ── */
.carte-explore__head { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; }
.carte-back-btn {
  display: inline-flex; align-items: center; gap: 6px; background: #fff; border: 1.5px solid var(--bordure-input);
  border-radius: 999px; padding: 8px 16px; font: inherit; font-size: 13px; font-weight: 700;
  color: var(--vert-primaire); cursor: pointer;
}
.carte-back-btn:hover { border-color: var(--vert-primaire); background: var(--vert-pale); }
.carte-back-btn svg, .carte-back-btn i { width: 15px; height: 15px; }
.carte-current-region { font-size: 20px; font-weight: 800; font-family: 'Bitter', serif; color: var(--vert-fonce); }

.carte-filter--equip { flex: 1 1 auto; }
.carte-filter__equip-list { display: flex; flex-wrap: wrap; gap: 4px 16px; }
.check--sm { margin-bottom: 0; font-size: 12.5px; font-weight: 600; }
.check--sm .check__box { width: 15px; height: 15px; }
.check--sm .check__box svg { width: 9px; height: 9px; }

/* ── Filtre région = carte de France cliquable, dans la sidebar de /campings ── */
.france-map-wrap--filter { padding: 10px; margin-bottom: 8px; }
.france-map-wrap--filter .france-map { max-height: 200px; }
.france-map-wrap--filter .france-map-hint { font-size: 10px; padding: 3px 8px; bottom: 8px; right: 10px; }
.fr-region.is-selected path { fill: var(--orange); }
.region-selected-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 6px; }
.region-chip-mini {
  display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700;
  color: var(--vert-primaire); background: var(--vert-pale); border-radius: 999px; padding: 5px 10px;
}
.region-chip-mini svg, .region-chip-mini i { width: 12px; height: 12px; flex: 0 0 auto; }
.region-chip-mini__x {
  border: none; background: none; cursor: pointer; color: var(--texte-secondaire);
  font-size: 12px; line-height: 1; padding: 0; margin-left: 2px;
}
.region-chip-mini__x:hover { color: #b3261e; }

/* ── Carte embarquée dans la grille de résultats de /campings (2 premières places) ── */
.map-embed-block .leaflet-popup-content-wrapper { border-radius: 10px; }
/* Isole le contexte d'empilement : les calques internes de Leaflet (z-index jusqu'à 1000)
   ne doivent pas passer par-dessus le header sticky du site (z-index 30). */
.map-embed-block, .carte-map { position: relative; z-index: 1; isolation: isolate; }