/* =============== Bộ lọc =============== */
:root {
    /* chỉnh 1 chỗ là ăn cho tất cả panel */
    --filter-panel-max-h: 240px; 
}

/* Áp dụng cả desktop (sidebar) lẫn mobile (offcanvas) */
/* .accordion-body > .vstack {
    max-height: var(--filter-panel-max-h);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-gutter: stable;
} */
.accordion-body > .vstack {
    max-height: var(--filter-panel-max-h, 240px);
    overflow-y: auto;
    overflow-x: visible; /* QUAN TRỌNG: tránh bị cắt ngang */
    padding: .25rem .5rem .25rem .5rem; /* đệm hai bên để không cấn mép */
    box-sizing: border-box;
    scrollbar-gutter: stable; /* giữ chỗ cho scrollbar để không đè nội dung */
}

/*.accordion-collapse.show > .accordion-body {
    max-height: var(--filter-panel-max-h);
    overflow: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-gutter: stable;
}*/

/* Tối ưu item bên trong cho gọn */
.accordion-body .form-check {
    /* margin-bottom: .25rem;  */
    /* giảm khoảng cách giữa các checkbox */
    /* min-height: 0;  */
    /* loại padding min mặc định */
}

.accordion-body .form-check-label {
    display: block;
    white-space: nowrap; /* cắt 1 dòng nếu tên dài */
    overflow: hidden;
    text-overflow: ellipsis; 
}

/* (tuỳ chọn) Làm scrollbar gọn gàng hơn ở Chromium/WebKit */
.accordion-body > .vstack::-webkit-scrollbar {
    width: 8px;
}

.accordion-body > .vstack::-webkit-scrollbar-thumb {
    background: #c9cdd2;
    border-radius: 8px;
}

.accordion-body > .vstack:hover::-webkit-scrollbar-thumb {
    background: #b3b8be;
}