/* 首页主区：对齐 moban4-beikong Tailwind + home.scss，作用域 #index-container */
/* 中间区与 /categoryAll 一致：layout-container flex + 全宽 .home-page-body 铺底（同 .cat-body） */

:root {
    /* 与全站 style.css / 后台 theme 注入的 --cat-primary 一致；勿写死十六进制，否则促销 Tab 等 color-mix 不随主题变 */
    --primary-color: var(--cat-primary, #4066b8);
    --danger-color: #c80000;
}

.home-page .layout-container {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

html,
body.home-page {
    background: var(--cat-bg);
}

.home-app-main {
    flex: 1;
    min-height: calc(100vh - 301px - 100px);
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    min-width: 0;
}

/* 横向 100% 铺色，对应分类页 .cat-body（版心在 #index-container） */
.home-page-body {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    background: var(--cat-bg);
    overflow: hidden;
}

@media (max-width: 991.98px) {
    .home-app-main {
        min-height: 0;
    }
}

#index-container {
    position: relative;
    max-width: var(--cat-max, 1320px);
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 10px;
    padding-right: 10px;
    box-sizing: border-box;
}

#index-container .text-primary {
    color: var(--primary-color);
}

#index-container .text-danger {
    color: var(--danger-color);
}

#index-container .bg-fff {
    background-color: #fff;
}

#index-container .text-333 {
    color: #333;
}

#index-container .text-999 {
    color: #999;
}

#index-container .text-afafaf {
    color: #afafaf;
}

#index-container .text-14 {
    font-size: 14px;
}

#index-container .font-400 {
    font-weight: 400;
}

#index-container .font-700 {
    font-weight: 700;
}

#index-container .rounded-6 {
    border-radius: 6px;
}

#index-container .rounded-12 {
    border-radius: 12px;
}

#index-container .obj-cover {
    object-fit: cover;
}

#index-container .obj-contain {
    object-fit: contain;
}

#index-container .line-clamp-1 {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

#index-container .line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

#index-container .flex {
    display: flex;
}

#index-container .flex-1 {
    flex: 1 1 0%;
}

#index-container .flex-col {
    flex-direction: column;
}

#index-container .flex-wrap {
    flex-wrap: wrap;
}

#index-container .items-center {
    align-items: center;
}

#index-container .justify-center {
    justify-content: center;
}

#index-container .justify-between {
    justify-content: space-between;
}

#index-container .justify-around {
    justify-content: space-around;
}

#index-container .text-center {
    text-align: center;
}

#index-container .relative {
    position: relative;
}

#index-container .overflow-hidden {
    overflow: hidden;
}

#index-container .overflow-y-auto {
    overflow-y: auto;
}

#index-container .w-full {
    width: 100%;
}

#index-container .h-full {
    height: 100%;
}

#index-container .shrink-0 {
    flex-shrink: 0;
}

#index-container .hidden {
    display: none;
}

#index-container .cart-box {
    background-color: #fff;
    border-radius: 6px;
    box-shadow: 0 0 15px -7px #ccc;
    transition: box-shadow 0.3s ease;
}

#index-container .product-card-box {
    border: 1px solid hsla(0, 0%, 83%, 0.3);
    border-radius: 6px;
    transform: scale(0.95);
    transition: all 0.3s ease;
}

#index-container .product-card-box:hover {
    box-shadow: -2px 2px 9px #0000001a;
}

#index-container .mx-_interval {
    margin-left: -10px;
    margin-right: -10px;
}

#index-container .mx-neg5 {
    margin-left: -5px;
    margin-right: -5px;
}

#index-container .mb-20 {
    margin-bottom: 20px;
}

#index-container .mb-30 {
    margin-bottom: 30px;
}

#index-container .mb-6 {
    margin-bottom: 6px;
}

#index-container .mb-interval {
    margin-bottom: 10px;
}

#index-container .ml-interval {
    margin-left: 10px;
}

#index-container .py-interval {
    padding-top: 10px;
    padding-bottom: 10px;
}

#index-container .px-interval {
    padding-left: 0;
    padding-right: 10px;
}

#index-container .pt-interval {
    padding-top: 10px;
}

#index-container .px-5 {
    padding-left: 5px;
    padding-right: 5px;
}

#index-container .px-25 {
    padding-left: 25px;
    padding-right: 25px;
}

#index-container .py-20 {
    padding-top: 20px;
    padding-bottom: 20px;
}

#index-container .pb-8 {
    padding-bottom: 8px;
}

#index-container .pb-40 {
    padding-bottom: 40px;
}

#index-container .pt-15 {
    padding-top: 15px;
}

#index-container .p-10-5 {
    padding: 10px 5px;
}

#index-container .p-23-30-20 {
    padding: 23px 30px 20px;
}

#index-container .px-16 {
    padding-left: 16px;
    padding-right: 16px;
}

#index-container .w-50 {
    width: 50%;
}

#index-container .w-240 {
    width: 240px;
}

#index-container .w-260 {
    width: 260px;
}

#index-container .w-223 {
    width: 223px;
}

#index-container .w-120 {
    width: 120px;
}

#index-container .w-76 {
    width: 76px;
}

#index-container .w-150 {
    width: 150px;
}

#index-container .w-60 {
    width: 60px;
}

#index-container .w-151 {
    width: 151px;
}

#index-container .h-345 {
    height: 345px;
}

#index-container .h-385 {
    height: 385px;
}

/* 首页右侧工具条：去除 ul 默认左内边距 */
#index-container .tool-list {
    padding-left: 0;
}

#index-container .h-410 {
    height: 410px;
}

#index-container .h-412 {
    height: 412px;
}

#index-container .h-276 {
    height: 276px;
}

#index-container .h-120 {
    height: 120px;
}

#index-container .h-76 {
    height: 76px;
}

#index-container .h-102 {
    height: 102px;
}

#index-container .h-38 {
    height: 38px;
}

#index-container .h-64 {
    height: 64px;
}

#index-container .h-80 {
    height: 80px;
}

#index-container .h-130 {
    height: 130px;
}

#index-container .h-167 {
    height: 167px;
}

#index-container .h-30 {
    min-height: 30px;
}

#index-container .h-20 {
    min-height: 20px;
}

#index-container .h-16 {
    min-height: 16px;
}

#index-container .h-50 {
    height: 50%;
}

#index-container .h-60 {
    height: 60px;
}

#index-container .h-100 {
    height: 100px;
}

#index-container .h-40px {
    min-height: 40px;
}

#index-container .min-h-300 {
    min-height: 300px;
}

#index-container .leading-30 {
    line-height: 30px;
}

#index-container .leading-16 {
    line-height: 16px;
}

#index-container .z-5 {
    z-index: 5;
}

#index-container .z-20 {
    z-index: 20;
}

/* 顶行 */
#index-container .home-top-box > div:not(:nth-child(2)) {
    padding-left: 10px;
    padding-right: 10px;
}

#index-container .home-top-box .category-box {
    padding-left: 0;
}

#index-container .home-top-box {
    align-items: flex-start;
}

/* 左侧分类栏：参考 moban4 竖向列表 — 白底、左对齐、长文案省略号 */
#index-container .category-box {
    flex-shrink: 0;
    color: #333;
    font-size: 14px;
    line-height: 1.5;
    font-family: Roboto, "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
}

#index-container .category-list-box {
    width: 310px;
    height: 420px;
    display: flex;
    flex-direction: column;
    position: relative;
    list-style: none;
    margin: 0;
    padding: 8px 0;
    box-sizing: border-box;
    background-color: #fff;
    border-radius: 0 0 6px 6px;
    /* visible：子级悬浮层向右伸出；定位包含块为 ul，top:0 与列表顶对齐且不随当前行变化 */
    overflow: visible;
    z-index: 20;
}

#index-container .category-list > .group {
    flex-shrink: 0;
    min-width: 0;
    margin-bottom: 5px;
}

#index-container .category-list > .group:last-child {
    margin-bottom: 0;
}

#index-container .category-item {
    display: block;
    box-sizing: border-box;
    /* 字号 14px 不变；垂直方向约缩减 40%（原约 38px → ~23px） */
    padding: 4px 12px;
    width: 100%;
    max-width: 100%;
    margin: 0;
    color: #333;
    font-size: 14px;
    line-height: 15px;
    font-weight: 400;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: background-color 0.15s ease, color 0.15s ease;
}

#index-container .category-item:hover {
    background-color: #f4f4f4;
    color: var(--primary-color);
}

/* 相对 .category-list-box 定位：top 恒为列表顶部，不随当前悬停的 li 垂直偏移 */
#index-container .children-box {
    height: 420px;
    width: 990px;
    z-index: 100;
    padding: 20px 0 20px 20px;
    position: absolute;
    left: 100%;
    top: 0;
    background-color: #fff;
    box-shadow: 1px 0 6px #00000029;
}

#index-container .group {
    position: static;
}

#index-container .group:hover .group-hover-block,
#index-container .group:focus-within .group-hover-block {
    display: block;
}

/* 分类浮层内：二级链接横向排列 + 统一间距 */
#index-container .home-cate-flyout-links {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
    align-items: flex-start;
    gap: 7px 24px;
}

#index-container .home-cate-flyout-cell {
    flex: 0 0 auto;
    box-sizing: border-box;
    max-width: none;
}

#index-container .home-cate-flyout-link {
    display: block;
    padding: 6px 4px;
    white-space: nowrap;
}

/* 首页顶栏中间轮播：高度改为自适应（= pad-top 30 + swiper 340 + pad-bottom 10 = 380）。
 * 不再硬编码 height/max-height，未来调整内部高度（swiper 或 banner-pad）wrap 会自动跟随。
 * position:relative 让下方 .swiper-pagination 可以锚定到 wrap 做绝对定位 */
#index-container .home-banner-wrap {
    flex: 1 1 0%;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    align-self: flex-start;
    position: relative;
}

/* wrap 改为自适应高度后，swiper 必须有显式高度才能让内部 .swiper-wrapper/.slide/.aspect 的
 * height:100% 链路解析出有效值。
 * 370 = 图片显示高度（banner-pad 30/25/15 的上下内边距已排除） */
#index-container .home-banner-swiper {
    flex: 0 0 auto;
    min-height: 0;
    width: 100%;
    height: 370px;
    overflow: hidden;
}

#index-container .home-banner-swiper .swiper-wrapper {
    height: 100%;
}

#index-container .home-banner-slide {
    height: 100%;
    box-sizing: border-box;
}

/* 固定高度容器内铺满 + 圆角裁切（文案仍在图上方，与图同区域） */
#index-container .home-banner-aspect {
    display: block;
    padding: 0 !important;
    height: 100%;
    min-height: 0;
    border-radius: 12px;
    overflow: hidden;
}

#index-container .home-banner-aspect .banner-img {
    object-fit: cover;
    display: flex;
    flex-wrap: wrap;
}

/* 分页圆点从 #banner-swiper 内部（图片之上）移出到 wrap 下方，
 * 作为 .home-banner-wrap 的直接子元素，绝对定位锚定 wrap 底部，
 * 不会被 #banner-swiper 的 overflow:hidden 裁掉；
 * 左右内缩 25px 与 .banner-pad 的左右内边距对齐，使宽度 = 图片宽度 660 而非 wrap 的 710 */
#index-container .home-banner-wrap > .swiper-pagination.banner-pagination {
    position: absolute;
    left: 25px;
    right: 25px;
    bottom: -1px;
    width: auto;
    text-align: center;
    z-index: 20;
}

/* 博客卡片辅助排版 */
#index-container .gap-8 {
    gap: 8px;
}

#index-container .gap-15 {
    gap: 15px;
}

#index-container .items-start {
    align-items: flex-start;
}

#index-container .min-w-0 {
    min-width: 0;
}

#index-container .mt-4 {
    margin-top: 4px;
}

#index-container .blog-meta {
    font-size: 12px;
    line-height: 1.3;
}

#index-container .dropdown-item {
    color: #333;
    font-size: 14px;
}

#index-container .dropdown-item:hover {
    color: var(--primary-color);
}

#index-container .children-scroll {
    height: calc(100% - 44px);
}

#index-container .scroll-box-primary::-webkit-scrollbar-thumb {
    background-color: var(--primary-color);
    border-radius: 8px;
}

#index-container .banner-pad {
    /* 左右 25（配合 wrap 710，使图片可视宽度保持 660）；
     * 底部 15（为分页圆点预留空间） */
    padding: 30px 25px 15px;
}

/* 默认比例盒（其它页若复用 .banner-aspect）；首页顶栏用 .home-banner-aspect 覆盖 */
#index-container .banner-aspect {
    padding: 56.35% 0 0 0;
}

#index-container .banner-img {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

#index-container #banner-swiper {
    position: relative;
}

#index-container .tool-item {
    height: 115px;
    display: flex;
    justify-content: space-between;
    padding: 16px;
    color: #333;
}

#index-container .tool-item .info-box {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    height: 100%;
}

#index-container .tool-item ._more {
    color: var(--primary-color);
}

#index-container .tool-item ._more a {
    font-style: normal;
    font-size: 12px;
}

#index-container .tool-item ._more a::after {
    content: ' >';
    margin-left: 2px;
}

#index-container .tool-item .image-box {
    display: flex;
    align-items: center;
    height: 100%;
}

#index-container .tool-item .image-box img {
    width: 53px;
    height: 55px;
}

/* 服务条 */
#index-container .info-card-item {
    position: relative;
    width: 25%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #333;
    line-height: 20px;
    font-size: 14px;
}

#index-container .info-card-item:not(:last-child) {
    border-right: 1px solid #f1f1f1;
}

#index-container .info-card-item img {
    width: 48px;
    height: 32px;
    margin-right: 16px;
    display: block;
}

#index-container .info-card-item .text {
    width: 190px;
    display: flex;
    align-items: center;
}

#index-container .index-title {
    font-size: 30px;
    color: #333;
    line-height: 55px;
    font-weight: 600;
}

/* Banner 分页 pill（分页已移出 #banner-swiper，改用 .banner-pagination 作为选择器前缀） */
#index-container .banner-pagination .swiper-pagination-bullet {
    border-radius: 10px !important;
    height: 5px !important;
    width: 20px !important;
    opacity: 1;
    background: #ccc;
}

#index-container .banner-pagination .swiper-pagination-bullet-active {
    background: var(--primary-color);
}

/* Swiper 导航按钮（对齐 moban4 base.scss） */
#index-container .swiper-button-prev,
#index-container .swiper-button-next {
    background-color: #3333331a;
    pointer-events: auto;
    transition: all 0.3s;
    border-radius: 6px 0 0 6px;
}

#index-container .swiper-button-prev::after,
#index-container .swiper-button-next::after {
    color: #333333;
    font-size: 16px;
}

#index-container .swiper-button-prev {
    border-radius: 0 6px 6px 0;
    left: 0;
}

#index-container .swiper-button-next {
    right: 0;
}

#index-container .index-new-arrivals-product .na-next,
#index-container .index-new-arrivals-product .na-prev {
    transform: translateY(-20px);
}

/* 热卖区分页（左侧竖条区域） */
#index-container .index-hot-products .hot-pagination {
    bottom: 50px;
    left: 0;
    width: 260px;
}

#index-container .index-hot-products .hot-pagination .swiper-pagination-bullet {
    background-color: #fff;
    border-radius: 7px;
    height: 10px;
    margin: 0 8px;
    width: 10px;
    opacity: 1;
}

#index-container .index-hot-products .hot-pagination .swiper-pagination-bullet-active {
    background-color: #fff;
    box-shadow: 0 0 0 5px rgba(255, 255, 255, 0.2);
}

/* 制造商网格 */
#index-container .w-mobile-card {
    width: 50%;
}

@media (min-width: 768px) {
    #index-container .w-mobile-card {
        width: 33.3333%;
    }
}

@media (min-width: 1024px) {
    #index-container .w-mobile-card {
        width: 25%;
    }
}

@media (min-width: 1280px) {
    #index-container .w-mobile-card {
        width: 16.6666%;
    }
}

#index-container .brands-item {
    transition: box-shadow 0.3s ease;
}

#index-container .brands-item:hover {
    box-shadow: -2px 2px 9px #0000001a;
}

/* ==========================================================================
   首页博客（资讯）3 列卡片布局
   - 每列一张白色 .product-card-box（含 hover 阴影）
   - 左/中：1 大图 + 2 列表行；右：5 列表行 + 查看更多
   ========================================================================== */
#index-container .blog-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

@media (max-width: 1023.98px) {
    #index-container .blog-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 639.98px) {
    #index-container .blog-grid {
        grid-template-columns: 1fr;
    }
}

#index-container .blog-card {
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    min-width: 0;
    /* 抵消 .product-card-box 默认 scale(0.95) 在 grid 子项中产生的视觉收缩 */
    transform: none;
}

#index-container .blog-card.product-card-box:hover {
    box-shadow: -2px 2px 9px #0000001a;
}

/* —— 顶部大图卡片：左图右文（image 144×120，gap 12） —— */
#index-container .blog-featured {
    display: flex;
    gap: 12px;
    color: #333;
    transition: color 0.2s ease;
    padding-bottom: 8px;
    align-items: stretch;
}

#index-container .blog-featured:hover,
#index-container .blog-featured:hover .blog-featured-title,
#index-container .blog-featured:hover .blog-featured-excerpt,
#index-container .blog-featured:hover .blog-meta {
    color: var(--primary-color);
}

#index-container .blog-featured-image {
    flex: 0 0 144px;
    width: 144px;
    height: 120px;
    border-radius: 6px;
    overflow: hidden;
    background-color: #f5f5f5;
}

#index-container .blog-featured-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#index-container .blog-featured-text {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 6px;
    padding: 2px 0;
}

#index-container .blog-featured-title {
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
    color: #333;
    word-break: break-word;
    overflow-wrap: anywhere;
}

#index-container .blog-featured-excerpt {
    font-size: 12px;
    color: #999;
    line-height: 1.5;
    word-break: break-word;
    overflow-wrap: anywhere;
}

#index-container .blog-meta-row {
    text-align: right;
}

#index-container .blog-meta-row .blog-meta {
    font-size: 12px;
    color: #999;
}

/* —— 列表行：单行标题 + 右侧日期 —— */
#index-container .blog-card .blog-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 0;
    color: #333;
    font-size: 13px;
    line-height: 1.4;
    border-top: 1px solid #f1f1f1;
    transition: color 0.2s ease;
}

#index-container .blog-card .blog-row:first-child {
    border-top: none;
}

/* 左/中列：大图块下方第一条列表行不要再画顶线（否则与 .blog-featured 底部形成第二条灰线） */
#index-container .blog-card .blog-featured + .blog-row {
    border-top: none;
}

#index-container .blog-card .blog-row:hover,
#index-container .blog-card .blog-row:hover .blog-row-title,
#index-container .blog-card .blog-row:hover .blog-row-date {
    color: var(--primary-color);
}

#index-container .blog-card .blog-row-title {
    flex: 1 1 auto;
    min-width: 0;
    color: #333;
    transition: color 0.2s ease;
}

#index-container .blog-card .blog-row-date {
    flex: 0 0 auto;
    color: #999;
    font-size: 12px;
    transition: color 0.2s ease;
    white-space: nowrap;
}

/* 第三列：仅列表，无大图 → 列表行紧凑分布 */
#index-container .blog-card-list-only .blog-row {
    padding: 10px 0;
}

#index-container .blog-row-more {
    justify-content: flex-start;
    color: #555;
}

#index-container .blog-row-more .blog-row-arrow {
    color: #555;
    font-size: 14px;
    margin-left: 4px;
}

#index-container .blog-row-more:hover,
#index-container .blog-row-more:hover .blog-row-arrow {
    color: var(--primary-color);
}

#index-container .blog-bookmark {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    line-height: 0;
}

#index-container .blog-bookmark img {
    display: block;
    width: 23px;
    height: 17px;
    object-fit: contain;
}

/* ==========================================================================
   首页促销区：三 Tab + 双列表格（热卖 / 特惠 / 推荐）
   ========================================================================== */
#index-container .index-promo-tabs .promo-tab-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 20px;
    align-items: flex-end;
}

#index-container .index-promo-tabs .promo-tab {
    flex: 1 1 0;
    min-width: 0;
    margin: 0;
    padding: 24.5px 14px 26.5px;
    border: none;
    border-radius: 8px 8px 0 0;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: opacity 0.2s ease, box-shadow 0.2s ease;
    position: relative;
    text-align: center;
    line-height: 1.25;
}

#index-container .index-promo-tabs .promo-tab--0 {
    /* 主题色淡比例混入中性灰底，非纯色 */
    background: color-mix(in srgb, var(--primary-color) 12%, #ececec 88%);
    color: #222;
}

#index-container .index-promo-tabs .promo-tab--1 {
    background: color-mix(in srgb, var(--primary-color) 26%, #ffffff 74%);
    color: #1a1a1a;
}

#index-container .index-promo-tabs .promo-tab--2 {
    background: color-mix(in srgb, var(--primary-color) 68%, #ffffff 32%);
    color: #fff;
}

#index-container .index-promo-tabs .promo-tab:not(.is-active) {
    opacity: 0.88;
}

#index-container .index-promo-tabs .promo-tab.is-active {
    opacity: 1;
    z-index: 2;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

#index-container .index-promo-tabs .promo-tab.is-active::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: -14px;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 8px solid #fff;
}

#index-container .index-promo-tabs .promo-tab-panels-wrap {
    border: 1px solid hsla(0, 0%, 83%, 0.45);
    border-radius: 0 0 8px 8px;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06);
    padding: 16px 18px 12px;
    margin-top: 0;
}

#index-container .index-promo-tabs .promo-tab-panel:not(.is-active) {
    display: none;
}

#index-container .index-promo-tabs .promo-tab-panel.is-active {
    display: block;
}

#index-container .index-promo-tabs .promo-tables-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 20px;
}

@media (max-width: 767.98px) {
    #index-container .index-promo-tabs .promo-tables-row {
        grid-template-columns: 1fr;
    }

    #index-container .index-promo-tabs .promo-tab {
        flex: 1 1 calc(50% - 4px);
        font-size: 12px;
        padding: 22.5px 8px 24.5px;
    }
}

#index-container .index-promo-tabs .promo-table-wrap {
    min-width: 0;
    overflow-x: auto;
}

#index-container .index-promo-tabs .promo-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
    color: #333;
}

#index-container .index-promo-tabs .promo-table thead th {
    background: #f0f0f0;
    font-weight: 700;
    text-align: left;
    padding: 8px 10px;
    border-bottom: 1px solid #ddd;
}

#index-container .index-promo-tabs .promo-table tbody td {
    padding: 13px 10px;
    border-bottom: 1px solid #eee;
    vertical-align: middle;
}

#index-container .index-promo-tabs .promo-table tbody tr:last-child td {
    border-bottom: none;
}

#index-container .index-promo-tabs .promo-cell-link {
    color: inherit;
    text-decoration: none;
    display: block;
    word-break: break-word;
}

#index-container .index-promo-tabs .promo-cell-link:hover {
    color: var(--primary-color);
}

#index-container .index-promo-tabs .promo-tab-footer {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 28px;
    margin-top: 14px;
    padding-top: 10px;
    border-top: 1px solid #eee;
}

#index-container .index-promo-tabs .promo-refresh {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0;
    border: none;
    background: none;
    font-size: 14px;
    font-weight: 600;
    color: var(--primary-color, #409eff);
    cursor: pointer;
}

#index-container .index-promo-tabs .promo-refresh-icon {
    display: inline-block;
    font-size: 18px;
    line-height: 1;
}

#index-container .index-promo-tabs .promo-learn-more {
    font-size: 14px;
    font-weight: 600;
    color: var(--primary-color, #409eff);
    text-decoration: none;
}

#index-container .index-promo-tabs .promo-learn-more:hover {
    text-decoration: underline;
}

#index-container .promo-card:hover {
    box-shadow: -2px 2px 9px #0000001a;
}

#index-container .hot-right {
    min-width: 0;
}

#index-container .promo-flex {
    align-items: stretch;
}

/* 热卖单列产品宽 */
#index-container .hot-item-w {
    width: 20%;
    box-sizing: border-box;
    padding: 0 5px;
}

/* 热卖卡片：型号 / 制造商 / 价格 三行文字之间各 7px */
#index-container .hot-grid .hot-item .cart-box > .model {
    margin-bottom: 7px;
}

#index-container .hot-grid .hot-item .cart-box > .price.text-999 {
    margin-bottom: 7px;
}

/* 促销卡片：型号 / 价格 / 制造商 三行文字之间各 7px */
#index-container .promo-card .description > .model {
    margin-bottom: 7px;
}

#index-container .promo-card .description > .price.site-product-price {
    margin-bottom: 7px;
}

/* 响应式：顶行与信息条在 <992px 隐藏或堆叠 */
@media (max-width: 991.98px) {
    #index-container .home-top-box {
        display: none;
    }

    #index-container .home-info-bar {
        display: none;
    }

    #index-container .hot-item-hide-mb {
        display: none !important;
    }

    /* 热卖网格：移动端只显示每屏前 4 个（不依赖 volist 下标，兼容 array_slice 保留键） */
    #index-container .hot-grid .hot-item:nth-child(n + 5) {
        display: none !important;
    }

    #index-container .hot-left {
        display: none;
    }

    #index-container .hot-pagination {
        display: none !important;
    }

    #index-container .hot-item-w {
        width: 50%;
    }
}