:root {
    --base-font-size: 20px;
}


.offcanvas-end {
    width: 100vw !important;
    max-width: 500px !important;
}

@media (min-width: 500px) {
    .offcanvas-end {
        width: 500px !important;
    }
}



.accordion-button {
    background-color: #f8f9fa;
    color: #333;
}

    .accordion-button:not(.collapsed) {
        background-color: var(--gray-darkest);
        color: var(--white);
    }

    /* Remove or Change Focus Glow */
    .accordion-button:focus {
        box-shadow: 0 0 0 0.25rem var(--primary-color);
        box-shadow:none;
    }

    /* Hover State for Better UX */
    .accordion-button:hover {
        background-color: var(--gray-dark);
        color: #fff;
    }