/* 1. Style the title (label) of CHECKBOX filters to be a clickable area */
.form-group.checkboxes-filter > label {
    cursor: pointer;
    display: block;
    position: relative;
    padding-right: 25px; 
}

/* 2. Add an indicator (caret/arrow) to the CHECKBOX filter titles */
.form-group.checkboxes-filter > label::after {
    content: '▼'; /* Down arrow (closed state) */
    position: absolute;
    right: 5px;
    top: 50%;
    transform: translateY(-50%);
    transition: transform 0.3s ease;
    font-size: 10px;
}

/* 3. Rotate the indicator when the CHECKBOX filter is open */
.form-group.checkboxes-filter.filter-open > label::after {
    transform: translateY(-50%) rotate(180deg); /* Up arrow (open state) */
}

/* 4. Hide the content (the <ul> tags-nav) of CHECKBOX filters by default */
.form-group.checkboxes-filter .tags-nav {
    display: none !important;
}

/* 5. Show the content when the 'filter-open' class is applied */
.form-group.checkboxes-filter.filter-open .tags-nav {
    display: block !important;
}