/* input(12,5): run-time error CSS1030: Expected identifier, found '.'
input(30,1): run-time error CSS1025: Expected comma or open brace, found ')' */
/* Storefront backdrop component. Use .db-backdrop for new surfaces.
   Legacy selectors are adapters for plugin-owned nodes and pseudo-elements:
   keep their positioning, visibility, click handlers and stacking order intact.
   Do not target generic .overlay: product images and login panels use it too. */
:root {
    --db-backdrop-tint: rgba(255, 255, 255, .18);
    --db-backdrop-blur: 8px;
    --db-backdrop-duration: 240ms;
}

html body :is(
    .db-backdrop,
    .menu_overlay,
    #fly_out_cart .fly-shopping-cart .overlayy,
    .so-backdrop,
    .qv-backdrop,
    .drawer-overlay,
    .wishlist-login-modal-overlay,
    .international-visitor-notice,
    .ui-widget-overlay,
    .mfp-bg,
    .modal-backdrop,
    .modal > .overlay,
    .bar-notification-container .bar-notification .overlay,
    .header-search-wrapper ~ .search-overlay,
    .search_box .search_overlay,
    #loadingOverlay,
    .overlayOffCanvas,
    .master-wrapper-page > .bm_mobil_menu_overlay
),
html body .master-wrapper-page::before,
html body header .header_middle .header_middle_right :is(.region_box, .language_box, .current_box) button::before,
html body .bm_mobil_menu .mobile-menu-bottom-area .region_box button::before {
    background: var(--db-backdrop-tint) !important;
    -webkit-backdrop-filter: blur(var(--db-backdrop-blur)) !important;
    backdrop-filter: blur(var(--db-backdrop-blur)) !important;
}

/* These libraries used element opacity to darken the old black backdrop.
   Tint now lives in the shared color; do not dilute the blur itself. */
html body .ui-widget-overlay,
html body .mfp-bg:not(.mfp-removing),
html body .modal-backdrop.show {
    opacity: 1 !important;
}

html body header .header_bottom .header-menu nav .menu_overlay {
    /* Cover the viewport, independently of the navigation container gutters. */
    position: fixed;
    left: 0;
    right: 0;
    width: 100%;
    height: 100vh;
    transition: opacity var(--db-backdrop-duration) ease,
        visibility 0s linear var(--db-backdrop-duration);
}
html body header .header_bottom .header-menu nav .menu_overlay.db-backdrop-visible {
    opacity: 1;
    visibility: visible;
    transition-delay: 0s;
}

/* A light veil remains usable on browsers without backdrop filtering. */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    :root { --db-backdrop-tint: rgba(255, 255, 255, .65); }
}
@media (prefers-reduced-motion: reduce) {
    :root { --db-backdrop-duration: 0ms; }
}

/* The add-to-cart notification is a full-screen stacking context. Apply the
   backdrop to that surface so its nested overlay cannot isolate the blur. */
html body #bar-notification.bar-notification-container > .bar-notification {
    background: var(--db-backdrop-tint) !important;
    -webkit-backdrop-filter: blur(var(--db-backdrop-blur)) !important;
    backdrop-filter: blur(var(--db-backdrop-blur)) !important;
}
html body #bar-notification.bar-notification-container > .bar-notification > .overlay {
    background: transparent !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

