.option-selection {
    margin: 50px 0 100px 0;
}

.picking-sequence .value {
    font-size: 40px;
}

.btn.active {
    background-color: #007bff; /* Bootstrap primary color */
    color: white; /* Text color when active */
}

.btn:not(.active) {
    background-color: white; /* Default background color for inactive buttons */
    color: #007bff; /* Bootstrap primary color for text */
}

.btn:not(.active):hover {
    background-color: white; /* Light gray background on hover when not active */
    color: #007bff; /* Text color when hovered */
}

.btn:focus {
    box-shadow: none; /* Remove the focus outline */
    outline: none; /* Remove the default outline */
}

.picking-sequence .picking-values {
    padding: 0 5px;
}

/* Add this rule to center the text in the picking sequence cells */
.picking-sequence .col {
    text-align: center; /* Center the text horizontally */
    border: 1px solid #aaa; /* Add a solid black border */
    padding: 10px; /* Optional: Add some padding for better spacing */
}