/* Category Toggle */

.category--toggle .category__title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 60px;
    background-color: var(--clr-brand-primary);
    margin-bottom: 0;
}

.category--toggle .category__title span {
    font-weight: 600;
    font-size: clamp(21px, 2.9vw, 24px);
    color: var(--clr-text-white);
    text-transform: capitalize;
}

.category--toggle .category__main {
    background-color: #fff;
}

.category--toggle .category__list {
    width: 100%;
    list-style: none;
    padding-left: 0;
    margin-bottom: 0;
}

.category--toggle .category__list:not(.level-1) {
    display: none;
    border-left: 2px solid var(--clr-brand-primary);
}

.category--toggle .category__item,
.category--toggle .category__name,
.category--toggle .category__btn {
    -webkit-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

.category--toggle .category__item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0.5rem 0.75rem;
}

.category--toggle .category__list.level-1>.category__item {
    padding: 0.8125rem 1.25rem 0.875rem;
}

.category--toggle .category__list.level-1 .category__item:not(:last-child) {
    border-bottom: 1px solid #FCDFE0;
}

.category--toggle .category__list.level-1>.category__item.active {
    padding-bottom: 0.3125rem;
}

.category--toggle .category__name {
    --line-clamp: 1;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    font-weight: 500;
    font-size: clamp(16px, 2.1vw, 18px);
    color: var(--clr-text-secondary);
    text-transform: capitalize;
}

.category--toggle .category__list:not(.level-1) .category__name {
    font-size: clamp(15px, 2.1vw, 17px);
}

.category--toggle .category__item:has(.category__btn)>.category__name {
    padding-right: 0.5rem;
}

.category--toggle .category__btn {
    --block-w: 26px;
    --block-h: 24px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: var(--block-w);
    height: var(--block-h);
    font-size: 18px;
    color: #C6C6C6;
    background-color: transparent;
}

.category--toggle .category__item.active>.category__btn {
    -webkit-transform: rotateZ(180deg);
    -moz-transform: rotateZ(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotateZ(180deg);
    transform: rotateZ(180deg);
}

.category--toggle .category__name:hover,
.category--toggle .category__btn:hover,
.category--toggle .category__item.active>.category__name,
.category--toggle .category__item.active>.category__btn {
    color: var(--clr-brand-primary);
}