/*
 * modal-tables.css - tables inside #modals-alani stay inside the modal box.
 * Prefix: mdt-. Loaded after the vendor CSS; vendor files are not edited.
 *
 * .modal-body overflow is left alone on purpose: bootstrap-modal.css forces
 * "overflow: visible !important" below 980px, and clipping the body would also cut
 * in-cell dropdowns and popup x-editable. Scrolling lives on a table's own box,
 * which modal-tables.js adds only to a table that does not fit.
 * v1.0
 */
#modals-alani .mdt-scroll {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin-bottom: 20px;
}

#modals-alani .mdt-scroll > .table,
#modals-alani .mdt-scroll > .dataTables_wrapper {
    margin-bottom: 0;
}

#modals-alani table.dataTable {
    width: 100% !important;
}

/* A modal whose table did not fit opens wide (modal-tables.js adds .mdt-wide). */
@media (min-width: 768px) {
    #modals-alani .modal-dialog.mdt-wide {
        width: 94%;
        max-width: 1400px;
    }
}

/* Phones: the modal uses the full width. */
@media (max-width: 767px) {
    #modals-alani .modal-dialog {
        width: auto;
        margin: 0;
    }
}