﻿.mstm-popup-modal {
    z-index: 1060;
}

.mstm-popup-modal .modal-dialog {
    width: var(--popupWidth, auto);
    max-width: var(--popupMaxWidth, 92vw);
}

.mstm-popup-modal .modal-content {
    height: var(--popupHeight, auto);
    max-height: var(--popupMaxHeight, 90vh);
    overflow: hidden;
}

.mstm-popup-modal .modal-body {
    overflow-y: auto;
    overscroll-behavior: contain;
}

.mstm-popup-modal .mstm-popup-close {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    z-index: 2;
    padding: 0.5rem;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.85);
    opacity: 0.8;
}

.mstm-popup-modal .mstm-popup-close:hover {
    opacity: 1;
}

.mstm-popup-modal .modal-body img {
    max-width: 100%;
    height: auto;
}

.mstm-popup-modal .modal-body > :last-child {
    margin-bottom: 0;
}

.mstm-popup-modal .modal-dialog.left {
    margin-left: 1rem;
    margin-right: auto;
}

.mstm-popup-modal .modal-dialog.right {
    margin-left: auto;
    margin-right: 1rem;
}

.mstm-popup-modal .modal-dialog.middle {
    display: flex;
    align-items: center;
    min-height: calc(100% - 3.5rem);
}

.mstm-popup-modal .modal-dialog.top {
    margin-top: 1rem;
    align-items: flex-start;
}

.mstm-popup-modal .modal-dialog.bottom {
    min-height: calc(100% - 2rem);
    display: flex;
    align-items: flex-end;
}

@media (max-width: 575.98px) {
    .mstm-popup-modal .modal-dialog {
        width: auto;
        max-width: none;
        margin: 0.5rem;
    }
}
