/* =========================
   DataTables custom CSS
   Bootstrap 5 / Tabler integration
   ========================= */

/* Table base */
table.dataTable {
    margin: 0 auto;
    width: 100%;
    clear: both;
    border-collapse: collapse;
}

table.dataTable thead th,
table.dataTable tfoot th {
    font-weight: bold;
    cursor: pointer;
    padding: 0.5rem 1rem;
    border-bottom: 1px solid #000;
}

table.dataTable tfoot th {
    border-top: 1px solid #000;
}

table.dataTable td {
    padding: 0.5rem 0.75rem;
}

table.dataTable td.center,
table.dataTable td.dataTables_empty {
    text-align: center;
}

/* Row colors */
table.dataTable tr.odd {
    background-color: #E2E4FF;
}

table.dataTable tr.even {
    background-color: #fff;
}

/* Sorting highlighting */
table.dataTable tr.odd td.sorting_1 { background-color: #D3D6FF; }
table.dataTable tr.odd td.sorting_2 { background-color: #DADCFF; }
table.dataTable tr.odd td.sorting_3 { background-color: #E0E2FF; }

table.dataTable tr.even td.sorting_1 { background-color: #EAEBFF; }
table.dataTable tr.even td.sorting_2 { background-color: #F2F3FF; }
table.dataTable tr.even td.sorting_3 { background-color: #F9F9FF; }

/* Wrapper */
.dataTables_wrapper {
    position: relative;
    clear: both;
}

/* Page length menu */
.dataTables_length {
    float: left;
}

/* Filter */
.dataTables_filter {
    float: right;
    text-align: right;
}

/* Table information */
.dataTables_info {
    float: left;
    clear: both;
}

/* Pagination */
.dataTables_paginate {
    float: right;
    text-align: right;
}

/* Pagination buttons (Bootstrap style) */
.paginate_button, .paginate_active {
    border-radius: 5px;
    padding: 0.25rem 0.5rem;
    margin: 0 2px;
    cursor: pointer;
    text-decoration: none;
    color: #333 !important;
}

.paginate_button {
    background-color: #ddd;
}

.paginate_button:hover {
    background-color: #ccc;
}

.paginate_active {
    background-color: #99B3FF;
    color: #fff !important;
}

/* Processing indicator */
.dataTables_processing {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 250px;
    height: 30px;
    margin-left: -125px;
    margin-top: -15px;
    padding: 0.5rem 0;
    border: 1px solid #ddd;
    text-align: center;
    color: #999;
    font-size: 14px;
    background-color: #fff;
}

/* Sorting indicators (Bootstrap arrows) */
table.dataTable thead th.sorting:after,
table.dataTable thead th.sorting_asc:after,
table.dataTable thead th.sorting_desc:after {
    content: "\f0dc"; /* FontAwesome sort icon */
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    float: right;
    margin-left: 5px;
    color: #999;
}

table.dataTable thead th.sorting_asc:after {
    content: "\f0de"; /* arrow up */
}

table.dataTable thead th.sorting_desc:after {
    content: "\f0dd"; /* arrow down */
}

/* Scrolling */
.dataTables_scroll {
    clear: both;
}

.dataTables_scrollBody {
    -webkit-overflow-scrolling: touch;
}