.dynamic-modal-wrapper {

    position: fixed;
    inset: 0;

    display: flex;

    align-items: center;
    justify-content: center;

    z-index: 9999;

}


.dynamic-modal-backdrop {

    position: absolute;

    inset: 0;

    background: rgba(0, 0, 0, .45);

}


/*
    Container modal
*/

.dynamic-modal {

    position: relative;

    z-index: 1;

    max-height: 100vh;

    display: flex;

    flex-direction: column;

}


/*
    isi modal
*/

.dynamic-modal-content {

    background: white;

    border-radius: 12px;

    overflow: hidden;

    max-height: 90vh;

    display: flex;

    flex-direction: column;

}


/*
    body yang scroll
*/

.dynamic-modal-body {

    overflow-y: auto;

    flex: 1;

}


/*
    animasi
*/

.dynamic-modal-wrapper.show .dynamic-modal-content {


    animation:
        modalShow .2s ease;

}



@keyframes modalShow {

    from {

        opacity: 0;

        transform: translateY(-20px);

    }

    to {

        opacity: 1;

        transform: none;

    }

}