/* Single source for stack-driven z-index — OFW029 allowlist.
   Overlays are viewport-fixed below TopMenu. Never position:absolute
   inside .clubivate-main-stage (that ties geometry to the scrollport). */

.ui-stack-overlay-root {
    position: fixed;
    top: var(--clubivate-topmenu-height, 0px);
    right: 0;
    bottom: var(--clubivate-footer-height, 0px);
    left: 0;
    pointer-events: none;
    z-index: 1;
}

.ui-stack-layer {
    position: relative;
    z-index: var(--ui-stack-z);
}

.ui-stack-layer--viewport-host {
    position: fixed;
    top: var(--clubivate-topmenu-height, 0px);
    right: 0;
    bottom: var(--clubivate-footer-height, 0px);
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--clubivate-modal-edge-gap, 10px);
    overflow-x: hidden;
    overflow-y: auto;
    pointer-events: none;
    z-index: var(--ui-stack-z);
}

.ui-stack-layer--viewport-host > [role="dialog"],
.ui-stack-layer--viewport-host > .modal-dialog,
.ui-stack-layer--viewport-host > .clubivate-confirm-dialog {
    pointer-events: auto;
}

/* In-place overlay inside a positioned host (edition offers preview panels). */
.ui-stack-layer.ui-stack-layer--embedded-overlay-host {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding: 0;
    overflow-x: hidden;
    overflow-y: auto;
    pointer-events: auto;
    background-color: rgba(0, 0, 0, 0.45);
    z-index: var(--ui-stack-z);
}

.ui-stack-layer.ui-stack-layer--embedded-overlay-host > [role="dialog"],
.ui-stack-layer.ui-stack-layer--embedded-overlay-host > .location-filter-bottom-sheet {
    pointer-events: auto;
}

@media (min-width: 768px) {
    .ui-stack-layer.ui-stack-layer--embedded-overlay-host {
        align-items: center;
        padding: 1rem;
    }
}

.ui-backdrop {
    position: fixed;
    top: var(--clubivate-topmenu-height, 0px);
    right: 0;
    bottom: var(--clubivate-footer-height, 0px);
    left: 0;
    z-index: var(--ui-stack-z);
    pointer-events: auto;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

.blazor-error-ui-stack {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    pointer-events: none;
}

.blazor-error-ui-stack #blazor-error-ui {
    pointer-events: auto;
}

/* Nested row menu. The host must not scroll the page or clip the menu.
   isolation lifts this overlay above a Bootstrap dropdown in the page. */
.clubivate-app-shell:has(.row-actions-viewport-host) .clubivate-main-stage {
    isolation: isolate;
}

.ui-stack-layer--viewport-host.row-actions-viewport-host {
    align-items: flex-start;
    justify-content: flex-start;
    overflow: visible;
    padding: 0;
    pointer-events: none;
}

.ui-stack-layer--viewport-host.row-actions-viewport-host .row-actions-dismiss {
    position: fixed;
    inset: 0;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    pointer-events: auto;
}

.ui-stack-layer--viewport-host.row-actions-viewport-host .row-actions-stack-menu {
    display: block;
    width: max-content;
    min-width: 10rem;
    max-width: calc(100vw - 1rem);
    box-sizing: border-box;
    pointer-events: auto;
}

.ui-stack-layer--viewport-host.row-actions-viewport-host .row-actions-stack-menu .dropdown-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}