html body .modal.show {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: max(12px, env(safe-area-inset-top)) 12px max(12px, env(safe-area-inset-bottom)) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
}

html body .modal.show .modal-dialog,
html body .modal.show .modal-dialog.modal-dialog-centered {
    width: min(100%, 520px) !important;
    max-width: calc(100vw - 24px) !important;
    min-height: 0 !important;
    max-height: calc(100dvh - max(24px, env(safe-area-inset-top)) - max(24px, env(safe-area-inset-bottom))) !important;
    margin: auto !important;
    display: block !important;
    transform: none !important;
}

html body .modal.show .modal-content {
    width: 100% !important;
    max-height: inherit !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
}

html body .modal.show .window-login,
html body .modal.show .window-register,
html body .modal.show .align-center-windows,
html body .modal.show .card.windows {
    max-height: inherit !important;
}

html body #qrCodeModal.show .modal-dialog,
html body #successModal.show .modal-dialog {
    width: min(100%, 480px) !important;
}

html body #qrCodeTaxModal.show .modal-dialog {
    width: min(100%, 520px) !important;
}

html body #entrarModal.show .modal-dialog,
html body #cadastroModal.show .modal-dialog,
html body #idadeModal.show .modal-dialog {
    width: min(100%, 640px) !important;
}

html body #entrarModal.show .modal-dialog,
html body #cadastroModal.show .modal-dialog,
html body #idadeModal.show .modal-dialog,
html body #modalDeposito.show .modal-dialog,
html body #qrCodeModal.show .modal-dialog,
html body #qrCodeTaxModal.show .modal-dialog,
html body #successModal.show .modal-dialog,
html body #successModalTax.show .modal-dialog,
html body #modalSaque.show .modal-dialog,
html body #modalTrocarIdioma.show .modal-dialog {
    margin: auto !important;
    max-height: calc(100dvh - max(24px, env(safe-area-inset-top)) - max(24px, env(safe-area-inset-bottom))) !important;
    transform: none !important;
}

@media (max-width: 576px) {
    html body .modal.show {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    html body .modal.show .modal-dialog,
    html body .modal.show .modal-dialog.modal-dialog-centered {
        width: 100% !important;
        max-width: calc(100vw - 20px) !important;
    }

    html body .modal.show .modal-content {
        border-radius: 16px !important;
    }

    html body #entrarModal.show .modal-dialog,
    html body #cadastroModal.show .modal-dialog,
    html body #idadeModal.show .modal-dialog,
    html body #modalDeposito.show .modal-dialog,
    html body #qrCodeModal.show .modal-dialog,
    html body #qrCodeTaxModal.show .modal-dialog,
    html body #successModal.show .modal-dialog,
    html body #successModalTax.show .modal-dialog,
    html body #modalSaque.show .modal-dialog,
    html body #modalTrocarIdioma.show .modal-dialog {
        margin: auto !important;
    }
}