/* Make DataTables slideable (horizontally scrollable) on mobile */
@media (max-width: 767px) {
    /* Target the container wrapping the table inside DataTables wrapper */
    .dataTables_wrapper > .row:nth-child(2) > .col-sm-12,
    .dataTables_wrapper > .row:nth-child(2) > .col-md-12,
    .table-responsive {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        display: block !important;
        width: 100% !important;
        border: none !important;
    }
    
    .dataTables_wrapper .table,
    .table-responsive .table {
        white-space: nowrap !important;
        width: 100% !important;
        /* Ensure table is wide enough to trigger scrolling */
        min-width: 700px !important; 
        max-width: none !important;
    }
}