body {
    font-family: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, sans-serif;
}
@media (max-width: 768px) {
    .offcanvas-bottom {
        height: 50vh !important;
    }
}

@media (min-width: 769px) {
    .offcanvas-bottom {
        height: 35vh !important;
    }
}
.table th {
    font-weight: 600;
    font-size: 0.8125rem;
    font-size: 0.75rem;
    text-transform: uppercase;
    vertical-align: middle;
    color: #6c757d;
}

.table td {
    font-size: 0.9375rem;
    font-size: 0.9rem;
    vertical-align: middle;
    font-weight: bold;
}

h1 {
    font-weight: 600;
    font-size: 1.75rem;
}

.player-avatar {
    width: 32px;
    height: 32px;
    /*border-radius: 50%;
    background-color: #e9ecef;*/
}

.form-select {
    min-width: 200px;
}

.table th {
    font-weight: 500;
    color: #6c757d;
}

.table td {
    vertical-align: middle;
}

.text-danger {
    color: #dc3545 !important;
}

.btn-success {
    background-color: #2E856E;
    border-color: #2E856E;
}

.btn-success:hover {
    background-color: #246B58;
    border-color: #246B58;
}

#leaderboard td:first-child,
#leaderboard th:first-child {
    padding-left: 1rem;
    padding-right: 1rem;
    max-width: 40px;
    text-align: center;
}

/* Add these styles to create the vertical separator */
#leaderboard th:nth-child(4),
#leaderboard td:nth-child(4) {
    border-right: 1px solid #dee2e6;
}

#scores th:nth-child(4),
#scores td:nth-child(4) {
    border-right: 1px solid #dee2e6;
}

/* New separator between NOV and AVG columns */
#leaderboard th:nth-child(11),
#leaderboard td:nth-child(11) {
    border-right: 1px solid #dee2e6;
}

#scores th:nth-child(2),
#scores td:nth-child(2), 
#scores th:nth-child(7),
#scores td:nth-child(7) {
    border-right: 1px solid #dee2e6;
}


#scores th:nth-child(3),
#scores td:nth-child(3) {
    padding-left: 2rem;
}