.table-custom {
    --bs-table-bg: #212529; /* Dark blue background */
    --bs-table-color: #f8f9fa; /* Light text */
    --bs-table-hover-bg: ##212529; /* Slightly lighter background for hover */
    --bs-table-border-color: #495057; /* Grey border color */
}

.table-custom {
    background-color: var(--bs-table-bg);
    color: var(--bs-table-color);
}

.table-custom tbody tr:hover {
    background-color: var(--bs-table-hover-bg);
}

.table-custom th {
    /* border-color: var(--bs-table-border-color); */
    border-color: #212529;
    background-color: darkgray;
}

.table-custom td {
    /* border-color: var(--bs-table-border-color); */
    border-color: #212529;
    background-color: rgb(214, 212, 212);
}

.body-custom {
    font-family: sans-serif;
    background-color: #00081a;
    font-size: 12px; 
    /* background: #011951; */
}

.navbar {
    background-color: #f5f5f5;
}

.btn-custom-blue {
    background-color: #212529;
    color: #f2f2f2; 
    font-size: 12px; 
    font-family: sans-serif;
}

.btn-custom-gray {
    background-color: #6d6d6d;
    color: #f5f5f5; 
    font-size: 12px; 
    font-family: sans-serif;
    /* style="color: #f5f5f5; font-size: 16px; font-family: sans-serif; background-color: #6d6d6d;" */
}

@media (max-width: 768px) {
    .table {
        font-size: 0.7rem; /* Reduce font size */
    }
    .table th, .table td {
        white-space: nowrap; /* Prevent text wrapping */
        overflow: hidden; /* Hide overflow */
        text-overflow: ellipsis; /* Add ellipsis for overflow */
    }
}