/* Darken background */
.modal-backdrop {
    background-color: #212121 !important;
    opacity: 0.5 !important;
    z-index: 1050 !important;
}

/* Disable interaction with rest of page when modal is open */
body.modal-open {
    pointer-events: none;
}

/* Re-enable interaction inside modal */
.modal-dialog {
    pointer-events: auto;
}

/* Custom fade-in animation for any modal */
.modal.fade .modal-dialog {
    transition: transform 0.5s ease-out, opacity 0.5s ease-out;
    transform: translateY(-50px);
    opacity: 0;
}

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