/* Mappa dei risultati (lista immobili, aste): segnaposto con il prezzo, gruppi e scheda rapida sul segnaposto. */
/* ---------- Mappa Leaflet: fuori dai livelli, perche' leaflet.css (senza livello) vincerebbe su qualunque livello ---------- */
/* Leaflet nei colori della v2 */
.map .leaflet-container { font: inherit; background: var(--tint); }
.map .leaflet-control-attribution { font-size: 11px; background: color-mix(in srgb, var(--ground) 85%, transparent); }

/* segnaposto con il prezzo */
.v2-pin, .v2-cluster { background: none; border: 0; }
.v2-pin .p {
  position: absolute;
  left: 0;
  bottom: 0;
  translate: -50% 0;
  display: block;
  padding: 8px 11px;
  border-radius: var(--r-pill);
  background: var(--accent);
  color: var(--on-ink);
  box-shadow: var(--shadow-pin);
  font: 600 13px/1 var(--font);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease), scale .25s var(--ease-spring);
}
.v2-pin .p::after { content: ""; position: absolute; left: 50%; bottom: -5px; width: 10px; height: 10px; translate: -50% 0; rotate: 45deg; background: inherit; border-radius: 0 0 3px 0; }
.v2-pin:hover .p, .v2-pin.is-hot .p { background: var(--ink); color: var(--on-ink); scale: 1.08; }
/* selezionato: bianco con il bordo verde spesso, che continua sulla punta */
.v2-pin.is-open .p { background: var(--ground); color: var(--ink); box-shadow: inset 0 0 0 3px var(--accent), var(--shadow-pin); scale: 1.1; }
.v2-pin.is-open .p::after { bottom: -6px; border: solid var(--accent); border-width: 0 3px 3px 0; }
.v2-pin.is-seen:not(.is-hot, .is-open, :hover) .p { background: var(--accent-soft); color: var(--ink); }
.v2-pin:focus-visible { outline: none; }
.v2-pin:focus-visible .p { outline: 3px solid var(--accent); outline-offset: 2px; }
.leaflet-marker-icon.is-hot, .leaflet-marker-icon.is-open { z-index: 10000 !important; }
/* «Ci vanno vicino» (lista con pochi risultati): bianchi con il bordo tratteggiato, sotto quelli che rispondono a tutto */
.v2-pin.is-near:not(.is-hot, .is-open, :hover) .p { background: var(--ground); color: var(--ink); box-shadow: var(--shadow-pin); outline: 2px dashed var(--accent); outline-offset: -2px; }
.v2-cluster.is-near:not(.is-hot, :hover) span { background: var(--ground); color: var(--ink); box-shadow: 0 0 0 6px color-mix(in srgb, var(--ink) 10%, transparent), var(--shadow-pin); outline: 2px dashed var(--accent); outline-offset: -2px; }

.v2-cluster span {
  display: grid;
  place-content: center;
  justify-items: center;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: var(--ink);
  color: var(--on-ink);
  box-shadow: 0 0 0 6px color-mix(in srgb, var(--ink) 18%, transparent), var(--shadow-pin);
  font: 600 14px/1.05 var(--font);
  cursor: pointer;
  transition: background-color var(--dur-fast) var(--ease), box-shadow .25s var(--ease);
}
.v2-cluster small { display: block; font-size: 9.5px; font-weight: 500; opacity: .8; white-space: nowrap; }
.v2-cluster:hover span, .v2-cluster.is-hot span { background: var(--accent); box-shadow: 0 0 0 10px color-mix(in srgb, var(--accent) 22%, transparent), var(--shadow-pin); }

/* scheda rapida sopra il segnaposto (popup Leaflet) */
.v2-peek .leaflet-popup-content-wrapper { padding: 0; border-radius: var(--r-md); overflow: hidden; box-shadow: var(--shadow-menu); }
.v2-peek .leaflet-popup-content { width: 280px !important; margin: 0; font: inherit; line-height: var(--lh-text); }
.v2-peek .leaflet-popup-tip { box-shadow: none; }
/* leaflet.css arriva dopo questo foglio: a parita' di forza vince lui, da qui i selettori piu' lunghi (bottone X e margini) */
.leaflet-container .v2-peek a.leaflet-popup-close-button { top: 10px; right: 10px; z-index: 2; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--ground); color: var(--ink); font: 400 20px/1 var(--font); box-shadow: var(--shadow-menu); }
.leaflet-container .v2-peek a.leaflet-popup-close-button:is(:hover, :focus-visible) { background: var(--tint); color: var(--ink); }
.v2-peek .leaflet-popup-content p { margin: 0; }
.peek .pm { position: relative; aspect-ratio: 16 / 10; background: var(--tint-2); }
.peek .pm img { width: 100%; height: 100%; object-fit: cover; }
.peek .pb { display: grid; gap: 2px; padding: 12px 14px 14px; }
.peek .pp { font-family: var(--display); font-size: 1.25rem; font-weight: 500; font-variant-numeric: tabular-nums; }
.peek .pt { font-size: var(--step-small); font-weight: 500; line-height: 1.35; }
.peek .pa, .peek .pf { font-size: 13px; color: var(--ink-soft); }
.peek .pf { display: flex; flex-wrap: wrap; gap: 4px 12px; }
.v2-peek .leaflet-popup-content .pf { margin-top: 4px; }
.peek .btn { margin-top: 10px; min-height: var(--control-h-sm); font-size: var(--step-small); color: var(--on-ink); }
.peek ul { margin: 0; padding: 12px 48px 12px 14px; /* a destra il posto per la X */ list-style: none; display: grid; gap: 8px; max-height: 260px; overflow: auto; }
.peek ul a { display: grid; text-decoration: none; font-size: var(--step-small); }
.peek ul a:hover b { color: var(--accent); }
.peek ul b { font-family: var(--display); font-weight: 500; }
/* Elenco degli annunci nello stesso punto (lista, aste, agenzie) o nella stessa zona (mappa della home): righe ben divise, la freccia al passaggio dice che si va alla scheda */
.peek-head { padding: 14px 48px 10px 14px; font-size: var(--step-small); font-weight: 600; }
.peek.peek-group ul { gap: 0; padding: 0; }
.peek.peek-group ul a { position: relative; gap: 1px; padding: 10px 40px 10px 14px; box-shadow: inset 0 1px 0 var(--tint-2); color: var(--ink); transition: background-color var(--dur-fast) var(--ease); }
.peek.peek-group ul a:is(:hover, :focus-visible) { background: var(--tint); }
.peek.peek-group ul span { color: var(--ink-soft); }
.peek.peek-group ul i { position: absolute; right: 14px; top: 50%; translate: -4px -50%; color: var(--accent); font-style: normal; font-weight: 600; opacity: 0; transition: opacity var(--dur-fast) var(--ease), translate var(--dur-fast) var(--ease); }
.peek.peek-group ul a:is(:hover, :focus-visible) i { translate: 0 -50%; opacity: 1; }
@media (prefers-reduced-motion: reduce) { .peek.peek-group ul a, .peek.peek-group ul i { transition: none; } }
/* mappa della home: sotto l'elenco quanti altri e il bottone per la ricerca; in attesa, una riga sola */
.peek-foot { display: grid; padding: 4px 14px 14px; box-shadow: inset 0 1px 0 var(--tint-2); }
.peek-more { padding-top: 8px; font-size: 13px; color: var(--ink-soft); }
.peek-wait { padding: 16px 48px 16px 14px; font-size: var(--step-small); color: var(--ink-soft); }
@media (max-width: 960px) {
  .v2-peek .leaflet-popup-content { width: 240px !important; }
}
@media (prefers-reduced-motion: reduce) {
  .v2-pin .p { transition: none; }
}