.highlight {
    background-color: #efefef;
}

.mouseover-highlight {
    background-color: #3f93d4;
    color: #000000; /* Default text color */
}

.table th,
.table td {
    vertical-align: middle;
    text-align: left;
}

.table thead th {
    vertical-align: bottom;
    border-bottom: 2px solid #dee2e6;
    text-transform: capitalize;
}

.table tr.mouseover-highlight {
    background-color: inherit; /* Default background color */
    color: inherit; /* Default text color */
}

.table tr.mouseover-highlight:hover {
    background-color: #3f93d4; /* Hover background color */
    color: #ffffff; /* Hover text color */
}

.table tr.mouseover-highlight:hover td,
.table tr.mouseover-highlight:hover th {
    color: #ffffff; /* Ensure text color changes to white for all cells in the row */
}