.dbw-popup-layer { position: relative; z-index: 0; }

.dbw-popup {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: grid;
    place-items: center;
    padding: clamp(16px, 4vw, 48px);
    color: var(--dbw-popup-color, #15121a);
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--dbw-popup-duration, 360ms) ease;
}

.dbw-popup[hidden] { display: none; }
.dbw-popup.is-open { opacity: 1; pointer-events: auto; }
.dbw-popup.is-closing { opacity: 0; pointer-events: none; }

.dbw-popup__backdrop {
    position: absolute;
    inset: 0;
    background: var(--dbw-popup-overlay, rgba(15, 10, 24, 0.72));
    backdrop-filter: blur(var(--dbw-popup-blur, 6px));
}

.dbw-popup__dialog {
    position: relative;
    z-index: 1;
    box-sizing: border-box;
    width: min(100%, var(--dbw-popup-width, 620px));
    max-height: min(var(--dbw-popup-max-height, 90dvh), calc(100dvh - clamp(32px, 8vw, 96px)));
    overflow: auto;
    padding: var(--dbw-popup-padding, 40px);
    border: 1px solid rgba(111, 91, 137, 0.18);
    border-radius: var(--dbw-popup-radius, 24px);
    background: var(--dbw-popup-bg, #fff);
    color: inherit;
    box-shadow: 0 34px 90px rgba(19, 10, 33, 0.38), 0 8px 24px rgba(19, 10, 33, 0.18);
    transform: translate3d(0, 0, 0);
    transition: transform var(--dbw-popup-duration, 360ms) cubic-bezier(.2,.8,.2,1), opacity var(--dbw-popup-duration, 360ms) ease;
}

.dbw-popup--top { place-items: start center; }
.dbw-popup--bottom { place-items: end center; }
.dbw-popup--fade .dbw-popup__dialog { opacity: 0; }
.dbw-popup--scale .dbw-popup__dialog { opacity: 0; transform: scale(.92); }
.dbw-popup--slide-up .dbw-popup__dialog { opacity: 0; transform: translateY(48px); }
.dbw-popup--slide-down .dbw-popup__dialog { opacity: 0; transform: translateY(-48px); }
.dbw-popup--slide-left .dbw-popup__dialog { opacity: 0; transform: translateX(48px); }
.dbw-popup--slide-right .dbw-popup__dialog { opacity: 0; transform: translateX(-48px); }
.dbw-popup.is-open .dbw-popup__dialog { opacity: 1; transform: none; }

.dbw-popup__close {
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 5;
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(92, 73, 112, 0.16);
    border-radius: 50%;
    background: #f5f0f8;
    background: color-mix(in srgb, var(--dbw-popup-bg, #fff) 90%, #6d28d9 10%);
    color: currentColor;
    font: 500 25px/1 system-ui, sans-serif;
    cursor: pointer;
    transition: transform 160ms ease, background-color 160ms ease;
}

.dbw-popup__close:hover { transform: rotate(8deg); background: color-mix(in srgb, var(--dbw-popup-bg, #fff) 80%, #6d28d9 20%); }
.dbw-popup__close:focus-visible { outline: 3px solid #8b5cf6; outline-offset: 3px; }
.dbw-popup__content { width: 100%; }
html.dbw-popup-scroll-lock, html.dbw-popup-scroll-lock body { overflow: hidden !important; }

@media (max-width: 767px) {
    .dbw-popup { padding: 12px; }
    .dbw-popup__dialog {
        width: min(100%, var(--dbw-popup-mobile-width, 100vw));
        max-height: min(var(--dbw-popup-mobile-max-height, 96dvh), calc(100dvh - 24px));
        padding: var(--dbw-popup-mobile-content-padding, 28px);
        border-radius: min(var(--dbw-popup-radius, 24px), 20px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .dbw-popup, .dbw-popup__dialog, .dbw-popup__close { transition-duration: 1ms !important; }
}
