/* 区块：产品筛选面板（hover #e7f1ff，选中 #1e9fff） */

/* 区块：移动端开关按钮（窄屏显示） */
.filter-mobile-toggle {
    display: none;
    align-items: center;
    gap: .35rem;
    padding: .5rem 1rem;
    font-size: .875rem;
    color: #1e9fff;
    background: #fff;
    border: 1px solid #cfe4f7;
    border-radius: .5rem;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .04);
}

/* 区块：筛选面板容器 */
.filter-sidebar {
    position: sticky;
    /* 吸顶偏移需让开 sticky header（--header-h），与全站其他吸顶面板保持一致 */
    top: calc(var(--header-h, 72px) + 1rem);
    background: #fff;
    border: 1px solid #e6ebf1;
    border-radius: .75rem;
    box-shadow: 0 1px 3px rgba(15, 35, 60, .05);
    padding: .9rem 1rem .5rem;
}

/* 面板顶栏 */
.filter-sidebar__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding: .15rem 0 .6rem;
    border-bottom: 1px solid #eef2f7;
    margin-bottom: .35rem;
}

.filter-sidebar__title {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #1f2d3d;
}

.filter-clear {
    font-size: .8125rem;
    color: #1e9fff;
    text-decoration: none;
    white-space: nowrap;
}

.filter-clear:hover {
    color: #0d7fc4;
    text-decoration: underline;
}

/* 区块：筛选分组 */
.filter-group {
    border-bottom: 1px solid #f0f3f8;
    padding: .25rem 0;
}

.filter-group:last-child {
    border-bottom: none;
}

.filter-group__head {
    margin: 0;
}

.filter-group__toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    width: 100%;
    padding: .55rem .15rem;
    background: none;
    border: none;
    cursor: pointer;
    text-align: left;
    font-size: .9rem;
    color: #33445a;
    border-radius: .375rem;
}

.filter-group__toggle:hover {
    color: #1e9fff;
    background: #f6faff;
}

.filter-group__name {
    font-weight: 600;
}

.filter-group__unit {
    font-weight: 400;
    color: #9aa7b8;
    margin-left: .15rem;
}

.filter-group__arrow {
    color: #b6c1cf;
    font-size: .8rem;
    transition: transform .2s ease;
}

.filter-group--collapsed .filter-group__arrow {
    transform: rotate(-90deg);
}

.filter-group__body {
    padding: .15rem 0 .45rem;
}

/* 区块：选项列表（单选 / 多选共用） */
.filter-options {
    display: flex;
    flex-direction: column;
    gap: .15rem;
}

.filter-option {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .42rem .6rem;
    font-size: .875rem;
    color: #3d4d63;
    border-radius: .45rem;
    border: 1px solid transparent;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .15s ease, color .15s ease, border-color .15s ease;
    user-select: none;
}

.filter-option:hover {
    background: #e7f1ff;
    color: #1e9fff;
}

.filter-option__label {
    flex: 0 1 auto;
    min-width: 0;
    overflow-wrap: anywhere;
}

/* 计数 */
.filter-count {
    margin-left: auto;
    flex: 0 0 auto;
    font-size: .75rem;
    color: #9aa7b8;
    background: #f2f5f9;
    border-radius: 999px;
    padding: .05rem .5rem;
    line-height: 1.4;
}

/* 选中态 */
.filter-option--active {
    background: #e7f1ff;
    border-color: #c3def8;
    color: #1e9fff;
    font-weight: 500;
}

.filter-option--active .filter-count {
    background: #cfe4fb;
    color: #1e9fff;
}

/* 多选 checkbox 样式（原生 checkbox，accent 蓝色） */
.filter-option--check {
    padding-left: .75rem;
}

.filter-option__check {
    flex: 0 0 auto;
    accent-color: #1e9fff;
    width: 1rem;
    height: 1rem;
    margin: 0;
    cursor: pointer;
}

/* 区块：范围组 */
.filter-range {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    padding: .3rem 0 .2rem;
}

.filter-range__row {
    display: flex;
    align-items: center;
    gap: .4rem;
}

.filter-range__row .form-control {
    min-width: 0;
    font-size: .875rem;
    padding: .3rem .5rem;
    border-color: #dde4ec;
}

.filter-range__row .form-control:focus {
    border-color: #1e9fff;
    box-shadow: 0 0 0 .2rem rgba(30, 159, 255, .12);
}

.filter-range__sep {
    color: #b6c1cf;
    font-size: .875rem;
    flex: 0 0 auto;
}

.filter-range__apply {
    align-self: flex-end;
    font-size: .8125rem;
    padding: .25rem .9rem;
    border-radius: .4rem;
}

.filter-range__apply:hover {
    background: #1e9fff;
    border-color: #1e9fff;
    color: #fff;
}

/* 零结果选项：置灰不可点（计数联动后可能出现 count=0） */
.filter-option.is-disabled {
    color: #b8c2cf;
    background: transparent;
    cursor: not-allowed;
    pointer-events: none;
}

.filter-option.is-disabled .filter-count {
    color: #c3ccd8;
    background: #f5f7fa;
}

.filter-option.is-disabled .filter-option__check {
    cursor: not-allowed;
}

/* 区块：排序切换 */
.product-sort {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .15rem .35rem;
    font-size: .875rem;
}

.product-sort__label {
    color: #8b98a8;
}

.product-sort__item {
    color: #3d4d63;
    text-decoration: none;
    padding: .2rem .55rem;
    border-radius: .4rem;
    transition: background-color .15s ease, color .15s ease;
}

.product-sort__item:hover {
    background: #e7f1ff;
    color: #1e9fff;
}

.product-sort__item.is-active {
    color: #1e9fff;
    font-weight: 600;
    background: #e7f1ff;
}

/* 区块：窄屏处理 */
@media (max-width: 991.98px) {
    .filter-mobile-toggle {
        display: inline-flex;
    }

    .filter-sidebar {
        position: static;
        display: none;
        margin-top: .75rem;
    }

    .filter-sidebar.is-open {
        display: block;
    }

    /* 选型咨询卡片仅在 PC 侧栏展示：手机端整块隐藏，避免撑长页面（页脚仍有咨询入口） */
    .sidebar.product-sidebar {
        display: none;
    }
}

/* 区块：首块产品分类树（复用 channel-nav-tree，样式对齐筛选选项） */
.filter-sidebar .catalog-nav {
    display: flex;
    flex-direction: column;
    gap: .1rem;
}

/* 分类名占满剩余宽度，把计数推到最右 */
.filter-sidebar .catalog-nav .catalog-name {
    flex: 1 1 auto;
    min-width: 0;
    overflow-wrap: anywhere;
}

/* 零产品分类：置灰不可点（分支仍可展开以保留目录结构） */
.filter-sidebar .catalog-nav .channel-link.is-disabled {
    color: #b8c2cf;
    cursor: not-allowed;
    pointer-events: none;
}

.filter-sidebar .catalog-nav .channel-link.is-disabled i {
    color: #ccd5e0;
}

.filter-sidebar .catalog-nav .channel-link.is-disabled .filter-count {
    color: #c3ccd8;
    background: #f5f7fa;
}

/* 与参数筛选项保持一致的选中态（accent 蓝底白字） */
.filter-sidebar .catalog-nav .channel-link.active .filter-count {
    color: #fff;
    background: rgba(255, 255, 255, .25);
}

/* 面板按实际高度显示：高于视口时吸顶会挡住底部，filter.js 会加 is-tall 取消吸顶 */
.filter-sidebar.is-tall {
    position: static;
}