/* Shared topmost-window focus treatment.
   This file is intentionally loaded after bundled and page-specific portal
   styles. A subtle static tint separates the active surface without blurring
   or filtering the page underneath. Keep surface borders/shadows and all
   existing blocking, focus, stacking and dismissal behaviour intact. */
html body.ff-app {
    --ff-focus-backdrop-filter: none;
    --ff-focus-dialog-backdrop-filter: none;
    --ff-focus-backdrop-wash: rgba(31, 31, 31, .10);
    --ff-focus-wait-wash: rgba(31, 31, 31, .06);
}

html body.ff-app[data-theme="dark"] {
    /* Tint towards the dark theme background, not its near-white text colour.
       These low opacities leave underlying content readable in dark mode. */
    --ff-focus-backdrop-wash: rgba(15, 17, 21, .14);
    --ff-focus-wait-wash: rgba(15, 17, 21, .10);
}

@supports (color: color-mix(in srgb, #000 50%, transparent)) {
    html body.ff-app {
        --ff-focus-backdrop-wash: color-mix(in srgb, var(--text, #1f1f1f) 10%, transparent);
        --ff-focus-wait-wash: color-mix(in srgb, var(--text, #1f1f1f) 6%, transparent);
    }

    html body.ff-app[data-theme="dark"] {
        --ff-focus-backdrop-wash: color-mix(in srgb, var(--bg, #0f1115) 14%, transparent);
        --ff-focus-wait-wash: color-mix(in srgb, var(--bg, #0f1115) 10%, transparent);
    }
}

html body.ff-app :is(
    .aside-backdrop.in,
    .aside-backdrop.show,
    .ff-waybill-quick-view-backdrop,
    .ff-waybill-quick-view-detail-backdrop,
    .ff-global-search-layer,
    .ff-global-search-detail-layer,
    .ff-image-preview-v2__backdrop,
    .ff-pilot-intro-backdrop,
    .ff-pilot-contact-layer:not([hidden]),
    .ff-companion-settings-backdrop,
    .ff-grid-column-chooser-overlay,
    .ff-context-master-overlay,
    .ff-si-agent-import-overlay,
    .ff-si-query-drilldown-backdrop
) {
    -webkit-backdrop-filter: var(--ff-focus-backdrop-filter) !important;
    backdrop-filter: var(--ff-focus-backdrop-filter) !important;
    background: var(--ff-focus-backdrop-wash) !important;
}

html body.ff-app :is(
    .swal2-container.swal2-backdrop-show,
    .modal-backdrop.in,
    .modal-backdrop.show
) {
    -webkit-backdrop-filter: var(--ff-focus-dialog-backdrop-filter) !important;
    backdrop-filter: var(--ff-focus-dialog-backdrop-filter) !important;
    background: var(--ff-focus-backdrop-wash) !important;
}

html body.ff-app
    :is(.modal-backdrop.in, .modal-backdrop.show, .aside-backdrop.in, .aside-backdrop.show) {
    opacity: 1 !important;
}

html body.ff-app.ff-portal-wait-visible:not(.ff-portal-wait-indicator) .ff-portal-wait {
    -webkit-backdrop-filter: var(--ff-focus-backdrop-filter) !important;
    backdrop-filter: var(--ff-focus-backdrop-filter) !important;
    background: var(--ff-focus-wait-wash) !important;
}

html body.ff-app :is(
    .dx-dialog-root .dx-overlay-shader,
    .dx-popup-wrapper.dx-overlay-shader:not(.dx-dropdowneditor-overlay):not(.dx-dropdownlist-popup-wrapper):not(.dx-selectbox-popup-wrapper):not(.dx-datebox-wrapper):not(.dx-dropdownbutton-popup-wrapper):not(.dx-suggestion-list-wrapper):not(.dx-scheduler-appointment-tooltip-wrapper):not(.dx-tooltip-wrapper):not(.dx-popover-wrapper):not(.dx-loadpanel-wrapper):not(.dx-menu-adaptive-mode-overlay-wrapper)
) {
    -webkit-backdrop-filter: var(--ff-focus-dialog-backdrop-filter) !important;
    backdrop-filter: var(--ff-focus-dialog-backdrop-filter) !important;
    background: var(--ff-focus-backdrop-wash) !important;
}

html body.ff-app .dx-drawer-opened .dx-drawer-shader {
    -webkit-backdrop-filter: var(--ff-focus-backdrop-filter) !important;
    backdrop-filter: var(--ff-focus-backdrop-filter) !important;
    background: var(--ff-focus-backdrop-wash) !important;
}