/* 
   DataTables 2.x Styling Standard 
*/

/* 1. Hide default arrows and the manual arrows added previously */
table.dataTable thead th::before,
table.dataTable thead th::after,
th.sorting::after,
th.sorting_asc::after,
th.sorting_desc::after {
    display: none !important;
    content: "" !important;
}

/* 2. Completely disable and hide sorting icons for no-sort columns */
th.no-sort .dt-column-order,
th.no-sort::before,
th.no-sort::after {
    display: none !important;
}

/* 3. Center header text and position DataTables 2.x icons to the right */
table.dataTable thead th {
    position: relative !important;
    text-align: center !important;
    vertical-align: middle !important;
    padding-left: 30px !important; /* Balanced padding to keep text centered */
    padding-right: 30px !important;
}

.dt-column-order {
    position: absolute !important;
    right: 8px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    display: inline-flex !important;
}

/* 4. Hide sorting icons when table is empty */
thead.hide-sort-icons .dt-column-order {
    display: none !important;
}

/* 5. Custom empty state styling */
.dataTables_empty_custom td.dataTables_empty {
    padding: 60px 0 !important;
    font-size: 1.25rem !important;
    color: #6c757d !important;
    text-align: center !important;
    border: none !important;
}

.table-empty-state,
.table-empty-state thead,
.table-empty-state tbody,
.table-empty-state tr,
.table-empty-state td {
    border: none !important;
}