/* ==========================================================================
   首页专属样式 (home.css)
   2026-10-30 新增 —— 服务两件事:
     D5 首页「斗草品牌」分区 (卡片沿用品牌墙既有类名, 这里只补分区标题)
     E6 首页「热门搜索」词条区 (搜索框下方一排词条)

   归属: 本文件只被 /var/www/html/index.php 单独 <link> 引入, 不被其它页面引用,
         因此不外溢到站内其它页面; 也**没有**改动 cigar.css / cigar-shared.css / common.css。
   视觉: 沿用本站既有语言 —— 主色 #e60012 (与 .cate-item.active / .brand-item:hover 一致),
         灰阶 #333 / #666 / #999 / #e8e8e8 (与 .brand-cnname / .brand-enname / .brand-item 一致),
         圆角 4px (与 .brand-item / .idx-search-form 一致)。不另起一套视觉。
   ========================================================================== */

/* --------------------------------------------------------------------------
   E6 热门搜索词条
   -------------------------------------------------------------------------- */
.idx-hot-terms{
    display:flex;
    flex-wrap:wrap;           /* 宽屏自动换行 */
    align-items:center;
    gap:8px;
    margin-top:12px;
}
.idx-hot-label{
    font-size:13px;
    color:#999;
    flex-shrink:0;
}
.idx-hot-term{
    display:inline-block;
    font-size:13px;
    line-height:1.4;
    color:#666;
    background:#f5f5f5;
    border:1px solid #e8e8e8;
    border-radius:12px;
    padding:3px 10px;
    transition:all .3s;
    white-space:nowrap;
}
.idx-hot-term:hover{
    color:#e60012;
    border-color:#e60012;
    background:#fff;
}
.idx-hot-term:focus-visible{
    outline:2px solid #e60012;
    outline-offset:1px;
}

/* --------------------------------------------------------------------------
   D5 斗草品牌分区标题
   (卡片本身完全复用 .brand-grid / .brand-item / .brand-thumb / .brand-bottom,
    这里只有分区标题是新样式)
   -------------------------------------------------------------------------- */
.brand-section-title{
    font-size:16px;
    font-weight:500;
    color:#333;
    margin-bottom:14px;
    padding-left:10px;
    border-left:3px solid #e60012;
    font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Segoe UI",Arial,sans-serif;
    line-height:1.3;
}

/* --------------------------------------------------------------------------
   移动端 (≤768px): 与首页既有媒体查询 (index.php 内联 style) 同口径。
   词条改为可横向滚动, 避免词条变多时把整页撑出横向滚动条。
   -------------------------------------------------------------------------- */
@media (max-width:768px){
    .idx-hot-terms{
        flex-wrap:nowrap;
        overflow-x:auto;
        -webkit-overflow-scrolling:touch;
        padding-bottom:4px;
        gap:6px;
    }
    .idx-hot-label{
        position:sticky;
        left:0;
        background:#fff;
        padding-right:2px;
    }
    .idx-hot-term{
        font-size:12px;
        padding:3px 8px;
    }
    .brand-section-title{
        font-size:15px;
        margin-bottom:10px;
    }
}