/* Order detail owns the native password modal. Do not re-create its input. */
body.pages-order-order .order_container > .u-mask {
    /* scale(1) still establishes a fixed-position containing block. */
    transform: none !important;
}

body.pages-order-order .order_container > .u-mask.u-mask-show {
    z-index: 2000 !important;
}

body.pages-order-order .order_container .modal1 {
    /* A nested fixed password layer must be allowed to escape the detail card. */
    overflow: visible !important;
    isolation: auto !important;
    transform: none !important;
    filter: none !important;
    contain: none !important;
}

body.pages-order-order .order_container .modal1 .u-drawer,
body.pages-order-order .order_container .modal1 .u-drawer > .u-mask {
    position: fixed !important;
    top: 0 !important;
    bottom: 0 !important;
    left: var(--mobile-canvas-gutter, 0px) !important;
    right: var(--mobile-canvas-gutter, 0px) !important;
    width: auto !important;
    max-width: none !important;
    transform: none !important;
}

body.pages-order-order .order_container .modal1 .u-drawer-center {
    inset: 0 !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
    padding: 20px 16px !important;
}

body.pages-order-order .order_container .modal1 .u-mode-center-box {
    width: min(384px, calc(100vw - 32px), calc(var(--mobile-canvas-width, 480px) - 32px)) !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex-shrink: 0 !important;
    box-sizing: border-box !important;
}

body.pages-order-order .order_container .modal1 .u-model {
    width: 100% !important;
    box-sizing: border-box !important;
    background: #ffffff !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    box-shadow: 0 16px 44px rgba(20, 35, 55, 0.22) !important;
}

body.pages-order-order .order_container .modal1 .slot-content {
    padding: 0 16px !important;
    box-sizing: border-box !important;
}

body.pages-order-order .order_container .modal1 .jp-coded {
    width: min(100%, 320px) !important;
    min-width: 0 !important;
    flex-shrink: 0 !important;
}

body.pages-order-order .order_container .modal1 .jp-coded .pay-pwd-input,
body.pages-order-order .order_container .modal1 .jp-coded .input_info {
    width: 100% !important;
    box-sizing: border-box !important;
}

/* While the password modal is open, its native mask is the only dimming layer. */
body.pages-order-order .order_container > .u-mask.u-mask-show:has(.modal1 .u-drawer-content-visible) {
    background-color: transparent !important;
}