/* Elimina o relaja el max-height en .modal-body si lo tenías */
.modal-body {
    /* max-height: calc(100vh - 200px);  <-- COMENTA O ELIMINA ESTA LÍNEA */
    overflow-y: auto; /* Mantén esto para el scroll interno si el contenido es muy largo */
    -webkit-overflow-scrolling: touch;
    padding-bottom: 20px; /* Mantén un padding interno para el contenido del modal */
}

/* Asegura que el modal-dialog pueda ocupar el espacio y se centre */
.modal-dialog {
    /* Bootstrap ya maneja esto, pero asegúrate de no tener overrides que lo fijen */
    margin-top: 0; /* Asegura que no haya un margen superior fijo que lo empuje hacia abajo */
    margin-bottom: 0; /* Asegura que no haya un margen inferior fijo */
    height: 100%; /* Permite que el diálogo use toda la altura disponible */
    display: flex;
    align-items: center; /* Centra el contenido del modal verticalmente */
    justify-content: center; /* Centra horizontalmente */
}

.modal-content {
    /* Permite que el contenido del modal crezca y se ajuste */
    max-height: 95%; /* Puedes poner un max-height para que no ocupe 100% y tenga un margen */
    overflow: hidden; /* El scroll lo maneja el modal-body */
    display: flex;
    flex-direction: column;
}

/* Asegura que html y body permitan el scroll si el padding-bottom los hace más grandes */
html, body {
    height: 100%;
    min-height: 100%;
    overflow-y: auto; /* ¡Crucial! Permite el scroll vertical en el documento principal */
    -webkit-overflow-scrolling: touch;
}