/* Datatables fixup*/
.dtsb-criteria,
.dtsb-criteria + .btn {
    margin-left: 20px;
}
/* make footer of table sticky */
.dataTables_wrapper .datatable-footer {
    position: sticky;
    bottom: 0;
    padding: 4px;
    background: #fff;
    border-top: 2px solid #ccc;
}

div.dtsb-searchBuilder div.dtsb-group div.dtsb-logicContainer button.dtsb-logic {
    padding-left: 0;
    padding-right: 0;
}

div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria select.dtsb-dropDown,
div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria input.dtsb-input {
    background-color: #fff;
}

body table.dataTable {
    max-width: 100% !important;
}

.mdi {
    height: 24px;
}

.dropdown-item.btn:hover {
    color: #fff;
    text-decoration: none;
    background-color: #007bff;
}

.dropdown-item.btn-danger:hover {
    color: #fff;
    text-decoration: none;
    background-color: #c82333;
}

.dropdown-item.btn-warning:hover {
    color: initial;
    text-decoration: none;
    background-color: #ffc107;
}

/* bootstrap fix for checkboxes */
/* https://stackoverflow.com/questions/21562840/input-checkbox-in-div-jumps-to-top-of-page-on-firefox/21563023 */
.btn-group-toggle > .btn input[type="checkbox"],
.btn-group-toggle > .btn input[type="radio"],
.btn-group-toggle > .btn-group > .btn input[type="checkbox"],
.btn-group-toggle > .btn-group > .btn input[type="radio"] {
    position: initial;
    display: none;
}

@media (max-width: 991px) {
    div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria .form-control {
        width: 50%;
        float: left;
        display: block;
        margin-bottom: 2px;
    }

    .dtsb-criteria::after {
        display: block;
        clear: both;
        content: "";
    }
    .dtsb-criteria,
    .dtsb-criteria + .btn {
        margin-left: 0;
    }
    div.dtsb-searchBuilder
        div.dtsb-group
        div.dtsb-criteria
        div.dtsb-buttonContainer
        button.dtsb-delete,
    div.dtsb-searchBuilder
        div.dtsb-group
        div.dtsb-criteria
        div.dtsb-buttonContainer
        button.dtsb-right,
    div.dtsb-searchBuilder
        div.dtsb-group
        div.dtsb-criteria
        div.dtsb-buttonContainer
        button.dtsb-left {
        margin-right: 5px;
    }
    table.dataTable > tbody > tr.child ul.dtr-details {
        padding: 0 10px;
        width: 100%;
    }
    table.dataTable > tbody > tr.child span.dtr-title,
    table.dataTable > tbody > tr.child span.dtr-data {
        width: 50%;
    }
    table.dataTable > tbody > tr.child span.dtr-data > * {
        display: inline-block;
    }
    table.dataTable > tbody > tr.child > td.child {
        border-bottom: 2px solid #ccc;
    }
    .dtr-bs-modal ul {
        padding: 0;
    }
    .dtr-bs-modal ul li {
        list-style-type: none;
        border-bottom: 1px solid #ccc;
        padding: 5px 0;
    }
    .dtr-bs-modal ul li .dtr-title {
        width: 50%;
        display: inline-block;
        font-weight: bold;
        float: left;
        min-height: 1px;
    }
    .dtr-bs-modal ul li .dtr-data {
        width: 50%;
        display: inline-block;
    }
}
