/* Modern Enterprise DataTables Styling */
.card { box-shadow: 0 0 15px rgba(0,0,0,0.05); border: 1px solid #e9ecef; }

table.dataTable { font-family: inherit; border-collapse: collapse; margin-top: 15px !important; margin-bottom: 15px !important; }
table.dataTable thead th { 
    background-color: #f8f9fa; 
    border-bottom: 2px solid #dee2e6; 
    border-top: 1px solid #dee2e6;
    padding: 12px 30px 12px 15px; 
    color: #495057;
    font-size: 15px;
    font-weight: 600;
    position: relative;
}
table.dataTable tbody td { padding: 12px 15px; border-bottom: 1px solid #e9ecef; vertical-align: middle; font-size: 15px; color: #333; }
table.dataTable tbody tr { transition: background-color 0.2s; }
table.dataTable tbody tr:hover { background-color: #f1f7fd; }

/* Remove default DataTables sort images completely */
table.dataTable thead th,
table.dataTable thead td {
    background-image: none !important;
}
/* Hide any possible ::before pseudo-elements from DataTables default */
table.dataTable thead th::before,
table.dataTable thead td::before {
    display: none !important;
    content: none !important;
}

/* Custom FontAwesome Sorting Icons */
table.dataTable thead th.sorting::after,
table.dataTable thead th.sorting_asc::after,
table.dataTable thead th.sorting_desc::after {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 15px;
}
table.dataTable thead th.sorting::after { content: "\f0dc" !important; color: blue !important; opacity: 0.3 !important; } 
table.dataTable thead th.sorting_asc::after { content: "\f161" !important; color: blue !important; opacity: 0.7 !important; } 
table.dataTable thead th.sorting_desc::after { content: "\f160" !important; color: blue !important; opacity: 0.7 !important; }

/* Excel Export Button Styling */
.dt-buttons { margin-left: 15px; }
.dt-buttons .dt-button.buttons-excel {
    background: #fff !important;
    color: #198754 !important;
    border: 1px solid #198754 !important;
    border-radius: 4px !important;
    padding: 6px 14px !important;
    font-size: 14px !important;
    font-family: 'Sarabun', sans-serif !important;
    font-weight: 600;
    box-shadow: none !important;
    transition: all 0.2s !important;
}
.dt-buttons .dt-button.buttons-excel:hover { background: #198754 !important; color: #fff !important; }

/* Controls Layout */
.dt-top-row { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; flex-wrap: wrap; gap: 15px;}
.dt-top-left { display: flex; align-items: center; }

.dataTables_length select {
    border: 1px solid #ced4da;
    border-radius: 6px;
    padding: 6px 30px 6px 12px;
    font-family: 'Sarabun', sans-serif;
    outline: none;
    margin: 0 5px;
    background-color: #fff;
    transition: all 0.2s ease-in-out;
    appearance: auto;
    cursor: pointer;
    box-shadow: 0 2px 4px rgba(0,0,0,0.02);
}
.dataTables_length select:focus {
    border-color: #86b7fe;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}

.dataTables_filter input {
    border: 1px solid #ced4da;
    border-radius: 20px;
    padding: 8px 18px;
    outline: none;
    transition: all 0.3s ease-in-out;
    font-family: 'Sarabun', sans-serif;
    width: 250px;
    background-color: #f8f9fa;
    box-shadow: inset 0 1px 2px rgba(0,0,0,0.05);
}
.dataTables_filter input:focus { 
    border-color: #86b7fe; 
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
    background-color: #fff;
    width: 280px;
}

.dt-bottom-row { display: flex; justify-content: space-between; align-items: center; margin-top: 15px; font-size: 14px; color: #6c757d;}
.dataTables_paginate .paginate_button { padding: 5px 10px !important; margin: 0 2px; border-radius: 4px; border: 1px solid #dee2e6 !important; background: #fff !important; color: #007bff !important; cursor: pointer; }
.dataTables_paginate .paginate_button:hover { background: #e9ecef !important; color: #0056b3 !important; }
.dataTables_paginate .paginate_button.current { background: #007bff !important; color: #fff !important; border-color: #007bff !important; font-weight: bold;}