/* ============ 手机端（宽度 <= 575.98px）专用修正 ============ */
@media (max-width: 575.98px) {

    /* 整个结果容器：彻底取消大白板效果 */
    #pageSearch #resultPanel {
        background: transparent !important;
        box-shadow: none !important;
        border-radius: 0 !important;
        padding: 0 !important;
        /* 去掉 p-3 的内边距 */
        margin-bottom: 0 !important;
        border: 0 !important;
    }

    /* 结果分组外围不额外做白底 */
    #pageSearch #resultPanel .group {
        background: transparent !important;
        margin-bottom: 0;
    }

    /* 手机端结果区域用“单列纵向”排版，卡片之间留缝隙 */
    #pageSearch #resultPanel .results-grid {
        display: flex !important;
        flex-direction: column;
        gap: 12px;
        /* 卡片之间的空隙 */
    }

    /* 每一条商品：自己是一张小卡片（白底 + 边框 + 阴影） */
    #pageSearch #resultPanel .item-row {
        display: flex;
        flex-direction: column;
        /* 上图中你已经是纵向排版了，这里明确指定 */
        background: #fff !important;
        border-radius: 12px;
        border: 1px solid #e5e7eb;
        padding: 12px 12px 16px;
        margin: 0;
        box-shadow: 0 4px 12px rgba(0, 0, 0, .04);
    }

    /* 图片 + 信息 + 按钮间距，在手机上稍微紧凑一点 */
    #pageSearch #resultPanel .item-row > div {
        margin-bottom: 6px;
    }

    #pageSearch #resultPanel .item-row > div:last-child {
        margin-bottom: 0;
    }

    /* 分页条本身不要白底，紧贴结果列表 */
    #pageSearch nav.srr-pager {
        background: transparent !important;
        padding-top: 8px;
        padding-bottom: 8px;
        margin-bottom: 0;
    }
}

/* 让加购 / 购买两个按钮在一条水平线上，文字也居中 */
#pageSearch .result-actions .btn-row .btn {
    flex: 0 0 auto; /* 不允许被 flex 布局压缩 */
    white-space: nowrap; /* 文字不换行 */
    display: inline-flex; /* 按钮内部用 flex 排版 */
    align-items: center; /* 图标 + 文字 垂直居中 */
    justify-content: center; /* 水平居中 */
}

/* 再显式统一一下字体大小，避免浏览器差异 */
#pageSearch .result-actions .btn-outline-primary,
#pageSearch .result-actions .btn-primary {
    height: 36px;
    padding-inline: 14px;
    font-size: 14px;
}

/* 标准名称树容器：允许横向/纵向滚动 */
#stdTreeBox {
    max-height: calc(100vh - 160px);
    /* 已经有纵向高度的话可以保持/微调 */
    overflow-y: auto;
    overflow-x: auto;
    /* ★ 新增：横向滚动条，避免文本被硬截断 */
}

/* 树节点文字：不强制换行，超出时通过横向滚动查看 */
#stdTreeBox .std-node-label,
#stdTreeBox .jstree-anchor {
    display: inline-block;
    white-space: nowrap;
    /* ★ 让长英文变成一行，靠滚动看全 */
}

/* 如有需要，可以给整棵树一个最大宽度，防止把页面右侧挤没了 */
.offcanvas-body #stdTreeBox {
    max-width: 260px;
    /* 你可以根据实际调整 240~280 之间 */
}
/* ======== 右侧热销榜（电商风格） ======== */
#pageSearch .hotrank-card { border-radius: 10px; }
#pageSearch .hotrank-sub {
    font-size: 12px;
    color: #6c757d;
    background: #f6f7f9;
    padding: 2px 8px;
    border-radius: 999px;
}

#pageSearch .hotrank-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-height: 260px;     /* 数据多就滚动 */
    overflow: auto;
    padding-right: 4px;
}

#pageSearch .hotrank-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border-radius: 10px;
    text-decoration: none;
    color: inherit;
    background: #fff;
    border: 1px solid #f0f0f0;
    transition: all .15s ease;
}

#pageSearch .hotrank-item:hover {
    border-color: #d7e6ff;
    background: #f7fbff;
    transform: translateY(-1px);
}

#pageSearch .hotrank-rank {
    width: 22px;
    height: 22px;
    line-height: 22px;
    text-align: center;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 700;
    background: #eef3ff;
    color: #2f6feb;
    flex: 0 0 auto;
}

#pageSearch .hotrank-title {
    flex: 1 1 auto;
    font-size: 13px;
    font-weight: 600;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

#pageSearch .hotrank-metric {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    font-size: 12px;
    color: #6c757d;
}
#pageSearch .hotrank-metric-val {
    font-size: 13px;
    font-weight: 700;
    color: #111;
}

#pageSearch .hotrank-tip {
    margin-top: 10px;
    font-size: 12px;
    color: #6c757d;
}
/* 右侧热销榜：天数 pills 不换行 + 可横向滚动 + 更像电商上线风格 */
#pageSearch .hotrank-days{
    display: flex;
    flex-wrap: nowrap;
    gap: 6px;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 2px;
    scrollbar-width: none;       /* Firefox 隐藏滚动条 */
}
#pageSearch .hotrank-days::-webkit-scrollbar{ height:0; } /* Chrome 隐藏滚动条 */

#pageSearch .hotrank-days .btn{
    flex: 0 0 auto;              /* 不被挤压 */
    border-radius: 999px;        /* pills */
    padding: 3px 10px;
    line-height: 1.2;
}
/* Left category tree focus highlight (after hotrank click etc.) */
#pageSearch #catTree .tree-focus{
    background: #f7fbff;
    border-radius: 8px;
}
#pageSearch #catTree .tree-focus .tree-label{
    color: #0d6efd;
    font-weight: 700;
}
/* ===== HotRank 修复：Header 不换行 + 按钮不裁切 ===== */
.hotrank-card{ overflow: visible; }
.hotrank-header{ flex-wrap: nowrap; min-width: 0; }
.hotrank-title{ white-space: nowrap; flex: 0 0 auto; }
.hotrank-days{ white-space: nowrap; flex: 0 0 auto; }
.hotrank-days .btn{ white-space: nowrap; }
/* 热销榜 Header：不换行、不裁切（含 7天/30天/90天按钮） */
/* ===== HotRank header 自适应增强（解决多语言溢出） ===== */
.hotrank-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;

    /* 关键：不让整体被长标题撑爆到外面 */
    flex-wrap:nowrap;
    min-width:0;
    overflow:hidden;
}

/* 你真实标题是 <div class="fw-semibold"> ... </div> */
.hotrank-header .fw-semibold{
    flex:1 1 auto;
    min-width:0;
    overflow:hidden;
}

/* 标题文字一行显示，超出省略，不再把右侧 select 顶出去 */
.hotrank-header .fw-semibold{
    white-space:nowrap;
    text-overflow:ellipsis;
}

/* 右侧天数选择：固定在卡片内，允许变窄 */
.hotrank-header .hotrank-days{
    flex:0 0 auto;
    max-width:100px;     /* 你也可以 100px/120px，看你想要多紧凑 */
    min-width:72px;      /* 防止太窄难看 */
}

.hotrank-header .hotrank-days select{
    width:100%;
    min-width:0 !important;
    max-width:100%;
    box-sizing:border-box;
}

/* ✅ 强兜底：分类树任何层级都不允许出现默认圆点/序号（解决“圆框像radio”） */
#catTree ul,
#catTree li {
    list-style: none !important;
}

#catTree li::marker {
    content: "" !important;
}

/* 进一步兜底：有些浏览器会给 ul 加默认 padding */
#catTree ul {
    padding-left: 0 !important;
    margin-left: 0 !important;
}
/* ✅ 强兜底：分类树内 checkbox 永远是方框（防止外部 CSS 把 form-check-input 圆角成“圆圈”） */
#catTree input.form-check-input[type="checkbox"]{
    border-radius: .25rem !important;
    appearance: auto !important;
    -webkit-appearance: checkbox !important;
}
/* ===== 已购区间：更紧凑 ===== */
.purchased-grid{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;width:100%;}
.purchased-preset{min-width:160px;flex:0 0 160px;}
.purchased-custom{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;flex:1 1 auto;}
.purchased-date{min-width:140px;flex:1 1 140px;}
.purchased-date input{width:100%;}

/* ===== Toast ===== */
.srr-toast-host{position:fixed;top:14px;right:14px;z-index:2000;display:flex;flex-direction:column;gap:10px;max-width:min(360px,calc(100vw - 28px));pointer-events:none;}
.srr-toast{pointer-events:auto;border-radius:12px;padding:10px 12px;box-shadow:0 10px 28px rgba(0,0,0,.12);background:#fff;border:1px solid rgba(0,0,0,.08);transform:translateY(-6px);opacity:0;transition:all .22s ease;display:flex;gap:10px;align-items:flex-start;}
.srr-toast.show{transform:translateY(0);opacity:1;}
.srr-toast.hide{opacity:0;transform:translateY(-6px);}
.srr-toast .dot{width:10px;height:10px;border-radius:50%;margin-top:4px;flex:0 0 10px;}
.srr-toast .msg{font-size:13px;line-height:1.35;word-break:break-word;}
.srr-toast-info .dot{background:#0d6efd;}
.srr-toast-success .dot{background:#198754;}
.srr-toast-warn .dot{background:#fd7e14;}
.srr-toast-error .dot{background:#dc3545;}

/* ===== 飞入购物车 ===== */
.srr-fly-img{position:fixed;z-index:2500;width:40px;height:40px;border-radius:10px;object-fit:cover;box-shadow:0 10px 22px rgba(0,0,0,.18);will-change:transform,opacity;pointer-events:none;transition:transform .7s cubic-bezier(.2,.8,.2,1),opacity .7s ease;}
/* ✅HotRank：标题/天数下拉自适应，多语言不挤出布局 */
.hotrank-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    flex-wrap:wrap;
    min-width:0;
}
.hotrank-header .hotrank-title{
    flex:1 1 auto;
    min-width:0;
}
.hotrank-header .hotrank-title span{
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.hotrank-header .hotrank-days{
    flex:0 0 auto;
}
.hotrank-header .hotrank-days select{
    width:90px;
    min-width:90px;
}

@media (max-width:576px){
    .hotrank-header .hotrank-title span{white-space:normal;}
    .hotrank-header .hotrank-days{width:100%;}
    .hotrank-header .hotrank-days select{width:100%;min-width:0;}
}
/* ===== 车型三级：统一为 combo 风格（并补齐 disabled 灰底）===== */
#variantCombo .combo{
    border: 1px solid #d8dee5;
    border-radius: 10px;
    background: #fff;
    width: 100%;
}
#variantCombo select.combo-input{
    appearance:none;
    -webkit-appearance:none;
    -moz-appearance:none;
    height: 38px;
    background: transparent;
    padding-left: 8px;
    color: #adb5bd;          /* 默认（未选择）灰色 */
    font-weight: 400;
    width: 100%;
}
#variantCombo select.combo-input.has-value{ color:#212529; }
#variantCombo .combo-caret[disabled]{ opacity:.35; cursor:not-allowed; }
#variantCombo select.combo-input:disabled{ cursor:not-allowed; }

/* ✅ 新增：当子车型处于 disabled（未选品牌/车型）时，背景也要变灰，和车型一致 */
#variantCombo.combo-disabled .combo{
    background:#f6f7f9;
}
#variantCombo.combo-disabled .combo-icon{
    color:#adb5bd;
}
#variantCombo.combo-disabled select.combo-input{
    color:#adb5bd !important;
}
/* 关键：禁用状态下整个控件不响应点击，避免空下拉白框 */
#variantCombo.combo-disabled {
    pointer-events: none;
}
/* 双保险：禁用时 dropdown 永远不显示 */
#variantCombo.combo-disabled .combo-dropdown {
    display: none !important;
}

/* 车型二级：未选品牌时禁用输入 */
#mdescCombo.combo-disabled .combo{
    background:#f6f7f9;
}
#mdescCombo.combo-disabled .combo-input{
    color:#adb5bd !important;
    cursor:not-allowed !important;
}
#mdescCombo.combo-disabled .combo-caret,
#mdescCombo.combo-disabled .combo-clear{
    opacity:.35;
    pointer-events:none;
}
/* ===== 全局“正在查询中”遮罩 ===== */
#srrSearchingMask.srr-searching-mask{
    position: fixed;
    inset: 0;
    z-index: 5000;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,.65);
    backdrop-filter: blur(2px);
}
#srrSearchingMask .srr-searching-card{
    display:flex;
    align-items:center;
    gap:12px;
    padding:14px 18px;
    border-radius: 12px;
    background:#fff;
    border:1px solid rgba(15,23,42,.10);
    box-shadow: 0 18px 40px rgba(15,23,42,.15);
}
#srrSearchingMask .srr-searching-text{
    font-weight: 600;
    color:#0f172a;
}
/* ✅ 车型三级下拉：复选框小方块（IDEA 不再爆红） */
.combo-ck.form-check-input{
    width:16px !important;
    height:16px !important;
    margin:0 !important;
    flex:0 0 16px !important;
    border-radius:3px;
}

/* ✅ 下拉项更紧凑：复选框+文字间距更小 */
.combo-item-label{ gap:6px !important; }
.combo-item{ padding:.28rem .42rem !important; }

/* ✅ 下拉项整体更紧凑，避免左侧留大空白 */
#brandCombo .combo-dropdown .combo-item label,
#mdescCombo .combo-dropdown .combo-item label,
#variantCombo .combo-dropdown .combo-item label{
    gap:6px !important;
}
#brandCombo .combo-dropdown .combo-item,
#mdescCombo .combo-dropdown .combo-item,
#variantCombo .combo-dropdown .combo-item{
    padding:.30rem .45rem !important;
}
/* ✅ 复选框变“标准小方框”，不占大宽度 */
.combo-ck.form-check-input{
    width:16px !important;
    height:16px !important;
    margin:0 !important;
    flex:0 0 16px !important;
    border-radius:3px;
}

/* ✅ 下拉项更紧凑：复选框+文字不要隔太大 */
.combo-item-label{ gap:6px !important; }
.combo-item{ padding:.28rem .42rem !important; }
/* 下拉面板：头/尾固定，中间滚动 */
.combo-panel{ background:#fff; }
.combo-panel-head{
    position: sticky; top: 0;
    display:flex; align-items:center; justify-content:space-between;
    padding:8px 10px;
    background:#fff;
    border-bottom:1px solid rgba(0,0,0,.06);
    z-index:2;
}
.combo-panel-foot{
    position: sticky; bottom: 0;
    display:flex; gap:10px; justify-content:flex-end;
    padding:8px 10px;
    background:#fff;
    border-top:1px solid rgba(0,0,0,.06);
    z-index:2;
}
.combo-panel-body{
    max-height: 200px;   /* ✅ 从 280 降到 200，白框感明显减轻 */
    overflow:auto;
    padding:2px 0;
}
.combo-btn{
    height:30px;
    padding:0 10px;
    border:1px solid rgba(0,0,0,.12);
    background:#fff;
    border-radius:8px;
    font-size:13px;
}
.combo-btn:hover{ border-color:#165DFF; color:#165DFF; }

.combo-count{ font-size:12px; color:#667085; }
.combo-count b{ color:#165DFF; }
#variantComboInput{ font-size:14px !important; }
#variantComboInput::placeholder{ font-size:14px !important; }
/* ✅ 兜底：强制只滚 body，让 bottom 按钮永远可见 */
#brandComboList, #mdescComboList, #variantComboList{
    overflow: hidden !important;
    display: flex;
    flex-direction: column;
}
.combo-panel-body{
    max-height: 200px;   /* ✅ 从 280 降到 200，白框感明显减轻 */
    overflow:auto;
    padding:2px 0;
}
#variantComboInput, #variantComboInput::placeholder{
    font-size:14px !important;
    line-height:1.2 !important;
}
/* ✅ 第三级子车型下拉：层级务必低（避免压住语言等顶栏） */
#variantCombo,
#variantComboRoot{
    position: relative;
    z-index: 20;              /* 很低即可，保证自己区域可点 */
}

#variantComboList,
#variantComboPanel{
    z-index: 60 !important;   /* 低层：不会压住 header / 语言下拉 */
}

/* 所有 combo 面板统一低层 */
.combo-panel{
    z-index: 60 !important;
}

/* 顶部筛选容器一定要允许下拉溢出 */
.vehicle-filters,
.filter-card,
.search-filters,
.top-filters,
.filters-card {
    overflow: visible !important;
}
/* ✅清除筛选：不要白框、字体更小、更像“轻量操作” */
.filter-clear{
    display:inline-flex; align-items:center; gap:6px;
    height:auto;
    padding:0;                /* ✅去掉造成“白框”的 padding */
    border:0 !important;
    outline:0 !important;
    background:transparent !important;  /* ✅透明，不再出现白底框 */
    box-shadow:none !important;

    color:#4b5563;
    cursor:pointer;
    font-weight:600;
    font-size:12px;           /* ✅字更小 */
    line-height:1.2;
    user-select:none;
}
.filter-clear:hover{
    color:#1f2937;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.filter-clear:active{ transform:translateY(1px); }
.filter-clear i{
    font-size:14px;           /* ✅图标也同步缩小 */
    color:#2563eb;
}
/* 兜底：下拉未打开时不占位（避免“白框残留感”） */
.combo-dropdown{
    position:absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    z-index: 1100;   /* ✅ 低层级：永远低于页眉语言(999999)，但仍能盖住输入框区域 */
    display:none;
    background:#fff;
    border:1px solid rgba(0,0,0,.08);
    border-radius:12px;
    box-shadow:0 10px 24px rgba(0,0,0,.08);
    max-height: 320px;
    overflow:auto;
}
.carbrand-inline{
    font-size: 13px;
    line-height: 1.2;
}