/* Four fixed controls/result rows. The results, not the page, own scrolling. */
html body main.app-shell section.map-stage.map-focus #pinSearchPanel.open {
  grid-template-rows: auto auto auto minmax(0, 1fr) !important;
  max-height: calc(var(--mymappi-visible-height, 100dvh) - 130px - env(safe-area-inset-top, 0px)) !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

html body main.app-shell section.map-stage.map-focus #pinSearchPanel #pinSearchResults {
  min-height: 0 !important;
  max-height: none !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  scroll-padding-block: 8px;
}

/* iPad landscape has very little room above its keyboard. Bring search into
   that visible area and condense context, while keeping the scope selectable. */
html body.keyboard-open main.app-shell section.map-stage.map-focus #pinSearchPanel.open {
  top: calc(var(--mymappi-visual-offset-top, 0px) + env(safe-area-inset-top, 0px) + 8px) !important;
  bottom: auto !important;
  max-height: calc(var(--mymappi-visible-height, 100dvh) - env(safe-area-inset-top, 0px) - 16px) !important;
  padding: 12px !important;
  gap: 8px !important;
  transform: none !important;
}

html body.keyboard-open #pinSearchPanel .pin-search-heading-copy > span,
html body.keyboard-open #pinSearchPanel .pin-search-chapter-copy > small {
  display: none !important;
}

html body.keyboard-open #pinSearchPanel .pin-search-chapter-filter {
  min-height: 44px !important;
  padding: 4px 10px !important;
}

html body.keyboard-open #pinSearchPanel .map-chapter-selector select {
  min-height: 44px !important;
  height: 44px !important;
  padding-block: 4px !important;
}

html body #pinSearchPanel .pin-search-address-unmatched {
  color: #e9fff8;
  background: rgba(9, 47, 57, 0.72);
  border: 1px solid rgba(155, 231, 218, 0.3);
}

/* Matching secondary actions, with private memory creation the clear primary. */
html body main.app-shell section.map-stage.map-focus .search-destination-popup .our-map-request-search-action {
  min-height: 44px !important;
  padding: 10px 14px !important;
  white-space: normal !important;
}

html body main.app-shell section.map-stage.map-focus .search-destination-popup .search-request-review-note {
  margin: 6px 2px 10px !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}

html body main.app-shell section.map-stage.map-focus .search-destination-popup .popup-edit,
html body main.app-shell section.map-stage.map-focus.our-map-mode .maplibregl-popup.mymappi-our-map-popup-shell .our-map-popup.search-destination-popup .popup-edit {
  width: 100% !important;
  min-height: 48px !important;
  margin-top: 12px !important;
  padding: 12px 16px !important;
  color: #fff !important;
  background: linear-gradient(110deg, #073d54, #087f72) !important;
  border: 1px solid #149c8d !important;
  border-radius: 14px !important;
  font-weight: 800 !important;
  white-space: normal !important;
}

/* Contain the chapter-selector chevron inside its own control. */
html body main.app-shell section.map-stage #pinSearchPanel .map-chapter-selector {
  position: relative !important;
}

html body .map-surface-recovery {
  position: absolute;
  inset: 45% auto auto 50%;
  transform: translate(-50%, -50%);
  /* Pins have dynamic 1000+ priorities. Recovery is inside the map's own
     stacking context, below app navigation but above every interactive pin. */
  z-index: 2147483646;
  display: grid;
  gap: 8px;
  width: min(320px, 80%);
  padding: 18px;
  border: 1px solid rgba(176, 226, 225, .35);
  border-radius: 20px;
  color: #f4fbff;
  background: #00243f;
  box-shadow: 0 12px 32px #00192b30;
  font: 600 14px/1.4 system-ui, sans-serif;
  text-align: center;
}

html body .map-surface-recovery button {
  min-height: 44px;
  border: 0;
  border-radius: 12px;
  color: #00243f;
  background: #84decd;
  font: inherit;
  cursor: pointer;
}

html body .map-surface-recovery button:disabled { opacity: .6; cursor: wait; }
html body .map-surface-recovery button:focus-visible { outline: 2px solid #f4fbff; outline-offset: 3px; }
html body .map-surface-recovery span { color: #c8dce7; }

/* An opaque underpaint keeps essential navigation legible even if WebKit's
   gradient/backdrop compositing drops a frame. Preserve the existing gradients. */
html body main.app-shell section.map-stage header.topbar > .brand,
html body main.app-shell section.map-stage header.topbar > .topbar-left,
html body main.app-shell section.map-stage header.topbar > .topbar-actions,
html body main.app-shell section.map-stage nav.bottom-nav {
  background-color: #073843 !important;
}
