/* ======================================================
SC CUSTOM MODALS
====================================================== */

body.sc-modal-open {
    overflow: hidden;
}

.sc-custom-modal {
    display: none;
}

.sc-custom-modal,
.sc-modal {
    --sc-modal-z-index: 2147483000;
    --sc-modal-transition-duration: 220ms;
    opacity: 0;
    transition: opacity var(--sc-modal-transition-duration) ease;
}

.sc-managed-modal {
    background: transparent;
    backdrop-filter: none;
    isolation: isolate;
    position: fixed !important;
    inset: 0;
    z-index: var(--sc-modal-z-index) !important;
}

/* ======================================================
MODAL MOTION
====================================================== */

.sc-custom-modal .modal-dialog,
.sc-custom-modal .sc-modal-dialog,
.sc-modal .sc-modal-dialog {
    opacity: 0;
    transform: translateY(8px) scale(0.98);
    transition:
        opacity var(--sc-modal-transition-duration) ease,
        transform var(--sc-modal-transition-duration) ease;
    animation: none;
    will-change: opacity, transform;
}

.sc-custom-modal .sc-modal-overlay,
.sc-modal .sc-modal-overlay {
    opacity: 0;
    transition: opacity var(--sc-modal-transition-duration) ease;
}

.sc-custom-modal.sc-is-closing,
.sc-modal.sc-is-closing {
    pointer-events: none;
}

.sc-custom-modal.show .modal-dialog,
.sc-custom-modal.show .sc-modal-dialog,
.sc-modal.show .sc-modal-dialog {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.sc-custom-modal.show .sc-modal-overlay,
.sc-modal.show .sc-modal-overlay {
    opacity: 1;
}

/* ======================================================
MANAGED MODAL SHELL
====================================================== */

.sc-managed-modal .sc-modal-dialog {
    background: transparent;
    border-radius: 0;
}

.sc-managed-modal .sc-modal-content {
    width: 100%;
    max-width: none;
}

.sc-custom-modal .sc-modal-overlay,
.sc-modal .sc-modal-overlay {
    position: fixed;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    border: 0;
    padding: 0;
    background: rgba(0, 0, 0, 0.72);
    cursor: pointer;
}

.sc-custom-modal.show {
    position: fixed;
    inset: 0;
    z-index: 1000005;
    display: block !important;
    overflow-x: hidden;
    overflow-y: auto;
}

.sc-custom-modal.sc-is-closing {
    position: fixed;
    inset: 0;
    z-index: 1000005;
    display: block !important;
    overflow-x: hidden;
    overflow-y: auto;
}

.sc-custom-modal.show .modal-dialog,
.sc-custom-modal.show .sc-modal-dialog,
.sc-custom-modal.sc-is-closing .modal-dialog,
.sc-custom-modal.sc-is-closing .sc-modal-dialog,
.sc-modal.show .sc-modal-dialog {
    position: relative;
    z-index: 1;
    pointer-events: auto;
}

.sc-modal.sc-is-closing {
    display: flex;
}

.sc-custom-modal .modal-dialog[data-sc-modal-content],
.sc-custom-modal .sc-modal-dialog[data-sc-modal-content],
.sc-modal .sc-modal-dialog[data-sc-modal-content] {
    margin-right: auto;
    margin-left: auto;
}

.sc-custom-modal.show .modal-content,
.sc-custom-modal.show .sc-modal-content,
.sc-modal.show .sc-modal-content {
    pointer-events: auto;
}

@media (prefers-reduced-motion: reduce) {
    .sc-custom-modal,
    .sc-modal {
        --sc-modal-transition-duration: 0ms;
    }

    .sc-custom-modal .modal-dialog,
    .sc-custom-modal .sc-modal-dialog,
    .sc-modal .sc-modal-dialog,
    .sc-custom-modal .sc-modal-overlay,
    .sc-modal .sc-modal-overlay {
        transition: none;
    }
}