/* Make the table blend with the dark background */
table.dataTable {
    background-color: transparent;
    color: #ffffff;
    border-collapse: collapse;
    width: 100%;
    font-family: inherit;
}

/* Header styling */
table.dataTable thead th {
    background-color: #1a1a40;
    color: #ffffff;
    padding: 12px;
    border-bottom: 2px solid #2a2a5a;
}

/* Body cell styling */
table.dataTable tbody td {
    background-color: transparent;
    color: #ffffff;
    padding: 10px;
    border-bottom: 1px solid #2a2a5a;
}

/* Hover effect */
table.dataTable tbody tr:hover {
    background-color: rgba(255, 255, 255, 0.05);
}

/* Pagination buttons */
.dataTables_wrapper .dataTables_paginate .paginate_button 
.dataTables_wrapper .dataTables_paginate .paginate_button .page-link {
    background: #1a1a40 !important;
    color: #ffffff !important;
    border: 1px solid #2a2a5a;
    padding: 5px 10px;
    margin: 2px;
    border-radius: 4px;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background: #2a2a5a;
}

/* Search box and length dropdown */
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
    background-color: #1a1a40;
    color: #ffffff;
    border: 1px solid #2a2a5a;
    padding: 5px;
    border-radius: 4px;
}

/* Responsive collapse for mobile */
@media screen and (max-width: 768px) {
    table.dataTable {
        font-size: 14px;
    }
    .dataTables_wrapper .dataTables_filter {
        float: none;
        text-align: left;
    }
}