/* Public slim map chrome — top-center glass search; Layers top-right.
   Scoped to body.ask-public-slim-map only. */

body.ask-public-slim-map {
  --ask-map-top-chrome-top: 12px;
  --ask-map-right-rail-inset: 12px;
  --ask-map-right-rail-width: 36px;
  --ask-map-right-rail-gap: 8px;
  /* Beat full-product offset that reserves room for mode-seg / cabinet. */
  --ask-mode-seg-width: 0px;
  --ask-slim-rail-right: calc(
    var(--ask-map-right-rail-inset) + env(safe-area-inset-right, 0px)
  );
  --ask-map-top-chrome-right: var(--ask-slim-rail-right);
  /* Layers at top-right (search is centered, no loupe row above). */
  --ask-map-right-rail-tools-top: calc(
    var(--ask-map-top-chrome-top) + env(safe-area-inset-top, 0px)
  );
  --ask-map-flyout-top: var(--ask-map-right-rail-tools-top);
  --ask-slim-layers-pad-y: 12px;
  --ask-slim-layers-pad-x: 12px;
  --ask-slim-layers-pad-right: 46px;
  --ask-slim-layers-gap: 10px;
  --ask-slim-pill-min-height: 34px;
}

/* ===== Glass search: top-center ===== */
body.ask-public-slim-map #askMapAgent,
body.ask-public-slim-map.ask-app-mode-map #askMapAgent {
  position: fixed !important;
  top: calc(
    var(--ask-map-top-chrome-top) + env(safe-area-inset-top, 0px)
  ) !important;
  /* Centered until the right edge would meet the open Layers panel. */
  left: max(12px, calc(50vw - 320px)) !important;
  right: calc(
    12px
    + env(safe-area-inset-right, 0px)
    + var(--ask-map-right-rail-width, 36px)
    + var(--ask-map-right-rail-gap, 8px)
    + 316px
    + 86px
  ) !important;
  bottom: auto !important;
  transform: none !important;
  width: auto !important;
  max-width: 640px !important;
  z-index: 9400 !important;
  pointer-events: none !important;
}

body.ask-public-slim-map #askMapAgent.is-open {
  z-index: 100000 !important;
}

body.ask-public-slim-map #askMapAgent .ask-map-agent__form,
body.ask-public-slim-map #askMapAgent .ask-map-agent__row,
body.ask-public-slim-map #askMapAgent .ask-map-agent__send,
body.ask-public-slim-map #askMapAgent .ask-map-agent__status-row,
body.ask-public-slim-map #askMapAgent .ask-map-agent__layers,
body.ask-public-slim-map #askMapAgent .ask-map-agent__layer,
body.ask-public-slim-map #askMapAgent .ask-map-agent__layer-x,
body.ask-public-slim-map #askMapAgent .ask-map-agent__history-item,
body.ask-public-slim-map #askMapAgent .ask-map-agent__history-clear,
body.ask-public-slim-map #askMapAgent .ask-map-agent__results-clear,
body.ask-public-slim-map #askMapAgent.is-open .ask-map-agent__sheet {
  pointer-events: auto !important;
}

body.ask-public-slim-map #askMapModeRail,
body.ask-public-slim-map .ask-map-mode-rail {
  position: fixed !important;
  top: var(--ask-map-right-rail-tools-top) !important;
  bottom: auto !important;
  right: var(--ask-slim-rail-right) !important;
  left: auto !important;
  z-index: 9200 !important;
}

/* Hide leftover account / profile / empty right panel chrome. */
body.ask-public-slim-map #askbase-account-top-btn,
body.ask-public-slim-map .askbase-account-top-btn,
body.ask-public-slim-map #askbase-mode-seg,
body.ask-public-slim-map .ask-mode-seg,
body.ask-public-slim-map #askbase-userpoints-btn,
body.ask-public-slim-map .askbase-right-panel {
  display: none !important;
}

/* ===== Layers: content-height only (no empty void) ===== */

body.ask-public-slim-map .ask-map-layers-switcher.is-open .ask-map-layers-menu,
body.ask-public-slim-map .ask-map-layers-switcher .ask-map-layers-menu {
  top: var(--ask-map-flyout-top) !important;
  padding: var(--ask-slim-layers-pad-y) var(--ask-slim-layers-pad-right)
    var(--ask-slim-layers-pad-y) var(--ask-slim-layers-pad-x) !important;
  gap: var(--ask-slim-layers-gap) !important;
  min-height: 0 !important;
  height: auto !important;
}

body.ask-public-slim-map .ask-map-layers-menu__main {
  gap: var(--ask-slim-layers-gap) !important;
  flex: 0 0 auto !important;
}

body.ask-public-slim-map .ask-map-layers-menu__header,
body.ask-public-slim-map .ask-map-layers-menu__section {
  gap: 8px !important;
}

/* Desktop: no drag handle — panel is not a bottom sheet. */
body.ask-public-slim-map .ask-map-layers-menu__handle {
  display: none;
}

body.ask-public-slim-map .ask-map-layers-menu__header {
  min-height: 32px !important;
}

body.ask-public-slim-map .ask-map-layers-menu .ask-map-region-picker--in-layers .ask-map-region-picker__trigger {
  height: 32px !important;
  min-height: 32px !important;
  font-size: 15px !important;
}

body.ask-public-slim-map .ask-map-layers-menu__header-actions {
  gap: 8px !important;
  align-items: center !important;
}

/* 3D = pill with label; compass in view-row = 78px circle (match full product). */
body.ask-public-slim-map .ask-map-layers-menu__buildings {
  width: auto !important;
  min-width: 0 !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 10px !important;
  border-radius: 8px !important;
  box-sizing: border-box !important;
}

/* Do NOT shrink view-row compass to the old 32px rail chip — SVG is 64/66. */
body.ask-public-slim-map .ask-map-layers-menu__view-row .ask-map-layers-menu__compass {
  flex: 0 0 78px !important;
  width: 78px !important;
  min-width: 78px !important;
  height: 78px !important;
  min-height: 78px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  box-sizing: border-box !important;
}

body.ask-public-slim-map .ask-map-layers-menu__view-row .ask-map-layers-menu__compass .askbase-compass-icon,
body.ask-public-slim-map .ask-map-layers-menu__view-row .ask-map-layers-menu__compass svg {
  width: 66px !important;
  height: 66px !important;
}

body.ask-public-slim-map .ask-map-layers-menu__label {
  margin-bottom: 2px !important;
  font-size: 12px !important;
}

body.ask-public-slim-map .ask-map-layers-menu__view,
body.ask-public-slim-map .ask-map-layers-menu__cadastral,
body.ask-public-slim-map .ask-map-layers-menu__locate,
body.ask-public-slim-map .ask-map-layers-menu__list {
  gap: 8px !important;
}

/* Slim Overlays: ОТГ only (no Roads/Retail/…). */
body.ask-public-slim-map #askMapLayersList {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
}

body.ask-public-slim-map .ask-map-layers-menu .ask-map-mode-option,
body.ask-public-slim-map .ask-map-layers-menu__cadastral .askbase-pill,
body.ask-public-slim-map .ask-map-layers-menu .askbase-locate-mode {
  min-height: var(--ask-slim-pill-min-height) !important;
  padding-top: 7px !important;
  padding-bottom: 7px !important;
}

body.ask-public-slim-map .ask-map-layers-menu__zoom {
  top: var(--ask-slim-layers-pad-y) !important;
  bottom: var(--ask-slim-layers-pad-y) !important;
}

/* Filter panels (Кадастр / Межі / Жителі) are docked by place* JS next to Layers.
   Do not vertically center — that fought left/top placement and caused overlaps. */
body.ask-public-slim-map .ask-cadastral-legend {
  bottom: auto !important;
  right: auto !important;
  transform: none !important;
  height: auto !important;
  max-height: min(86dvh, calc(100dvh - 24px)) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

body.ask-public-slim-map .ask-cadastral-legend__rows {
  flex: 0 0 auto !important;
  justify-content: flex-start !important;
  gap: 6px !important;
  overflow: visible !important;
}

body.ask-public-slim-map .ask-cadastral-legend__title {
  flex: 0 0 auto !important;
  margin: 0 0 8px !important;
  padding-right: 28px !important;
  white-space: normal !important;
}

@media (max-width: 768px) {
  /* Mobile chrome: compact search + Layers + attrib (still thumb-friendly). */
  body.ask-public-slim-map {
    --ask-map-top-chrome-top: 8px;
    --ask-map-right-rail-inset: 8px;
    --ask-map-right-rail-width: 36px;
    --ask-map-right-rail-gap: 6px;
    --ask-slim-pill-min-height: 34px;
    /* Slim has no bottom mode-rail / phototag — pin attrib to the bottom edge. */
    --ask-map-attrib-bottom: calc(
      10px + env(safe-area-inset-bottom, 0px)
    );
    /* No zoom rail on mobile Layers — match left pad (was 40px gutter). */
    --ask-slim-layers-pad-right: 8px;
  }

  /* Search sits left of the Layers button — full-bleed center overlaps the rail. */
  body.ask-public-slim-map #askMapAgent,
  body.ask-public-slim-map.ask-app-mode-map #askMapAgent {
    left: calc(8px + env(safe-area-inset-left, 0px)) !important;
    right: calc(
      12px
      + env(safe-area-inset-right, 0px)
      + var(--ask-map-right-rail-width, 36px)
      + 8px
    ) !important;
    width: auto !important;
    transform: none !important;
  }

  /* Match Layers FAB outer size (same border-box + 0.5px border as the FAB). */
  body.ask-public-slim-map #askMapAgent .ask-map-agent__form {
    height: var(--ask-map-right-rail-width, 36px) !important;
    min-height: var(--ask-map-right-rail-width, 36px) !important;
    max-height: var(--ask-map-right-rail-width, 36px) !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    border: 0.5px solid var(--ask-map-btn-glass-border) !important;
    border-radius: 10px !important;
  }

  body.ask-public-slim-map #askMapAgent .ask-map-agent__row {
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    align-items: center !important;
  }

  body.ask-public-slim-map #askMapAgent .ask-map-agent__input {
    height: 100% !important;
    min-height: 0 !important;
    font-size: 12.5px !important;
  }

  body.ask-public-slim-map #askMapAgent .ask-map-agent__mark {
    width: 30px !important;
    min-width: 30px !important;
    height: 30px !important;
  }

  body.ask-public-slim-map #askMapAgent .ask-map-agent__send {
    width: var(--ask-map-right-rail-width, 36px) !important;
    min-width: var(--ask-map-right-rail-width, 36px) !important;
    height: var(--ask-map-right-rail-width, 36px) !important;
    min-height: var(--ask-map-right-rail-width, 36px) !important;
  }

  /* Status must not look like a second input field. */
  body.ask-public-slim-map #askMapAgent .ask-map-agent__status-row {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 2px 10px 0 !important;
    padding: 0 2px !important;
    border: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  body.ask-public-slim-map
    #askMapAgent
    .ask-map-agent__status-row:not(:has(.ask-map-agent__results-clear:not([hidden]))):has(
      #askMapAgentStatus:empty
    ) {
    display: none !important;
  }

  body.ask-public-slim-map #askMapAgent .ask-map-agent__status {
    line-height: 1.35 !important;
    padding: 4px 0 !important;
    font-size: 12px !important;
    font-weight: 500 !important;
  }

  body.ask-public-slim-map #ask-map-attrib.ask-map-compact-attrib {
    bottom: var(--ask-map-attrib-bottom) !important;
    right: calc(
      var(--ask-map-right-rail-inset, 10px)
      + env(safe-area-inset-right, 0px)
    ) !important;
    opacity: 0.72 !important;
    transform: none !important;
    max-width: min(
      calc(
        100vw
        - 24px
        - env(safe-area-inset-left, 0px)
        - env(safe-area-inset-right, 0px)
        - var(--ask-map-right-rail-width, 36px)
        - 56px
      ),
      520px
    ) !important;
  }

  body.ask-public-slim-map #ask-map-attrib .ask-map-compact-attrib__toggle {
    flex: 0 0 32px !important;
    width: 32px !important;
    height: 32px !important;
    background-size: 20px 20px !important;
  }

  body.ask-public-slim-map .ask-map-catalogs > .ask-map-mode-current,
  body.ask-public-slim-map #ask-map-mode-switcher > .ask-map-mode-current {
    box-sizing: border-box !important;
    width: var(--ask-map-right-rail-width, 36px) !important;
    min-width: var(--ask-map-right-rail-width, 36px) !important;
    height: var(--ask-map-right-rail-width, 36px) !important;
    min-height: var(--ask-map-right-rail-width, 36px) !important;
    padding: 0 !important;
    /* Same glass as #askMapAgent search form (not denser radar/panel fill). */
    background: var(--ask-map-btn-glass-bg) !important;
    border: 0.5px solid var(--ask-map-btn-glass-border) !important;
    box-shadow: var(--ask-map-btn-glass-shadow) !important;
    backdrop-filter: var(--ask-map-btn-glass-blur) !important;
    -webkit-backdrop-filter: var(--ask-map-btn-glass-blur) !important;
    color: var(--ask-map-chrome-text, rgba(15, 23, 42, 0.82)) !important;
    opacity: var(--ask-map-btn-icon-opacity, 0.92) !important;
  }

  body.ask-public-slim-map .ask-map-catalogs > .ask-map-mode-current::before,
  body.ask-public-slim-map #ask-map-mode-switcher > .ask-map-mode-current::before {
    display: none !important;
  }

  body.ask-public-slim-map .ask-map-catalogs > .ask-map-mode-current:hover,
  body.ask-public-slim-map .ask-map-catalogs > .ask-map-mode-current.is-open,
  body.ask-public-slim-map #ask-map-mode-switcher > .ask-map-mode-current:hover,
  body.ask-public-slim-map #ask-map-mode-switcher > .ask-map-mode-current.is-open {
    background: var(--ask-map-btn-glass-bg-hover) !important;
    backdrop-filter: var(--ask-map-btn-glass-blur-hover) !important;
    -webkit-backdrop-filter: var(--ask-map-btn-glass-blur-hover) !important;
    border-color: var(--ask-map-btn-glass-border) !important;
    box-shadow: var(--ask-map-btn-glass-shadow) !important;
    color: var(--ask-map-chrome-text-strong, rgba(15, 23, 42, 0.94)) !important;
    opacity: var(--ask-map-btn-icon-opacity-hover, 0.98) !important;
  }

  body.ask-public-slim-map #askMapAgent.is-open {
    max-height: min(
      58dvh,
      calc(100dvh - 12px - env(safe-area-inset-bottom, 0px))
    ) !important;
  }

  body.ask-public-slim-map #askMapAgent .ask-map-agent__panel,
  body.ask-public-slim-map #askMapAgent .ask-map-agent__sheet {
    max-height: min(42dvh, calc(100dvh - 128px - env(safe-area-inset-bottom, 0px))) !important;
  }

  body.ask-public-slim-map #askMapAgent .ask-map-agent__sheet {
    padding-bottom: 12px !important;
  }

  /* Category / population filter sheets: shrink agent panel like cadastral. */
  body.ask-public-slim-map:has(#askCadastralColorLegend:not([hidden]))
    #askMapAgent.is-open
    .ask-map-agent__panel,
  body.ask-public-slim-map:has(#askCadastralColorLegend:not([hidden]))
    #askMapAgent.is-open
    .ask-map-agent__sheet,
  body.ask-public-slim-map:has(#askPopulationFilterLegend:not([hidden]))
    #askMapAgent.is-open
    .ask-map-agent__panel,
  body.ask-public-slim-map:has(#askPopulationFilterLegend:not([hidden]))
    #askMapAgent.is-open
    .ask-map-agent__sheet,
  body.ask-public-slim-map:has(#askOtgPopulationLegend:not([hidden]))
    #askMapAgent.is-open
    .ask-map-agent__panel,
  body.ask-public-slim-map:has(#askOtgPopulationLegend:not([hidden]))
    #askMapAgent.is-open
    .ask-map-agent__sheet {
    max-height: min(32dvh, calc(100dvh - 46dvh)) !important;
  }

  /* Full-bleed card under the Layers FAB (FAB stays clickable via higher z-index).
     Zoom keeps a dedicated inner column so the slider never paints over pills. */
  body.ask-public-slim-map .ask-map-layers-switcher.is-open .ask-map-layers-menu,
  body.ask-public-slim-map .ask-map-layers-switcher .ask-map-layers-menu {
    top: calc(
      var(--ask-map-top-chrome-top, 10px)
      + env(safe-area-inset-top, 0px)
      + 52px
    ) !important;
    left: calc(8px + env(safe-area-inset-left, 0px)) !important;
    right: calc(8px + env(safe-area-inset-right, 0px)) !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: calc(
      100dvh
      - var(--ask-map-top-chrome-top, 10px)
      - env(safe-area-inset-top, 0px)
      - 52px
      - 8px
      - env(safe-area-inset-bottom, 0px)
    ) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    padding: 8px !important;
    box-sizing: border-box !important;
    /* Match .ask-cadastral-legend scrollbar (Категорії ділянок). */
    scrollbar-width: thin;
    scrollbar-color: var(--ask-map-scrollbar-thumb, rgba(148, 163, 184, 0.18)) transparent;
  }

  body.ask-public-slim-map .ask-map-layers-switcher .ask-map-layers-menu::-webkit-scrollbar {
    width: 6px;
    height: 6px;
  }

  body.ask-public-slim-map .ask-map-layers-switcher .ask-map-layers-menu::-webkit-scrollbar-track {
    background: transparent;
  }

  body.ask-public-slim-map .ask-map-layers-switcher .ask-map-layers-menu::-webkit-scrollbar-thumb {
    background: var(--ask-map-scrollbar-thumb, rgba(148, 163, 184, 0.18));
    border-radius: 999px;
    border: 2px solid transparent;
    background-clip: padding-box;
  }

  body.ask-public-slim-map .ask-map-layers-switcher .ask-map-layers-menu::-webkit-scrollbar-thumb:hover {
    background: var(--ask-map-scrollbar-thumb-hover, rgba(148, 163, 184, 0.28));
    border: 2px solid transparent;
    background-clip: padding-box;
  }

  /* Region dropdown must not be clipped by the card scroller. */
  body.ask-public-slim-map
    .ask-map-layers-switcher
    .ask-map-layers-menu:has(#askMapRegionPicker.is-open) {
    overflow: visible !important;
  }

  body.ask-public-slim-map .ask-map-layers-menu .ask-map-region-picker--in-layers {
    overflow: visible !important;
  }

  body.ask-public-slim-map
    .ask-map-layers-menu
    .ask-map-region-picker--in-layers
    .ask-map-region-picker__menu {
    z-index: 50 !important;
    width: min(300px, calc(100vw - 48px)) !important;
    max-height: min(52dvh, calc(100dvh - 140px)) !important;
  }

  /* Cabinet-style stick: drag/tap collapses Layers downward. */
  body.ask-public-slim-map .ask-map-layers-menu__handle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    align-self: center !important;
    width: 100% !important;
    height: 28px !important;
    margin: 0 0 2px !important;
    padding: 8px 0 4px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    cursor: pointer !important;
    touch-action: none !important;
    -webkit-tap-highlight-color: transparent !important;
    z-index: 6 !important;
  }

  body.ask-public-slim-map .ask-map-layers-menu__handle-bar {
    display: block !important;
    width: 40px !important;
    height: 4px !important;
    border-radius: 999px !important;
    background: rgba(148, 163, 184, 0.42) !important;
    box-shadow:
      0 1px 0 rgba(255, 255, 255, 0.65) inset,
      0 4px 12px rgba(15, 23, 42, 0.06) !important;
  }

  body.ask-map-mode-earth.ask-public-slim-map .ask-map-layers-menu__handle-bar {
    background: rgba(226, 232, 240, 0.42) !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.12) inset !important;
  }

  /* Zoom column sits inside the glass Layers card — no opaque strip / divider. */
  body.ask-public-slim-map .ask-map-layers-menu__zoom {
    top: 8px !important;
    bottom: 8px !important;
    right: 4px !important;
    left: auto !important;
    width: 40px !important;
    min-width: 40px !important;
    padding: 0 !important;
    border-left: none !important;
    background: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    z-index: 5 !important;
    overflow: hidden !important;
    pointer-events: auto !important;
  }

  body.ask-map-mode-earth.ask-public-slim-map .ask-map-layers-menu__zoom {
    border-left: none !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  /* Zoom rail removed on mobile; keep display:none so no hit-target gutter. */
  body.ask-public-slim-map .ask-map-layers-menu__zoom,
  body.ask-public-slim-map #askMapLayersZoom {
    display: none !important;
    width: 0 !important;
    min-width: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    pointer-events: none !important;
    visibility: hidden !important;
  }

  /* Leave a clear hit target for the Layers FAB over the card corner. */
  body.ask-public-slim-map .ask-map-layers-switcher.is-open .ask-map-layers-menu,
  body.ask-public-slim-map .ask-map-layers-switcher .ask-map-layers-menu {
    padding-top: 8px !important;
  }

  /*
   * Keep Layers visible while Кадастр / Населення filters are open so the same
   * pill can receive a second tap (close). Межі never hid the menu — match that.
   * (Older hide-for-z-index workaround made ON work but OFF impossible.)
   * OTГ population legend (non-Layers pill) may still hide the card.
   */
  body.ask-public-slim-map:has(#askOtgPopulationLegend:not([hidden]))
    .ask-map-layers-switcher
    .ask-map-layers-menu {
    display: none !important;
  }

  body.ask-public-slim-map .ask-map-layers-menu__main {
    flex: 0 0 auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: 100% !important;
    max-height: none !important;
    overflow: visible !important;
    gap: 6px !important;
    box-sizing: border-box !important;
  }

  body.ask-public-slim-map .ask-map-layers-menu .ask-map-region-picker--in-layers {
    min-width: 0 !important;
    flex: 1 1 auto !important;
    overflow: visible !important;
  }

  body.ask-public-slim-map .ask-map-layers-menu .ask-map-region-picker--in-layers .ask-map-region-picker__trigger {
    max-width: 100% !important;
    overflow: hidden !important;
  }

  body.ask-public-slim-map .ask-map-layers-menu .ask-map-region-picker--in-layers .ask-map-region-picker__label {
    display: block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  body.ask-public-slim-map .ask-map-layers-switcher .ask-map-layers-menu__view {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    min-width: 0 !important;
  }

  /* span 2 in a 3-column grid wraps each basemap onto its own row. */
  body.ask-public-slim-map .ask-map-layers-switcher .ask-map-layers-menu__view .ask-map-mode-option {
    grid-column: auto !important;
    min-height: 44px !important;
  }

  /* Full-width basemap row so «Супутник» is not clipped beside the compass. */
  body.ask-public-slim-map .ask-map-layers-menu__view-row {
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 6px !important;
    min-width: 0 !important;
  }

  body.ask-public-slim-map .ask-map-layers-menu__view-row .ask-map-layers-menu__view {
    flex: 1 1 100% !important;
    width: 100% !important;
    min-width: 0 !important;
    order: 1 !important;
  }

  body.ask-public-slim-map .ask-map-layers-menu__view-row .ask-map-layers-menu__compass {
    flex: 0 0 52px !important;
    width: 52px !important;
    min-width: 52px !important;
    height: 52px !important;
    min-height: 52px !important;
    order: 2 !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  body.ask-public-slim-map .ask-map-layers-menu__view-row .ask-map-layers-menu__compass .askbase-compass-icon,
  body.ask-public-slim-map .ask-map-layers-menu__view-row .ask-map-layers-menu__compass svg {
    width: 44px !important;
    height: 44px !important;
  }

  body.ask-public-slim-map
    .ask-map-layers-switcher
    .ask-map-layers-menu__view
    .ask-map-layers-menu__view-text {
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: nowrap !important;
    font-size: 12px !important;
  }

  body.ask-public-slim-map .ask-map-layers-menu__cadastral,
  body.ask-public-slim-map .ask-map-layers-menu__locate,
  body.ask-public-slim-map .ask-map-layers-menu__view,
  body.ask-public-slim-map .ask-map-layers-menu__section {
    min-width: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  body.ask-public-slim-map .ask-map-layers-menu #askbase-locate-modes,
  body.ask-public-slim-map .ask-map-layers-menu__locate {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    width: 100% !important;
    max-width: none !important;
  }

  /*
   * Mobile filter panels stay docked by place* JS (same as desktop LOCAL).
   * Do not force near-fullscreen offsets — that fought Межі / Жителі docking.
   */
  body.ask-public-slim-map .ask-cadastral-legend {
    transform: none !important;
    padding: 10px 12px !important;
    border-radius: 16px !important;
  }

  body.ask-public-slim-map .ask-cadastral-legend__h1 {
    font-size: 14px !important;
  }

  body.ask-public-slim-map .ask-cadastral-legend__seo p {
    font-size: 12px !important;
  }

  body.ask-public-slim-map .ask-cadastral-legend__row {
    min-height: 36px !important;
  }
}

/* ===== Catalogs button (bottom-left; hidden in catalog_embed) ===== */

body.ask-public-slim-map .ask-map-catalogs {
  position: fixed !important;
  left: calc(12px + env(safe-area-inset-left, 0px)) !important;
  bottom: calc(12px + env(safe-area-inset-bottom, 0px)) !important;
  top: auto !important;
  right: auto !important;
  z-index: 6200 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  width: var(--ask-map-right-rail-width, 36px) !important;
  margin: 0 !important;
  overflow: visible !important;
  pointer-events: auto !important;
}

body.ask-public-slim-map .ask-map-catalogs > .ask-map-mode-current {
  box-sizing: border-box !important;
  width: var(--ask-map-right-rail-width, 36px) !important;
  min-width: var(--ask-map-right-rail-width, 36px) !important;
  height: var(--ask-map-right-rail-width, 36px) !important;
  min-height: var(--ask-map-right-rail-width, 36px) !important;
  padding: 0 !important;
  border: 0.5px solid var(--ask-map-btn-glass-border) !important;
  border-radius: 999px !important;
}

body.ask-public-slim-map .ask-map-catalogs .ask-map-catalogs-menu,
body.ask-public-slim-map .ask-map-catalogs.is-open .ask-map-catalogs-menu {
  position: absolute !important;
  left: 0 !important;
  right: auto !important;
  top: auto !important;
  bottom: calc(100% + 8px) !important;
  width: min(280px, calc(100vw - 28px)) !important;
  min-width: 220px !important;
  max-width: min(280px, calc(100vw - 28px)) !important;
  padding: 10px !important;
  gap: 6px !important;
  border-radius: var(--ask-map-surface-radius, 16px) !important;
  background: var(--ask-map-surface-glass-bg) !important;
  border: 0.5px solid var(--ask-map-surface-glass-border) !important;
  box-shadow: var(--ask-map-surface-glass-shadow) !important;
  backdrop-filter: var(--ask-map-surface-glass-blur) !important;
  -webkit-backdrop-filter: var(--ask-map-surface-glass-blur) !important;
  display: flex !important;
  flex-direction: column !important;
  z-index: 6201 !important;
}

body.ask-public-slim-map .ask-map-catalogs .ask-map-catalogs-menu[hidden] {
  display: none !important;
}

body.ask-public-slim-map .ask-map-catalogs .ask-map-layers-menu__list {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 4px !important;
}

body.ask-public-slim-map .ask-map-catalogs .ask-map-layers-menu__list .askbase-pill {
  text-decoration: none !important;
}

html.ask-catalog-embed body.ask-public-slim-map .ask-map-catalogs,
html.ask-catalog-embed body.ask-public-slim-map #askMapAgent {
  display: none !important;
}

@media (max-width: 768px) {
  body.ask-public-slim-map .ask-map-catalogs {
    bottom: calc(12px + env(safe-area-inset-bottom, 0px)) !important;
  }

  /* Hide Catalogs FAB while a filter sheet is open — lift still overlapped the title. */
  body.ask-public-slim-map:has(#askCadastralColorLegend:not([hidden])) .ask-map-catalogs,
  body.ask-public-slim-map:has(#askPopulationFilterLegend:not([hidden])) .ask-map-catalogs,
  body.ask-public-slim-map:has(#askOtgPopulationLegend:not([hidden])) .ask-map-catalogs {
    display: none !important;
  }
}