/* /map?catalog_embed=1 — Layers button + panel top-right; no side tools. */

html.ask-catalog-embed,
html.ask-catalog-embed body {
  overflow: hidden;
}

/* No Map/Earth chrome above Layers — pin button and flyout to the iframe corner. */
html.ask-catalog-embed {
  --ask-map-right-rail-tools-top: calc(
    var(--ask-map-top-chrome-top, 12px) + env(safe-area-inset-top, 0px)
  );
  --ask-map-flyout-top: var(--ask-map-right-rail-tools-top);
  /* Fixed ASK width — never stretch when Layers opens. */
  --ask-catalog-ask-width: 480px;
  /*
   * Always reserve space for the open Layers card + zoom rail.
   * ASK is centered in that permanent free strip — left of the full-map
   * center when Layers is closed, and unchanged when Layers opens (no jump).
   */
  --ask-catalog-layers-panel-reserve: calc(
    var(--ask-map-right-rail-inset, 12px) + env(safe-area-inset-right, 0px)
      + min(360px, calc(100vw - 120px)) + 56px
  );
}

html.ask-catalog-embed #askMapModeRail {
  position: fixed;
  top: var(--ask-map-right-rail-tools-top);
  right: calc(var(--ask-map-right-rail-inset, 12px) + env(safe-area-inset-right, 0px));
  z-index: 6200;
}

/*
 * ASK search: fixed width + fixed position (same open/closed Layers).
 * Center of free strip = left of map center, not flush to the left edge.
 */
html.ask-catalog-embed #askMapAgent {
  display: flex !important;
  position: fixed;
  z-index: 6300;
  top: calc(var(--ask-map-top-chrome-top, 12px) + env(safe-area-inset-top, 0px));
  left: calc((100vw - var(--ask-catalog-layers-panel-reserve)) / 2);
  right: auto;
  transform: translateX(-50%);
  width: min(
    var(--ask-catalog-ask-width),
    calc(100vw - var(--ask-catalog-layers-panel-reserve) - 24px)
  );
  max-width: min(
    var(--ask-catalog-ask-width),
    calc(100vw - var(--ask-catalog-layers-panel-reserve) - 24px)
  );
  margin: 0;
  pointer-events: none;
}

html.ask-catalog-embed #askMapAgent .ask-map-agent__form {
  width: 100%;
  box-sizing: border-box;
}

html.ask-catalog-embed #askMapAgent .ask-map-agent__form,
html.ask-catalog-embed #askMapAgent .ask-map-agent__row,
html.ask-catalog-embed #askMapAgent .ask-map-agent__send,
html.ask-catalog-embed #askMapAgent .ask-map-agent__status-row,
html.ask-catalog-embed #askMapAgent .ask-map-agent__layers,
html.ask-catalog-embed #askMapAgent.is-open .ask-map-agent__sheet {
  pointer-events: auto;
}

html.ask-catalog-embed #askMapAgent .ask-map-agent__commands {
  display: none !important;
}

@media (max-width: 768px) {
  html.ask-catalog-embed {
    --ask-catalog-ask-width: 400px;
    /* Narrow iframe: reserve only the Layers button so ASK stays usable. */
    --ask-catalog-layers-panel-reserve: calc(
      8px + 36px + 8px + env(safe-area-inset-right, 0px)
    );
  }
}

html.ask-catalog-embed #ask-map-ticker,
html.ask-catalog-embed #askMapTickerToggle,
html.ask-catalog-embed #ask-map-catalogs,
html.ask-catalog-embed #askbase-mode-seg,
html.ask-catalog-embed #askbaseTopSearch,
html.ask-catalog-embed #top-search-btn,
html.ask-catalog-embed #top-search-flyout,
html.ask-catalog-embed #askbase-userpoints-btn,
html.ask-catalog-embed #panel-open-btn,
html.ask-catalog-embed #askbase-panel,
html.ask-catalog-embed #ask-field-object-wrap,
html.ask-catalog-embed #ask-field-object-btn,
html.ask-catalog-embed #askbase-radar-btn,
html.ask-catalog-embed #askbase-expansion-btn,
html.ask-catalog-embed #askbase-clusters-btn,
html.ask-catalog-embed #askbase-urban-btn,
html.ask-catalog-embed #askbase-zoom-control:not(.askbase-zoom-control--layers),
html.ask-catalog-embed #ask-cabinet-root,
html.ask-catalog-embed #ask-profile-root,
html.ask-catalog-embed #expansion-panel-view,
html.ask-catalog-embed #urban-panel-view,
html.ask-catalog-embed #radar-panel-view,
html.ask-catalog-embed #clusters-panel-view,
html.ask-catalog-embed .ask-map-ticker,
html.ask-catalog-embed .ask-map-ticker-toggle,
html.ask-catalog-embed .ask-map-catalogs,
html.ask-catalog-embed .askbase-geo-stack-wrap,
html.ask-catalog-embed .askbase-radar-clusters-block,
html.ask-catalog-embed .leaflet-control-container .askbase-radar-clusters-block {
  display: none !important;
}

html.ask-catalog-embed #askMapModeMenu .ask-map-layers-menu__section:has(#askbase-locate-modes),
html.ask-catalog-embed #askMapModeMenu .ask-map-layers-menu__section:has(#askMapLayersRetail) {
  display: none !important;
}

/* Boundaries moved to unified #askMapLayersBoundaries / Межі filter panel.
   Hide the old Overlays list (was renamed to «Межі» here) so the empty
html.ask-catalog-embed #askMapModeMenu .ask-map-layers-menu__section:has(#askMapLayersList) {
  display: none !important;
}

html.ask-catalog-embed .ask-map-layers-switcher.is-open .ask-map-layers-menu .ask-map-mode-option[data-map-mode="google"],
html.ask-catalog-embed .ask-map-layers-switcher .ask-map-layers-menu .ask-map-mode-option[data-map-mode="google"],
html.ask-catalog-embed .ask-map-layers-switcher.is-open .ask-map-layers-menu .ask-map-mode-option[data-map-mode="gearth"],
html.ask-catalog-embed .ask-map-layers-switcher .ask-map-layers-menu .ask-map-mode-option[data-map-mode="gearth"] {
  display: none !important;
}

html.ask-catalog-embed .ask-map-layers-switcher .ask-map-layers-menu__view {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

html.ask-catalog-embed .ask-map-layers-switcher .ask-map-layers-menu__view .ask-map-mode-option {
  grid-column: auto / span 1 !important;
}

/* Closed until the user opens Layers — ignore HTML is-open on first paint. */
html.ask-catalog-embed #askMapModeMenu {
  display: none !important;
}
html.ask-catalog-embed.ask-catalog-layers-open #askMapModeMenu {
  display: flex !important;
  /* Compact card; zoom rail still gets a usable slider height. */
  min-height: 0 !important;
  height: auto !important;
  max-height: calc(100dvh - 28px) !important;
  width: min(300px, calc(100vw - 56px)) !important;
  min-width: 260px !important;
  max-width: min(300px, calc(100vw - 56px)) !important;
}

html.ask-catalog-embed.ask-catalog-layers-open #askMapModeMenu .ask-map-layers-menu__main {
  flex: 0 1 auto;
  min-height: 0;
}

html.ask-catalog-embed.ask-catalog-layers-open #askMapModeMenu .ask-map-layers-menu__zoom {
  top: 8px;
  bottom: 8px;
}

html.ask-catalog-embed.ask-catalog-layers-open
  #askbase-zoom-control.askbase-zoom-control--layers
  .askbase-zoom-slider-wrap {
  min-height: 96px !important;
}

/* Mobile catalog embed: same as map — no Layers zoom rail. */
@media (max-width: 768px) {
  html.ask-catalog-embed.ask-catalog-layers-open #askMapModeMenu .ask-map-layers-menu__zoom,
  html.ask-catalog-embed #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;
  }

  /*
   * Match /map mobile Layers: full horizontal inset (not the desktop 300px card).
   * Same left/right as body.ask-public-slim-map @ 768px.
   */
  html.ask-catalog-embed.ask-catalog-layers-open #askMapModeMenu,
  html.ask-catalog-embed.ask-catalog-layers-open .ask-map-layers-switcher .ask-map-layers-menu {
    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;
    box-sizing: border-box !important;
    padding: 8px !important;
  }

  html.ask-catalog-embed.ask-catalog-layers-open #askMapModeMenu .ask-map-layers-menu__main,
  html.ask-catalog-embed.ask-catalog-layers-open #askMapModeMenu .ask-map-layers-menu__section,
  html.ask-catalog-embed.ask-catalog-layers-open #askMapModeMenu .ask-map-layers-menu__view,
  html.ask-catalog-embed.ask-catalog-layers-open #askMapModeMenu .ask-map-layers-menu__cadastral,
  html.ask-catalog-embed.ask-catalog-layers-open #askMapModeMenu .ask-map-layers-menu__locate {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }
}

/* Category legend + area dual-slider inside catalog map iframe */
html.ask-catalog-embed #askCadastralColorLegend {
  z-index: 6400;
  max-height: min(72dvh, calc(100dvh - 72px));
}

html.ask-catalog-embed #askCadastralColorLegend .ask-cadastral-area-filter {
  flex: 0 0 auto;
}

@media (max-width: 768px) {
  html.ask-catalog-embed #askCadastralColorLegend {
    max-height: min(58dvh, calc(100dvh - 96px));
  }
}