.accordion,
.sub-accordion {
    margin: 0;
    padding: 0;
    list-style: none;
    
}

.accordion__item {
    background: #e7e7e7;
    border-radius: 20px;
    margin-bottom: 5px;


}

.accordion__item:nth-child(odd) > :first-child:not(.accordion__link_active) { /*按鈕原始顏色*/
    color: #733621;
    background: #9fc5b8;
}

/* Modify accordion__link styles to target buttons */
.accordion__link {  
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
    padding: 10px 15px; 
    margin: 0; 

    font-weight: 500;
    font-size: 1.15rem;
    position: relative;
    color: #733621;
    text-decoration: none;
    border-radius: 20px;
    display: block;
    padding: 12px 50px 12px 20px;
    background: none;
    border: none;
    text-align: left;
    width: 100%;
    cursor: pointer;
    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);
    
}

.accordion__link:not(.accordion__link_active):after {
    position: absolute;
    content: "";
    border-top: 12px #0f0a09 solid;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    right: 22px;
    top: 50%;
    transform: translatey(-6px);
}

.accordion__link:not(.accordion__link_active):hover {
    opacity: .8;
    color: #fff;
    background: #b8b8b8;
}

.accordion__link:not(.accordion__link_active):hover:after {
    border-top: 12px #8ab5bd solid;
}

/* Styles for active accordion link */
.accordion__link_active {
    color: #ffffff;
    background-color: #37916b;
}

.accordion__link_active:after {
    position: absolute;
    content: "";
    border-bottom: 12px #ffffff solid;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    right: 22px;
    top: 50%;
    transform: translatey(-6px);
}

/* Styles for sub-accordion */
.sub-accordion {
    padding: 5px 20px;
    display: none;
    height: 0;
    overflow: hidden;
}

.sub-accordion__item {
    padding: 5px 0;
}

.accordion__link_active + ul {
    display: block;
    height: 100%;
}