/* vorOrt dabei – app v6: Karte (ziehbares Listen-Sheet, Vorschaukarte mit ×, Fokus, Querformat, Zoom) */

/* ---------- Listen-Sheet: klein / mittel / groß ---------- */
.msheet-body { min-height: 0; flex: 1 1 auto; }
.msheet.snap-max { max-height: none; height: calc(100% - var(--safe-t) - 76px); }
.msheet.dragging { user-select: none; -webkit-user-select: none; }
.msheet.dragging .msheet-body { display: flex; }
.grip-btn { height: 30px; width: 120px; touch-action: none; cursor: grab; }
.grip-btn:active { cursor: grabbing; }
.grip-btn:focus-visible { outline: 3px solid var(--teal-d); outline-offset: -3px; border-radius: 10px; }
.msheet .pleg, .msheet .tabs2 { touch-action: pan-x; }
.karte.sheet-max .locate, .karte.sheet-max .ppv-slot { display: none; }

/* ---------- Vorschaukarte: Schließen-X, Kategorie-Zeile ---------- */
.ppv { position: relative; }
.ppv-b { padding-right: 30px; }
.ppv-x {
  position: absolute; top: 4px; right: 4px; width: 40px; height: 40px; border: 0; border-radius: 20px;
  background: transparent; color: var(--muted); display: flex; align-items: center; justify-content: center; cursor: pointer;
}
.ppv-x:hover { color: var(--navy); background: var(--mint-l); }
.ppv-x:focus-visible { outline: 3px solid var(--teal-d); outline-offset: -3px; }
.ppv-k { display: inline-flex; align-items: center; gap: 4px; font-weight: 700; font-size: 0.875rem; color: var(--teal-d); text-transform: uppercase; letter-spacing: .02em; }
.ppv-k .ico-svg { flex-shrink: 0; }

/* ausgewählter Orts-Pin (Strand / Ort) */
.opin.is-sel { box-shadow: 0 0 0 3px var(--navy), 0 0 0 7px rgba(243, 197, 0, .45), 0 4px 12px rgba(14, 28, 52, .4); transform: translate(-50%, -50%) scale(1.15); }
.spin.is-sel .spin-img { box-shadow: 0 0 0 3px #fff, 0 0 0 6px var(--navy), 0 0 0 11px rgba(243, 197, 0, .5), 0 4px 12px rgba(29,54,95,.4); }
.spin.is-sel .pin-l { background: var(--navy); color: #fff; text-shadow: none; }

/* ---------- Pins: Beschriftung auf heller Pille (lesbar über Partner-Logos) ---------- */
.pin .pin-l, .spin .pin-l {
  background: rgba(255, 255, 255, .94); padding: 1px 6px; border-radius: 6px; text-shadow: none;
  box-shadow: 0 1px 3px rgba(29, 54, 95, .22);
}
.saison-halloween .pin .pin-l, .saison-halloween .spin .pin-l { background: rgba(30, 16, 48, .9); color: #FFE8D1; box-shadow: 0 0 0 1px #F07B1A; }

/* Fokusrahmen für Marker (nur wenn per Screenreader/Skript fokussiert) */
.leaflet-marker-icon:focus-visible .opin { outline: 3px solid var(--navy); outline-offset: 3px; }

/* ---------- Karte nicht geladen / Kacheln fehlen: erneut versuchen ---------- */
.map-retry { margin-top: 10px; height: 44px; gap: 6px; }
.tile-retry {
  border: 0; background: none; padding: 0; margin: 0; font: inherit; font-weight: 700; color: var(--teal-d);
  text-decoration: underline; text-underline-offset: 2px; cursor: pointer; min-height: 24px;
}
.saison .karte .tile-warn { top: calc(var(--safe-t) + 190px); }

/* ---------- Suche: Hinweis auf passende Orte unter der Terminliste ---------- */
.map-alt {
  display: flex; align-items: center; gap: 6px; margin: 8px 0 2px; padding: 10px 12px; min-height: 44px; width: 100%;
  border: 0; border-radius: 12px; background: var(--mint-l); color: var(--teal-d); font: inherit; font-weight: 700; font-size: 0.9062rem; text-align: left; cursor: pointer;
}
.map-alt .ico-svg { flex-shrink: 0; }
.msheet .empty .btn + .btn { margin-top: 8px; }

/* ---------- Wenig Höhe (Querformat, große Schrift, Browser-Zoom) ---------- */
@media (max-height: 640px) {
  .msheet { max-height: 58%; }
  .msheet .pleg { display: none; }
}
@media (max-height: 500px) {
  /* Standortknopf neben die Suche statt über die Chips */
  .karte .locate { top: calc(var(--safe-t) + 16px); bottom: auto; }
  .karte .map-bar { padding-right: 58px; }
  .msheet { max-height: 52%; }
  .msheet.snap-max { height: calc(100% - var(--safe-t) - 70px); }
  .msheet.collapsed .sortrow { display: none; }
  /* Vorschaukarte flacher */
  .ppv { min-height: 0; padding: 8px 10px; gap: 10px; }
  .ppv-im { width: 72px; }
  .ppv-b { gap: 2px; }
  .ppv-t { font-size: 1.0625rem; -webkit-line-clamp: 1; }
  .ppv-m { display: none; }
  .ppv-bt .btn { height: 34px; }
}
/* große Schrift / Zoom: Kopfbereich zu hoch → mittlere Stufe höher (gesetzt in map.js) */
.msheet.grow:not(.collapsed):not(.snap-max) { max-height: 74%; }

/* Partner-Bündel (Basis-Partner, die beim aktuellen Zoom eng beieinander liegen) */
.pbundle { position: absolute; left: 0; top: 0; transform: translate(-50%, -50%); cursor: pointer; }
.pb-c {
  display: flex; align-items: center; justify-content: center; gap: 0;
  min-width: 44px; height: 44px; padding: 0 4px; border-radius: 22px; background: #fff; color: var(--teal-d);
  box-shadow: 0 0 0 1.5px var(--teal-d), 0 2px 6px rgba(14, 28, 52, .3);
}
.pb-c img { width: 30px; height: 30px; border-radius: 15px; object-fit: cover; border: 2px solid #fff; box-shadow: 0 0 0 1px rgba(14, 28, 52, .15); }
.pb-c img + img { margin-left: -12px; }
.pb-n {
  position: absolute; right: -6px; top: -6px; min-width: 22px; height: 22px; padding: 0 5px; border-radius: 11px;
  background: var(--teal-d); color: #fff; font-weight: 700; font-size: 0.8125rem; line-height: 22px; text-align: center;
  border: 2px solid #fff;
}
.leaflet-marker-icon:focus-visible .pb-c { outline: 3px solid var(--teal-d); outline-offset: 3px; }
.saison-halloween .pb-c { box-shadow: 0 0 0 2px #F07B1A, 0 0 12px rgba(240,123,26,.5); }