/****** There is a combined widget for Accordions and Tab Lists, which is why the styles for both are included ******/
 .accordion-header .accordion-button:not(.collapsed) {
     color:var(--brand-color1);
     background-color: var(--brand-color7) !important;
}
.sidebar .accordion-body {
     padding: 1rem 0 0 2.5rem;
     list-style: none;
}
 .sidebar .accordion-button:focus {
     z-index: 3;
     border-color: none;
     outline: 0;
     box-shadow: none;
}
 .sidebar .accordion-button:not(.collapsed) {
     color: var(--brand-color1)!important;
     background-color: var(--brand-color2)!important;
     box-shadow: none;
}
 .sidebar button.accordion-button.sidebar-title-top.collapsed {
     color: var(--brand-color4);
     background-color: var(--brand-color2);
}
 .sidebar .accordion-item:last-of-type .accordion-button.collapsed {
     border-bottom-right-radius: 0;
     border-bottom-left-radius: 0;
}
 .sidebar .accordion-item:last-of-type {
     border-bottom-right-radius: 0;
     border-bottom-left-radius: 0;
     border: 0;
}
 .sidebar .accordion-item:first-of-type .accordion-button {
     border-top-left-radius: 0;
     border-top-right-radius: 0;
}
 .sidebar .accordion-button::after {
     display: none;
}
 .sidebar .accordion-button:not(.collapsed)::after {
     display: none;
}
 .nav-tabs {
     flex-direction: column;
}
 .accordion-button::after {
     content: "+";
     background-image: none;
     transition: transform .2s ease-in-out;
     color: var(--brand-color3);
     scale: 2;
     text-align: center;
}
 .accordion-button:not(.collapsed)::after {
     content: "\2013";
     background-image: none;
     color: var(--brand-color3);
}
 .accordion-button:is(:hover,:focus){
     background: var(--brand-color7);
}
 .accordion-button:focus {
     z-index: 3;
     border-color: #86b7fe;
     outline: 0;
     box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .25);
}
 .accordion-item {
     background-color: #fff;
     border-top: 1px solid rgba(0, 0, 0, .125);
     border-bottom: 1px solid rgba(0, 0, 0, .125);
}
 .accordion-collapse {
     border-color: #86b7fe;
     outline: 0;
     box-shadow: 0 0 0 .12.5rem rgba(13, 110, 253, .25);
}
/*FAQ*/
 .faq-button-container {
     width: 50%;
     padding: .625rem;
}
 .accordion.faq .accordion-header {
     position: relative;
}

 .accordion-item:first-of-type {
     border-top-right-radius: 0 !important;
     border-top-left-radius: 0 !important;
}
 .accordion-item:first-of-type .accordion-button {
     border-top-left-radius: 0 !important;
     border-top-right-radius: 0 !important;
}
 .accordion-item:last-of-type .accordion-button.collapsed {
     border-top-right-radius: 0 !important;
     border-top-left-radius: 0 !important;
}
 .accordion-item:last-of-type {
     border-bottom-right-radius: 0 !important;
     border-bottom-left-radius: 0 !important;
}
 .accordion-item:last-of-type .accordion-collapse {
     border-bottom-right-radius: 0 !important;
     border-bottom-left-radius: 0 !important;
}
 .accordion-item:last-of-type .accordion-button.collapsed {
     border-bottom-right-radius: 0 !important;
     border-bottom-left-radius: 0 !important;
}
 .accordion-header button span {
     font-weight: 700;
}
/**************************** Tabs *****************************************/
 .nav-tabs .nav-link {
     border-top-left-radius: 0 !important;
     border-top-right-radius: 0 !important;
     color:var(--brand-color1);
}
 .nav-tabs .nav-link.active {
     background-color: var(--brand-color7) !important;
     font-weight: 700 !important;
     color: var(--brand-color1) !important;
     border-bottom: 1px solid var(--brand-color7) !important;
}
 .nav-tabs .nav-link.show.active {
     background-color: var(--brand-color7)!important;
     font-weight: 700 !important;
     color: var(--brand-color1) !important;
     border-bottom: 1px solid var(--brand-color7) !important;
}
 .tab-pane {
     border-right: 1px solid rgba(0, 0, 0, 0.125) !important;
     border-bottom: 1px solid rgba(0, 0, 0, 0.125) !important;
     border-left: 1px solid rgba(0, 0, 0, 0.125) !important;
}
@media (max-width: 991px) {
    .accordion-button:is(:hover,:focus){
         background: var(--brand-color7);
    }
}
@media (max-width: 768px) {
    .tab-content >.tab-pane {
         opacity: 1;
    }
}
@media (min-width: 768px) {
    /*Tabs To Accordions*/
    .nav-tabs {
         display: flex;
         flex-direction: row;
    }
     .tab-content .accordion {
         border: none;
    }
     .tab-content .accordion .accordion-header {
         display: none;
    }
     .tab-content .accordion .collapse {
         display: block;
    }
}