/* Swish checkout modal: Open Swish first in the body; body is the only scroll owner. */

.ui-stack-layer--viewport-host.clubivate-modal-dialog-host.swish-payment-modal-host {
    align-items: flex-start;
    justify-content: center;
    overflow: hidden;
}

.clubivate-modal-dialog-host.swish-payment-modal-host .modal-dialog,
.clubivate-modal-dialog-host.swish-payment-modal-host .modal-content {
    width: min(22rem, calc(100vw - 2rem));
    height: min(100%, var(--clubivate-modal-viewport-height, 100dvh));
    max-height: min(100%, var(--clubivate-modal-viewport-height, 100dvh));
    display: flex;
    flex-direction: column;
    min-height: 0;
    align-items: stretch;
}

.clubivate-modal-dialog-host.swish-payment-modal-host .modal-content {
    overflow: hidden;
}

.clubivate-modal-dialog-host.swish-payment-modal-host .modal-header,
.clubivate-modal-dialog-host.swish-payment-modal-host .modal-footer {
    flex-shrink: 0;
}

.clubivate-modal-dialog-host.swish-payment-modal-host .modal-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: scroll;
}

.clubivate-modal-dialog-host.swish-payment-modal-host .modal-header {
    background-color: var(--bs-success);
    color: #fff;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

.clubivate-modal-dialog-host.swish-payment-modal-host .modal-header .modal-title {
    color: #fff;
    margin-bottom: 0;
}

.clubivate-modal-dialog-host.swish-payment-modal-host .modal-header .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%);
}

.clubivate-modal-dialog-host.swish-payment-modal-host .modal-footer {
    justify-content: center !important;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

.swish-payment-modal__qr {
    width: min(12.5rem, 100%);
    min-width: 150px;
    min-height: 150px;
    max-width: 12.5rem;
    height: auto;
    object-fit: contain;
}