.datatable-card {
    background: #fff;
    border-radius: 0.5rem;
    box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,0.075);
    padding: 1.5rem;
    margin-bottom: 2rem;
}

.datatable-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid #f0f0f0;
}

.datatable-title {
    font-size: 1.75rem;
    font-weight: 600;
    color: #212529;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.datatable-subtitle {
    font-size: 0.875rem;
    color: #6c757d;
    margin: 0.5rem 0 0 0;
}

.datatable-title {
    font-size: 1.5rem;
    font-weight: 600;
    color: #0D47A1;
    margin: 0;
}

.datatable-subtitle {
    font-size: 0.875rem;
    color: #6c757d;
    margin-top: 0.25rem;
}

.modal-title {
    font-size: 1.187rem;
    color: #0D47A1;
}

.dt-button.dt-buttons__dt-button--green {
    background-color: #65bb10;
    background-image: linear-gradient(#6cce08, #64be07 60%, #5fb507);
    background-repeat: no-repeat no-repeat;
    border: 1px solid #64be07;
}

.dt-button.dt-buttons__dt-button--green:hover {
    background-color: #65bb10 !important;
    background-image: linear-gradient(#6cce08, #64be07 60%, #5fb507) !important;
    background-repeat: no-repeat no-repeat !important;
    border: 1px solid #59a808 !important;;
}

.dt-button.dt-buttons__dt-button--cyan {
    background-color: #27cfe6;
    background-image: linear-gradient(#27cfe6, #1fc4da 60%, #00bbd4);
    background-repeat: no-repeat no-repeat;
    border: 1px solid #27cfe6;
}

.dt-button.dt-buttons__dt-button--cyan:hover {
    background-color: #27cfe6 !important;
    background-image: linear-gradient(#27cfe6, #1fc4da 60%, #00bbd4) !important;
    background-repeat: no-repeat no-repeat !important;
    border: 1px solid #24b3c7 !important;
}

.dt-buttons__dt-button__text--white {
    color: #fff;
    font-size: 1rem;
    vertical-align: middle;
}

.dt-buttons__dt-button__svg-icon--white {
    width: 18px;
    filter: invert(1);
}

.dt-buttons__dt-button__i-icon--white {
    color: #fff;
    font-size: 1rem;
    vertical-align: middle;
}

div.dt-buttons > button > span > i {
    font-size: 1rem;
    vertical-align: middle;
}

.dataTables_wrapper .dataTables_filter input {
    margin-left: 0.5em;
    padding: 4px 6px;
    border: 1px solid #ddd;
    border-radius: 2px;
}

.dataTables_wrapper .dataTables_filter i {
    vertical-align: middle;
}

.dataTables_length > label > select {
    padding: 5px 6px;
    border: 1px solid #ddd;
    border-radius: 2px;
}

table.dataTable thead th,
table.dataTable thead td {
    /*padding: 10px 18px;*/
    border-bottom: 1px solid #ddd !important;
    border-bottom: none;
}

table.dataTable.row-border tbody th, table.dataTable.row-border tbody td, table.dataTable.display tbody th, table.dataTable.display tbody td {
    border-top: 1px solid #ddd;
}

table.dataTable.cell-border tbody th, table.dataTable.cell-border tbody td {
    border-top: 1px solid #ddd;
    border-right: 1px solid #ddd;
}

table.dataTable.cell-border tbody tr th:first-child,
table.dataTable.cell-border tbody tr td:first-child {
    border-left: 1px solid #ddd;
}

table.dataTable.no-footer {
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
}

.dataTables_wrapper .dataTables_filter input {
    margin-left: 0.5em;
    padding: 4px 6px;
    border: 1px solid #ddd;
    border-radius: 2px;
}

.dataTables_length > label > select {
    padding: 4px 6px;
    border: 1px solid #ddd;
    border-radius: 2px;
}

.dataTables_wrapper .dataTables_paginate .paginate_button,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled {
    padding: 6px 9px !important;
    background: #f8f8f8 !important;
    border-color: #ddd !important;
    cursor: pointer;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
    color: #7D7D7D !important;
    border: 1px solid #999 !important;
    cursor: pointer;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:active {
    outline: none;
    background-color: #2b2b2b;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #2b2b2b), color-stop(100%, #0c0c0c));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);
    /* Chrome10+,Safari5.1+ */
    background: -moz-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);
    /* FF3.6+ */
    background: -ms-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);
    /* IE10+ */
    background: -o-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);
    /* Opera 11.10+ */
    background: linear-gradient(to bottom, #2b2b2b 0%, #0c0c0c 100%);
    /* W3C */
    box-shadow: inset 0 0 3px #ddd;
}

.dataTables_wrapper.no-footer .dataTables_scrollBody {
    border-bottom: 1px solid #ddd;
}

.daterangepicker.xdisplay {
    width: 228px;
}

.dataTables_wrapper > .row {
    overflow: auto !important; /*prevent datatables overflowing its container*/
}

.end_td_dataTables {
    text-align: center;
}

div.table-responsive > table {
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
}

div.dt-buttons > button.dt-button.buttons-collection > span.dt-down-arrow > i {
    font-size: 1rem;
}

button.dt-button > span > img.icon-svg {
    width: 18px;
    filter: opacity(90%);
}

button.dt-button > span > i[class^="icon"] {
    font-size: 1rem;
    vertical-align: middle;
    display: inline-flex;
}

.p-dt-button-top {
    padding: 5px 1em !important;
}

table.dataTable.no-footer {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

@media (max-width: 991px) {
    .table-responsive {
        overflow: auto;
    }

    #statistic-grid > tbody > tr.child > td > ul {
        width: 100%;
    }

    #statistic-grid > tbody > tr.child > td,
    #statistic-grid > tbody > tr > td:last-child {
        display: table-cell;
    }

    #statistic-grid i {
        font-size: 1.6em;
        margin: 4px;
    }

    #statistic-grid > tbody > tr.odd.parent > td {
        font-size: 0.8em;
    }
}


#statistic-grid-tab_filter,
#statistic-grid_filter {
    padding-left: 8px;
    background: #f8f8f8;
    border: 1px solid #ddd;
    border-radius: 5px;
}

#statistic-grid-tab_filter > label > input[type=search],
#statistic-grid_filter > label > input[type=search] {
    font-weight: normal !important;
}

#statistic-grid-tab_filter > label > input[type=search],
#statistic-grid_filter > label > input[type=search] {
    font-weight: normal;
}

#statistic-grid > tbody > tr > td {
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    word-wrap: break-word;
}

#statistic-grid i {
    color: #0D47A1;
}

#statistic-grid > tbody > tr > td:last-child {
    font-size: 0.9rem;
}

#statistic-grid > tbody > tr > td.dataTables_empty {
    display: table-cell;
}


#statistic-grid > tbody > tr > td > div.report {
    margin: auto;
    text-align: center;
    color: #ffffff;
    border-radius: 5px;
}

#statistic-grid > tbody > tr > td > div.green {
    background-color: #229954;
}

#statistic-grid > tbody > tr > td > div.yellow {
    background-color: #F1C40F;
}

#statistic-grid > tbody > tr > td > div.orange {
    background-color: #FB743C;
}

#statistic-grid > tbody > tr > td > div.red {
    background-color: #E20000;
}

#statistic-grid > tbody > tr > td > div.report {
    margin: 0;
    padding: 0;
}

#statistic-grid > tbody > tr > td > div.report > i {
    font-size: 1.2rem;
}

#statistic-grid > tbody > tr > td > div.rp > i {
    color: #EC7063FF;
}

#statistic-grid > tbody > tr > td > div.rc > i {
    color: #F1C40FFF;
}

#statistic-grid > tbody > tr > td > div.rca > i,
#statistic-grid > tbody > tr > td > div.rf > i {
    color: #229954FF;
}

#statistic-grid > tbody > tr > td > div.rcc > i {
    color: #AF7AC5FF;
}

#statistic-grid > tbody > tr > td > div.rct > i {
    color: #3498DBFF;
}

#statistic-grid > tbody > tr > td > div.rpi > i {
    color: #A93226FF;
}

#statistic-grid > tbody > tr > td > div.rs > i {
    color: #FB8F00FF;
}

#statistic-grid > tbody > tr > td > div.rno > i {
    color: #DDDDDDFF;
}


#statistic-grid-tab_filter > label,
#statistic-grid_filter > label {
    margin-bottom: 0;
}

#statistic-grid_filter > label > input[type=search] {
    font-weight: bold;
    border: none;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

table#statistic-grid {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

#statistic-grid > thead > tr > th {
    background-color: #FFF;
}

#statistic-grid > tbody > tr > td {
    border-top: unset;
}

table#statistic-grid tr.even {
    background-color: #FFF;
}

table#statistic-grid tr.odd {
    background-color: #F8F8F8;
}

table#statistic-grid tr.even:hover,
table#statistic-grid tr.odd:hover {
    background-color: #DDD;
}

#statistic-grid_paginate > span > a.paginate_button.current {
    color: #fff !important;
    background-color: #2fa4e7 !important;
    border: 1px solid #2fa4e7 !important;
}

.dt-button-spacer {
    padding-top: .5em;
}

.btn-agregar {
    background-color: #ff7100;
    background-repeat: no-repeat no-repeat;
    border: 1px solid #ff7100;
    border-radius: .25rem;
    box-sizing: border-box;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-family: "Helvetica Neue", Roboto, Arial, sans-serif;
    font-size: 1rem;
    line-height: 1.5;
    margin: 0 5px 2px 0;
    overflow: visible;
    padding: .25rem .75rem;
    text-align: center;
    vertical-align: middle;
}

.btn-agregar:hover {
    border: 1px solid #a14a06;
}

.btn-agregar > span > i {
    color: #FFF;
}