/* =========================================
   GLOBAL MODAL FIXES (Bootstrap-compatible)
   ========================================= */

/* Ensure modal always sits above navbar */
.modal {
    z-index: 10050 !important; 
}

.modal-backdrop {
    z-index: 10040 !important;
}


/* Prevent navbar overlap (especially sticky/fixed navbars) */
.modal-dialog {
    margin-top: calc(var(--navbar-height) + 1rem);
    margin-bottom: 1rem;
    max-height: calc(100vh - var(--navbar-height) - 2rem);
}

/* Keep modal within visible viewport */
.modal-content {
    height: 100%;
    display: flex;
    flex-direction: column;
}


/* Scroll content, not header/footer */
.modal-body {
    overflow-y: auto;
    flex: 1 1 auto;
}

/* Always-visible close button */
.modal-header {
    position: sticky;
    top: 0;
    background-color: var(--bs-body-bg, #fff);
    z-index: 2;
}

/* Mobile safety */
@media (max-width: 768px) {
    .modal-dialog {
        margin-top: calc(var(--navbar-height) + 0.5rem);
        margin-bottom: 0.5rem;
        max-height: calc(100vh - var(--navbar-height) - 1rem);
    }

    .modal-content {
        max-height: calc(100vh - var(--navbar-height) - 1rem);
    }
}