/*
 * Request-to-book modal layering.
 *
 * Modern browsers use the native HTML top layer (manual Popover API) so Request
 * dialogs cannot be trapped below Astra/Elementor/theme stacking contexts. The
 * modal remains in its original DOM/form; only its painting layer changes.
 * Older browsers retain a scoped CSS stacking fallback.
 */
html.pxab-request-modal-layer-open,
body.pxab-request-modal-layer-open {
  overflow: hidden !important;
}

/*
 * Native top-layer contract. The browser-owned ::backdrop is the one and only
 * Request-page dim/blur surface, matching the villa-page visual treatment.
 */
body.pxab-request-modal-native-top-layer :where(
  .pxab-request-modal,
  .pxab-price-modal,
  .pxab-currency-modal,
  .pxab-modal
).is-pxab-request-modal-layer[data-pxab-request-top-layer="1"]:popover-open {
  position: fixed !important;
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  border: 0 !important;
  box-sizing: border-box !important;
  z-index: 2147483000 !important;
  /* Neutralize the UA Popover canvas. Without this the promoted, viewport-sized
   * modal root can paint solid white and completely hide its own ::backdrop. */
  background: transparent !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  pointer-events: auto !important;
}

body.pxab-request-modal-native-top-layer :where(
  .pxab-request-modal,
  .pxab-price-modal,
  .pxab-currency-modal,
  .pxab-modal
).is-pxab-request-modal-layer[data-pxab-request-top-layer="1"]:popover-open::backdrop {
  background: rgba(15, 23, 42, .28) !important;
  opacity: 1 !important;
  -webkit-backdrop-filter: blur(var(--pxab-accommodation-modal-backdrop-blur, 0px)) !important;
  backdrop-filter: blur(var(--pxab-accommodation-modal-backdrop-blur, 0px)) !important;
}

/*
 * ::backdrop is browser-owned top-layer content and custom-property inheritance
 * is not reliable across engines. JS copies the already-sanitized Request-page
 * 0-16px setting to this bounded attribute so every supported browser receives
 * a literal filter value. The var() rule above remains a harmless fallback.
 */
body.pxab-request-modal-native-top-layer :where(
  .pxab-request-modal,
  .pxab-price-modal,
  .pxab-currency-modal,
  .pxab-modal
).is-pxab-request-modal-layer[data-pxab-request-top-layer="1"][data-pxab-request-backdrop-blur="0"]:popover-open::backdrop {
  -webkit-backdrop-filter: blur(0px) !important;
  backdrop-filter: blur(0px) !important;
}
body.pxab-request-modal-native-top-layer :where(
  .pxab-request-modal,
  .pxab-price-modal,
  .pxab-currency-modal,
  .pxab-modal
).is-pxab-request-modal-layer[data-pxab-request-top-layer="1"][data-pxab-request-backdrop-blur="1"]:popover-open::backdrop {
  -webkit-backdrop-filter: blur(1px) !important;
  backdrop-filter: blur(1px) !important;
}
body.pxab-request-modal-native-top-layer :where(
  .pxab-request-modal,
  .pxab-price-modal,
  .pxab-currency-modal,
  .pxab-modal
).is-pxab-request-modal-layer[data-pxab-request-top-layer="1"][data-pxab-request-backdrop-blur="2"]:popover-open::backdrop {
  -webkit-backdrop-filter: blur(2px) !important;
  backdrop-filter: blur(2px) !important;
}
body.pxab-request-modal-native-top-layer :where(
  .pxab-request-modal,
  .pxab-price-modal,
  .pxab-currency-modal,
  .pxab-modal
).is-pxab-request-modal-layer[data-pxab-request-top-layer="1"][data-pxab-request-backdrop-blur="3"]:popover-open::backdrop {
  -webkit-backdrop-filter: blur(3px) !important;
  backdrop-filter: blur(3px) !important;
}
body.pxab-request-modal-native-top-layer :where(
  .pxab-request-modal,
  .pxab-price-modal,
  .pxab-currency-modal,
  .pxab-modal
).is-pxab-request-modal-layer[data-pxab-request-top-layer="1"][data-pxab-request-backdrop-blur="4"]:popover-open::backdrop {
  -webkit-backdrop-filter: blur(4px) !important;
  backdrop-filter: blur(4px) !important;
}
body.pxab-request-modal-native-top-layer :where(
  .pxab-request-modal,
  .pxab-price-modal,
  .pxab-currency-modal,
  .pxab-modal
).is-pxab-request-modal-layer[data-pxab-request-top-layer="1"][data-pxab-request-backdrop-blur="5"]:popover-open::backdrop {
  -webkit-backdrop-filter: blur(5px) !important;
  backdrop-filter: blur(5px) !important;
}
body.pxab-request-modal-native-top-layer :where(
  .pxab-request-modal,
  .pxab-price-modal,
  .pxab-currency-modal,
  .pxab-modal
).is-pxab-request-modal-layer[data-pxab-request-top-layer="1"][data-pxab-request-backdrop-blur="6"]:popover-open::backdrop {
  -webkit-backdrop-filter: blur(6px) !important;
  backdrop-filter: blur(6px) !important;
}
body.pxab-request-modal-native-top-layer :where(
  .pxab-request-modal,
  .pxab-price-modal,
  .pxab-currency-modal,
  .pxab-modal
).is-pxab-request-modal-layer[data-pxab-request-top-layer="1"][data-pxab-request-backdrop-blur="7"]:popover-open::backdrop {
  -webkit-backdrop-filter: blur(7px) !important;
  backdrop-filter: blur(7px) !important;
}
body.pxab-request-modal-native-top-layer :where(
  .pxab-request-modal,
  .pxab-price-modal,
  .pxab-currency-modal,
  .pxab-modal
).is-pxab-request-modal-layer[data-pxab-request-top-layer="1"][data-pxab-request-backdrop-blur="8"]:popover-open::backdrop {
  -webkit-backdrop-filter: blur(8px) !important;
  backdrop-filter: blur(8px) !important;
}
body.pxab-request-modal-native-top-layer :where(
  .pxab-request-modal,
  .pxab-price-modal,
  .pxab-currency-modal,
  .pxab-modal
).is-pxab-request-modal-layer[data-pxab-request-top-layer="1"][data-pxab-request-backdrop-blur="9"]:popover-open::backdrop {
  -webkit-backdrop-filter: blur(9px) !important;
  backdrop-filter: blur(9px) !important;
}
body.pxab-request-modal-native-top-layer :where(
  .pxab-request-modal,
  .pxab-price-modal,
  .pxab-currency-modal,
  .pxab-modal
).is-pxab-request-modal-layer[data-pxab-request-top-layer="1"][data-pxab-request-backdrop-blur="10"]:popover-open::backdrop {
  -webkit-backdrop-filter: blur(10px) !important;
  backdrop-filter: blur(10px) !important;
}
body.pxab-request-modal-native-top-layer :where(
  .pxab-request-modal,
  .pxab-price-modal,
  .pxab-currency-modal,
  .pxab-modal
).is-pxab-request-modal-layer[data-pxab-request-top-layer="1"][data-pxab-request-backdrop-blur="11"]:popover-open::backdrop {
  -webkit-backdrop-filter: blur(11px) !important;
  backdrop-filter: blur(11px) !important;
}
body.pxab-request-modal-native-top-layer :where(
  .pxab-request-modal,
  .pxab-price-modal,
  .pxab-currency-modal,
  .pxab-modal
).is-pxab-request-modal-layer[data-pxab-request-top-layer="1"][data-pxab-request-backdrop-blur="12"]:popover-open::backdrop {
  -webkit-backdrop-filter: blur(12px) !important;
  backdrop-filter: blur(12px) !important;
}
body.pxab-request-modal-native-top-layer :where(
  .pxab-request-modal,
  .pxab-price-modal,
  .pxab-currency-modal,
  .pxab-modal
).is-pxab-request-modal-layer[data-pxab-request-top-layer="1"][data-pxab-request-backdrop-blur="13"]:popover-open::backdrop {
  -webkit-backdrop-filter: blur(13px) !important;
  backdrop-filter: blur(13px) !important;
}
body.pxab-request-modal-native-top-layer :where(
  .pxab-request-modal,
  .pxab-price-modal,
  .pxab-currency-modal,
  .pxab-modal
).is-pxab-request-modal-layer[data-pxab-request-top-layer="1"][data-pxab-request-backdrop-blur="14"]:popover-open::backdrop {
  -webkit-backdrop-filter: blur(14px) !important;
  backdrop-filter: blur(14px) !important;
}
body.pxab-request-modal-native-top-layer :where(
  .pxab-request-modal,
  .pxab-price-modal,
  .pxab-currency-modal,
  .pxab-modal
).is-pxab-request-modal-layer[data-pxab-request-top-layer="1"][data-pxab-request-backdrop-blur="15"]:popover-open::backdrop {
  -webkit-backdrop-filter: blur(15px) !important;
  backdrop-filter: blur(15px) !important;
}
body.pxab-request-modal-native-top-layer :where(
  .pxab-request-modal,
  .pxab-price-modal,
  .pxab-currency-modal,
  .pxab-modal
).is-pxab-request-modal-layer[data-pxab-request-top-layer="1"][data-pxab-request-backdrop-blur="16"]:popover-open::backdrop {
  -webkit-backdrop-filter: blur(16px) !important;
  backdrop-filter: blur(16px) !important;
}

/*
 * Internal scrims remain present for their existing click-to-close semantics,
 * but the visual backdrop is owned exclusively by ::backdrop to avoid double
 * tinting/blur and to ensure the entire viewport is filtered.
 */
body.pxab-request-modal-native-top-layer :where(
  .pxab-request-modal.is-pxab-request-modal-layer[data-pxab-request-top-layer="1"] .pxab-request-modal__scrim,
  .pxab-currency-modal.is-pxab-request-modal-layer[data-pxab-request-top-layer="1"] .pxab-currency-modal__overlay
) {
  background: transparent !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  pointer-events: auto !important;
}

body.pxab-request-modal-native-top-layer :where(
  .pxab-request-modal.is-pxab-request-modal-layer[data-pxab-request-top-layer="1"] .pxab-request-modal__panel,
  .pxab-price-modal.is-pxab-request-modal-layer[data-pxab-request-top-layer="1"] .pxab-price-modal__dialog,
  .pxab-price-modal.is-pxab-request-modal-layer[data-pxab-request-top-layer="1"] .pxab-price-modal__panel,
  .pxab-currency-modal.is-pxab-request-modal-layer[data-pxab-request-top-layer="1"] .pxab-currency-modal__dialog,
  .pxab-modal.is-pxab-request-modal-layer[data-pxab-request-top-layer="1"] .pxab-modal__panel
) {
  position: relative !important;
  z-index: 1 !important;
  pointer-events: auto !important;
}

/*
 * Progressive fallback for browsers without showPopover()/hidePopover(). This
 * is intentionally isolated behind a runtime class so modern browsers never
 * depend on ancestor z-index escalation.
 */
body.pxab-request-modal-layer-fallback .pxab-ui.is-pxab-request-modal-layer,
body.pxab-request-modal-layer-fallback .pxab-ui :where(
  .pxab-template--request-booking,
  .pxab-request-booking,
  .pxab-request-booking__inner,
  .pxab-request-booking__main,
  .pxab-booking--request-flow,
  .pxab-request-booking__aside.is-pxab-request-modal-layer,
  .pxab-request-booking__summary-stack.is-pxab-request-modal-layer,
  .pxab-request-booking__summary.is-pxab-request-modal-layer
) {
  transform: none !important;
  contain: none !important;
  overflow: visible !important;
}

body.pxab-request-modal-layer-fallback .pxab-ui.is-pxab-request-modal-layer,
body.pxab-request-modal-layer-fallback .pxab-ui :where(
  .pxab-template--request-booking.is-pxab-request-modal-layer,
  .pxab-request-booking.is-pxab-request-modal-layer,
  .pxab-request-booking__inner.is-pxab-request-modal-layer,
  .pxab-request-booking__main.is-pxab-request-modal-layer,
  .pxab-booking--request-flow.is-pxab-request-modal-layer,
  .pxab-request-booking__aside.is-pxab-request-modal-layer,
  .pxab-request-booking__summary-stack.is-pxab-request-modal-layer,
  .pxab-request-booking__summary.is-pxab-request-modal-layer
) {
  position: relative !important;
  isolation: isolate !important;
  z-index: 2147482000 !important;
}

body.pxab-request-modal-layer-fallback :where(
  .pxab-request-modal.is-pxab-request-modal-layer,
  .pxab-price-modal.is-pxab-request-modal-layer,
  .pxab-currency-modal.is-pxab-request-modal-layer,
  .pxab-modal.is-pxab-request-modal-layer
) {
  position: fixed !important;
  inset: 0 !important;
  isolation: isolate !important;
  z-index: 2147483000 !important;
}

body.pxab-request-modal-layer-fallback :where(
  .pxab-request-modal.is-pxab-request-modal-layer .pxab-request-modal__scrim,
  .pxab-currency-modal.is-pxab-request-modal-layer .pxab-currency-modal__overlay
) {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  background: rgba(15, 23, 42, .28) !important;
  -webkit-backdrop-filter: blur(var(--pxab-accommodation-modal-backdrop-blur, 0px)) !important;
  backdrop-filter: blur(var(--pxab-accommodation-modal-backdrop-blur, 0px)) !important;
  pointer-events: auto !important;
}

body.pxab-request-modal-layer-fallback :where(
  .pxab-price-modal.is-pxab-request-modal-layer,
  .pxab-modal.is-pxab-request-modal-layer
) {
  background: rgba(15, 23, 42, .28) !important;
  -webkit-backdrop-filter: blur(var(--pxab-accommodation-modal-backdrop-blur, 0px)) !important;
  backdrop-filter: blur(var(--pxab-accommodation-modal-backdrop-blur, 0px)) !important;
  pointer-events: auto !important;
}

body.pxab-request-modal-layer-fallback :where(
  .pxab-request-modal.is-pxab-request-modal-layer .pxab-request-modal__panel,
  .pxab-price-modal.is-pxab-request-modal-layer .pxab-price-modal__dialog,
  .pxab-price-modal.is-pxab-request-modal-layer .pxab-price-modal__panel,
  .pxab-currency-modal.is-pxab-request-modal-layer .pxab-currency-modal__dialog,
  .pxab-modal.is-pxab-request-modal-layer .pxab-modal__panel
) {
  position: relative !important;
  z-index: 1 !important;
  pointer-events: auto !important;
}

body.pxab-request-modal-layer-fallback .pxab-ui :where(
  .pxab-request-booking__summary-shell:not(.is-pxab-request-modal-layer),
  .pxab-request-booking__summary-stack:not(.is-pxab-request-modal-layer),
  .pxab-request-booking__summary:not(.is-pxab-request-modal-layer),
  .pxab-request-booking__aside:not(.is-pxab-request-modal-layer)
) {
  pointer-events: none !important;
  z-index: 0 !important;
}

body.pxab-request-modal-layer-fallback .pxab-ui :where(
  .pxab-request-booking__summary-stack.is-fixed:not(.is-pxab-request-modal-layer),
  .pxab-request-booking__summary-stack.is-sticky:not(.is-pxab-request-modal-layer)
) {
  visibility: hidden !important;
}

@supports not (height: 100dvh) {
  body.pxab-request-modal-layer-open .pxab-request-modal.is-pxab-request-modal-layer .pxab-request-modal__panel,
  body.pxab-request-modal-layer-open .pxab-price-modal.is-pxab-request-modal-layer :where(.pxab-price-modal__dialog, .pxab-price-modal__panel),
  body.pxab-request-modal-layer-open .pxab-currency-modal.is-pxab-request-modal-layer .pxab-currency-modal__dialog,
  body.pxab-request-modal-layer-open .pxab-modal.is-pxab-request-modal-layer .pxab-modal__panel {
    max-height: calc(100vh - 32px) !important;
  }
}
