/* Mapvera — global map fixes applied to ALL maps (loaded after mapplic.css).
   General bug fixes live here; per-map branding (fonts, colours) stays in each
   map's own customcss, which migrates with the config. */

/* Fix: store logos were being forced square. Keep aspect ratio, cap the size. */
img.mapplic-thumbnail {
  object-fit: contain !important;
  width: auto !important;
  height: auto !important;
  max-width: 50px !important;
  max-height: 50px !important;
  display: block !important;
}

/* Mobile: keep the tooltip clear of the screen edge. */
@media only screen and (max-device-width: 600px) {
  div.mapplic-tooltip-body { margin-right: 50px; }
}

/* ── Mobile bottom sheet (portrait, <860px). ALL sheet styling lives HERE — not baked inline —
   so tweaks deploy live (mapvera.css is served must-revalidate) without a re-bake. The `html`
   prefix + !important also override any older inline copy left in already-baked pages. ── */

/* The sheet shell: fixed over the map, 10px in from the screen edges (map shows through),
   square, no shadow frame. Default position = collapsed (230px showing). */
html .mapplic-portrait .mapplic-sidebar {
  position: fixed !important; left: 10px !important; right: 10px !important; bottom: 0 !important; top: auto !important;
  z-index: 999; width: auto !important; height: 82vh !important; max-height: 82vh !important;
  margin: 0 !important; padding: 0 !important; float: none !important;
  border-radius: 0 !important; background: #fff; box-shadow: none !important;
  /* Sheet height (92vh) exactly matches the EXPANDED position (translateY(0)) so the whole
     sheet — including the list's bottom — is on-screen when expanded. Any translateY > 0
     pushes the sheet's bottom below the viewport, which is fine collapsed/mid-drag but was
     cutting off the end of the list when it applied to the expanded rest state. */
  /* NO CSS transition on transform — it could freeze at t=0 on some loads, leaving the
     92vh sheet invisibly covering the whole screen and eating every touch meant for the
     map. Snap animation is done in JS (rAF glideTo) instead. */
  transform: translateY(calc(82vh - 230px));
  transition: none !important;
  overflow: hidden !important; touch-action: none;
}

/* Google-style grab bar: a thin strip across the sheet top with a small grey pill.
   Absolute (Mapplic positions the header absolutely too) so nothing can cover it. */
html .mapplic-portrait .mapplic-sidebar .mv-sheet-handle {
  position: absolute !important; top: 0 !important; left: 0 !important; right: 0 !important;
  height: 26px !important; z-index: 6 !important; /* full-width tap/drag zone; pill sits near the
     top. The JS also treats a tap in the top strip of the sheet as a toggle, so the hittable
     area is generous without leaving a big blank gap above the search. */
  display: flex !important; align-items: flex-start !important; justify-content: center !important;
  background: transparent; cursor: grab; touch-action: none; padding: 9px 0 0 0 !important; margin: 0 !important;
}
html .mapplic-portrait .mapplic-sidebar .mv-sheet-handle::before {
  content: ""; width: 36px; height: 4px; border-radius: 999px; background: #c9c9d0;
}

/* Content flush to the sheet edges: Mapplic insets header/list/dim 12px and gives the list
   its own bg+shadow (the visible "inner box") — kill all of that, shift below the grab bar. */
/* The sheet header has only 2px top padding (desktop has 16px), so the search magnifier
   (margin-top:32px) and the filter/search toggle (top:24px) sat LOWER than the search
   text. Re-centre both on the 48px input line (text centre ≈ 26px from header top). */
html .mapplic-portrait .mapplic-sidebar .mapplic-sidebar-header > .mapplic-icon { margin-top: 16px !important; }
html .mapplic-portrait .mapplic-sidebar .mapplic-search-toggle { top: 9px !important; }
html .mapplic-portrait .mapplic-sidebar .mapplic-search-clear { top: 20px !important; }

html .mapplic-portrait .mapplic-sidebar .mapplic-sidebar-header {
  top: 26px !important; left: 0 !important; right: 0 !important;
  padding: 2px 20px 12px !important; /* kill the default 16px top padding — that + the handle was
     the "far too much blank space above search". Search now hugs the grab bar. */
  box-shadow: none !important; touch-action: none;
}
html .mapplic-portrait .mapplic-sidebar .mapplic-list-container {
  top: 92px !important; bottom: 0 !important; left: 0 !important; right: 0 !important;
  background: #fff !important; box-shadow: none !important;
  overflow-y: auto !important; touch-action: pan-y !important; -webkit-overflow-scrolling: touch;
}
html .mapplic-portrait .mapplic-sidebar.mapplic-sidebar-tagsrow .mapplic-list-container { top: 122px !important; }
html .mapplic-portrait .mapplic-sidebar .mapplic-sidebar-dim {
  top: 26px !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
}

/* NOTE: deliberately NO `touch-action` on the map container. The validated-working baseline
   didn't set it — Mapplic's own touch handlers call e.preventDefault() (non-passive), which is
   what routes pan/pinch to the map. `touch-action: none` here (plus the old user-scalable=no)
   is what broke two-finger pinch on iOS. Keep only pull-to-refresh suppression. */
html .mapplic-portrait .mapplic-container { overscroll-behavior: none; }

/* Keep the floor switcher clear of the iOS status bar / dynamic island (viewport-fit=cover lets
   content sit under the notch), and BELOW the bottom sheet (z-index) so it's covered when the
   sheet is expanded and only visible over the map when the sheet is collapsed. */
html .mapplic-portrait .mapplic-level-switcher { top: env(safe-area-inset-top, 0px) !important; z-index: 1 !important; }
/* Bigger floor buttons on mobile — the default ~28px is smaller than a fingertip (was 2x, -20%). */
html .mapplic-portrait .mapplic-level-switcher button {
  font-size: 18px !important; line-height: 32px !important; padding: 6px 16px !important;
}

/* No text-selection caret/highlight anywhere on the sheet except real form fields — clicking
   beside the search icon was showing a caret in a non-typable zone. */
html .mapplic-portrait .mapplic-sidebar { -webkit-user-select: none !important; user-select: none !important; }
html .mapplic-portrait .mapplic-sidebar input,
html .mapplic-portrait .mapplic-sidebar textarea,
html .mapplic-portrait .mapplic-sidebar [contenteditable] {
  -webkit-user-select: text !important; user-select: text !important;
}

/* Categories popup (.mapplic-filter, lives INSIDE the header): scrollable on its own —
   touch-action is per touched element, so pan-y here wins over the header's none. When the
   popup is open, let the header use the whole sheet so the full category list is reachable. */
html .mapplic-portrait .mapplic-sidebar .mapplic-filter {
  overflow-y: auto !important; touch-action: pan-y !important; -webkit-overflow-scrolling: touch;
}
html .mapplic-portrait .mapplic-sidebar.mapplic-sidebar-header-opened.mapplic-sidebar-filterable .mapplic-sidebar-header {
  max-height: calc(100% - 26px) !important;
}
/* While the categories panel is open, fully cover the directory list below it with white
   (Mapplic's dim is a 10% black overlay — the list was peeking through beneath the panel). */
html .mapplic-portrait .mapplic-sidebar.mapplic-sidebar-header-opened.mapplic-sidebar-filterable .mapplic-sidebar-dim {
  background-color: #fff !important; opacity: 1 !important;
}