/* ==========================================================
 * 分类 Tab 滑块样式
 * ========================================================== */

/* 横向滚动容器 - 内容超出时才出现滚动条 */
.tab-slider-initialized {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important; /* 只在内容超出时显示滚动条 */
    white-space: nowrap !important;
    scroll-behavior: smooth !important;
    position: relative !important;
    -webkit-overflow-scrolling: touch !important;
    box-sizing: border-box !important;
    cursor: grab;
}

.tab-slider-initialized:active {
    cursor: grabbing;
}

/* 覆盖 star 自带 .no-scrollbar 的隐藏规则（桌面端显示细滚动条） */
.tab-slider-initialized.no-scrollbar {
    scrollbar-width: thin;
    scrollbar-color: rgba(153, 153, 153, 0.3) transparent;
}

/* 自定义滚动条 - WebKit */
.tab-slider-initialized::-webkit-scrollbar {
    height: 8px;
}

/* 覆盖 .no-scrollbar::-webkit-scrollbar 的 display:none */
.tab-slider-initialized.no-scrollbar::-webkit-scrollbar {
    display: block;
}

.tab-slider-initialized::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.1);
    border-radius: 3px;
}

/* 移动设备特殊处理 - 完全隐藏滚动条但保留触摸滑动功能 */
@media (max-width: 768px) {
    .tab-slider-initialized {
        overflow-x: auto !important;
        -ms-overflow-style: none !important;  /* IE and Edge */
        scrollbar-width: none !important;  /* Firefox */
        /* 额外边距处理，确保内容完全可见 */
        padding-bottom: 4px;
    }

    .tab-slider-initialized::-webkit-scrollbar,
    .tab-slider-initialized.no-scrollbar::-webkit-scrollbar {
        display: none !important;  /* 隐藏WebKit滚动条 */
        width: 0 !important;
        height: 0 !important;
    }

    .tab-slider-initialized::-webkit-scrollbar-track {
        display: none !important;
    }
}