/**/
/* Modalizer */
/**/
/* Structure + open/close animation only. Visual styling (background,
   border, padding, radius) is entirely up to whatever content is placed
   inside .modalizer__content - the wrapper doesn't impose a look. */

.modalizer {
    position: fixed;
    inset: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    pointer-events: none;
    /* z-index is set per-instance by Modalizer, not here */
}

.modalizer.opened {
    pointer-events: auto;
}

.modalizer.hidden {
    visibility: hidden;
}

.modalizer__overlay {
    position: absolute;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 0;
    transition: opacity 350ms ease;
}

.modalizer.opened .modalizer__overlay {
    opacity: 1;
}

.modalizer__content {
    position: relative;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    overflow: hidden;
    opacity: 0;
    transform: scale(0.95);
    transition: opacity 350ms ease, transform 350ms ease;
    display: flex;
    justify-content: center;
    align-items: center;
}

.modalizer__content:focus {
    outline: none;
}

.modalizer.opened .modalizer__content {
    opacity: 1;
    transform: scale(1);
}