/* Andaz R1.5-D3 Mobile Map UX, presentation only. */
/* Loaded after the existing public map and listings styles. */
@media (max-width: 1023px) {
  /* The selection component now opens at detent=peek on touch/mobile layouts.
   * Preserve the user's existing tap and swipe controls for expanding the sheet. */
  html[data-mh-shell="public"] [data-testid="market-map"]
  .mw-public-panel[data-detent="peek"] {
    height: min(150px, calc(100% - 18px)) !important;
    max-height: calc(100% - 18px) !important;
    overflow: hidden !important;
  }
  html[data-mh-shell="public"] [data-testid="market-map"]
  .mw-public-panel[data-detent="half"] {
    height: 43% !important;
    max-height: calc(100% - 54px - env(safe-area-inset-top, 0px)) !important;
  }
  html[data-mh-shell="public"] [data-testid="market-map"]
  .mw-public-panel[data-detent="peek"] .mw-public-panel-body {
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
  }
  html[data-mh-shell="public"] [data-testid="market-map"]
  .mw-public-panel-header {
    max-width: 100% !important;
  }
  html[data-mh-shell="public"] [data-testid="market-map"]
  .mw-public-heading {
    min-width: 0;
  }
  html[data-mh-shell="public"] [data-testid="market-map"]
  .mw-public-panel-body {
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch;
  }
  /* Keep listing popups within the map viewport and independently scrollable.
   * The MapLibre 2-finger screen is prevented in JS on coarse-pointer devices. */
  .lx-map .maplibregl-popup {
    max-width: calc(100vw - 38px) !important;
    z-index: 12;
  }
  .lx-map .maplibregl-popup-content {
    max-height: min(36dvh, 270px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: 12px 11px 10px;
  }
  .lx-map .lx-map-preview {
    min-width: 0 !important;
    max-width: 100%;
  }
  .lx-map .lx-preview-card img {
    width: 66px;
    height: 48px;
    object-fit: cover;
  }
  .lx-map .maplibregl-popup-close-button {
    min-width: 35px;
    min-height: 35px;
  }
}
@media (max-width: 599px) {
  /* A second results count is available below the map: avoid a tall map toolbar. */
  .lx-toolbar > .lx-result-count {
    display: none !important;
  }
  .lx-toolbar {
    gap: 6px;
    padding-block: 6px 8px;
  }
}
@media (max-width: 1023px) and (orientation: landscape) and (max-height: 550px) {
  html[data-mh-shell="public"] [data-testid="market-map"]
  .mw-public-panel[data-detent="peek"] {
    height: min(132px, calc(100% - 16px)) !important;
  }
  html[data-mh-shell="public"] [data-testid="market-map"]
  .mw-public-panel[data-detent="half"] {
    height: 46% !important;
  }
  html[data-mh-shell="public"] [data-testid="market-map"]
  .mw-public-panel[data-detent="peek"] .mw-public-heading h2 {
    -webkit-line-clamp: 1 !important;
  }
  .lx-map .maplibregl-popup-content {
    max-height: min(45dvh, 205px) !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  html[data-mh-shell="public"] [data-testid="market-map"] .mw-public-panel {
    scroll-behavior: auto !important;
  }
}