/****** There is a combined widget for Accordions and Tab Lists, which is why the styles for both are included ******/
/**********************/
 .accordion {
     background-color: var(--brand-color2) !important;
 }
 .accordion-button {
    /*** set this value to the height of the template header + mega menu on your site ***/
     scroll-margin-top: 150px;
}
.accordion .accordion-button {
    color: var(--brand-color1);
    background-color: var(--brand-color2);
}
 .accordion-header .accordion-button:not(.collapsed) {
     color:var(--brand-color1);
     background-color: var(--brand-color2) !important;
}
h1.accordion-header, h2.accordion-header, h3.accordion-header, h4.accordion-header, h5.accordion-header, h6.accordion-header {
    margin-top: 0px !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;
}
.tabs-only .tab-content {
    padding: 0px;
}
 .accordion-button::after {
     content: "\f078";
     font-family: 'FontAwesome';
     background-image: none;
     transition: transform .2s ease-in-out;
     color: var(--brand-color1);
     scale: 2;
     text-align: center;
     font-size: 10px;
}
 .accordion-button:not(.collapsed)::after {
     content: "\f107";
     font-family: 'FontAwesome';
     background-image: none;
     color: var(--brand-color1);
}
 .accordion-button:is(:hover,:focus){
     background: var(--brand-color2);
}
 .accordion-button:focus,  .accordion-button:focus-visible,  .accordion-button:hover {
     z-index: 3;
     outline: 2px solid var(--brand-color1);
     background-color: var(--brand-color2) !important;
     box-shadow: none;
}
 .accordion-item {
     background-color: var(--brand-color2);
     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: none;
     background-color: var(--brand-color4);

}
/*FAQ*/
 .faq-button-container {
     width: 50%;
     padding: .625rem;
}
 .accordion.faq .accordion-header {
     position: relative;
}
.faq .accordion-header i {
    margin-right: 20px;
}
.faq .h1 button.accordion-button, .faq .h2 button.accordion-button, 
.faq .h3 button.accordion-button, .faq .h4 button.accordion-button,
.faq .h5 button.accordion-button, .faq .h6 button.accordion-button,
.faq h1 button.accordion-button, .faq h2 button.accordion-button,
.faq h3 button.accordion-button, .faq h4 button.accordion-button,
.faq h5 button.accordion-button, .faq h6 button.accordion-button {
    margin-top: 0rem;
    margin-bottom: 0rem;
}
.accordion.faq .accordion-header {
    border: 2px solid rgba(84, 84, 84, .05);
}
 .faq .accordion-button:focus,  .faq .accordion-button:focus-visible,  .faq .accordion-button:hover {
     z-index: 3;
     outline: 2px solid var(--brand-color1);
     background-color: var(--brand-color2) !important;
     box-shadow: none;
}
 .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, h1.accordion-header button span, h2.accordion-header button span,
h3.accordion-header button span, h4.accordion-header button span, h5.accordion-header button span,
h6.accordion-header button span{
    font-weight: 500;
    font-size: 18px;
}
h1.accordion-button::after, h2.accordion-button::after,
h3.accordion-button::after, h4.accordion-button::after,
h5.accordion-button::after, h6.accordion-button::after,
h1.accordion-button:not(.collapsed), h2.accordion-button:not(.collapsed),
h3.accordion-button:not(.collapsed), h4.accordion-button:not(.collapsed),
h5.accordion-button:not(.collapsed), h6.accordion-button:not(.collapsed)
{
    font-weight: 500 !important;
    font-size: 18px !important;
}

 .accordion-button:is(:hover,:focus){
     background: var(--brand-color2);
}
 .accordion-button:focus,  .accordion-button:focus-visible,  .accordion-button:hover {
     z-index: 3;
     outline: 2px solid var(--brand-color1);
     background-color: var(--brand-color2) !important;
     box-shadow: none;
}

/**************************** Tabs *****************************************/
 .tabs-only button:hover, .tabs-only button:focus-visible, .tabs-only button:focus {
    outline: 3px solid var(--brand-color5);
    outline-offset: -3px;
    box-shadow: none !important;
    background-color: transparent !important;
}
 .nav-tabs .nav-link {
     border-top-left-radius: 0 !important;
     border-top-right-radius: 0 !important;
     color:var(--brand-color1);
     font-size: 18px;
}
 .nav-tabs .nav-link.active {
     background-color: var(--brand-color2) !important;
     font-weight: 500 !important;
     color: var(--brand-color1) !important;
     border-bottom: 1px solid var(--brand-color7) !important;
     font-size: 18px;
     box-shadow: 0 0 0 .15rem rgba(var(--brand-color1-rgb), .25) !important;
}
 .nav-tabs .nav-link.show.active {
     background-color: var(--brand-color2)!important;
     font-weight: 500 !important;
     color: var(--brand-color1) !important;
     border-bottom: 1px solid var(--brand-color7) !important;
     font-size: 18px;
     box-shadow: 0 0 0 .15rem rgba(var(--brand-color1-rgb), .25) !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;
     border-radius: 0px;
}
.tab-content .card-body:focus-visible {
    outline: 3px solid var(--brand-color1);
}
 @media (max-width: 991px) {
     .accordion-button:is(:hover,:focus){
         background: var(--brand-color2);
    }
}
 @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;
    }
}