/* ==========================================================================
   1024yun 购物车主题（PC）
   说明：
   - 本文件只做「叠加」，基础样式始终引用 default 主题的 goodsList.css
   - 这样 10.7.4 之后不管 default 的 css 怎么升级，我们都不用跟着改
   - 尺寸沿用系统 rem 规则：1920 设计稿下 1rem = 100px
   ========================================================================== */

:root {
  --yun-accent: #ff6a00;
  --yun-accent-light: rgba(255, 106, 0, 0.08);
  --yun-accent-line: rgba(255, 106, 0, 0.35);
  --yun-border: #ebedf0;
  --yun-text: #171725;
  --yun-text-sub: #5a6478;
  --yun-text-mute: #8692b0;
  --yun-radius: 0.08rem;
}

/* ---------- 一级分类：tab ---------- */
.type-tabs {
  display: flex;
  align-items: center;
  gap: 0.32rem;
  border-bottom: 1px solid var(--yun-border);
  margin-bottom: 0.18rem;
}
.type-tab {
  position: relative;
  font-size: 0.17rem;
  line-height: 1.4;
  color: var(--yun-text-sub);
  padding: 0.12rem 0 0.14rem;
  cursor: pointer;
  transition: color 0.2s;
  user-select: none;
}
.type-tab:hover { color: var(--yun-accent); }
.type-tab.active {
  color: var(--yun-text);
  font-weight: 600;
}
.type-tab.active::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 0.03rem;
  border-radius: 0.02rem;
  background: var(--yun-accent);
}

/* ---------- 二级分类：地区 chips + 搜索行 ---------- */
.filter-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.16rem;
  flex-wrap: wrap;
}
.region-chips {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: 0.1rem;
}
.region-chip {
  font-size: 0.14rem;
  line-height: 1;
  color: var(--yun-text-sub);
  background: #f4f6f9;
  border: 1px solid transparent;
  border-radius: 0.15rem;
  padding: 0.09rem 0.16rem;
  cursor: pointer;
  transition: all 0.2s;
  user-select: none;
  white-space: nowrap;
}
.region-chip:hover {
  color: var(--yun-accent);
  background: var(--yun-accent-light);
}
.region-chip.active {
  color: var(--yun-accent);
  background: var(--yun-accent-light);
  border-color: var(--yun-accent-line);
  font-weight: 600;
}
.search-tools {
  display: flex;
  align-items: center;
  gap: 0.1rem;
}
.search-tools .search-input { width: 3rem; }
.search-tools .search-btn {
  background: var(--yun-accent);
  border-color: var(--yun-accent);
}
.search-tools .search-btn:hover {
  background: #ff8124;
  border-color: #ff8124;
}
.goods-count {
  font-size: 0.13rem;
  color: var(--yun-text-mute);
  white-space: nowrap;
  padding-left: 0.04rem;
}
.goods-count em {
  font-style: normal;
  font-weight: 600;
  color: var(--yun-text);
}

/* ---------- 商品卡 ---------- */
.goods-list-div { row-gap: 0.24rem; }

.shopping-item {
  justify-content: flex-start;
  background: #fff;
  border: 1px solid var(--yun-border);
  box-shadow: 0 2px 12px rgba(20, 32, 60, 0.05);
  transition: box-shadow 0.2s, transform 0.2s;
}
.shopping-item:hover {
  box-shadow: 0 8px 24px rgba(20, 32, 60, 0.12);
  transform: translateY(-2px);
}

/* 头部（名称/标签/价格/按钮）提到最上面 —— 纯 CSS，不动 DOM 顺序 */
.shopping-item .goods-content { order: 1; }
.shopping-item .goods-description { order: 2; }

.shopping-item .goods-name { margin-top: 0.14rem; }
.shopping-item .goods-name .goods-name-text {
  font-size: 0.17rem;
  letter-spacing: 0.01em;
}

/* 规格描述：完整显示，不再限高、不再出滚动条 */
.shopping-item .goods-description {
  max-height: none;
  min-height: 0;
  flex: none;
  overflow: visible;
  background: #fff;
  border-top: 1px dashed #f0f2f5;
  margin-top: 0.14rem;
  padding: 0.14rem 0.16rem 0.06rem;
  font-size: 0.13rem;
  line-height: 1.6;
  color: var(--yun-text-sub);
}
/* 富文本里的 <strong> 当分组小标题 */
.shopping-item .goods-description strong {
  /* 标题独占一行；多余的 <br> 由主题 JS（tidyDescription）清掉，
     不用 CSS 选择器去猜，避免误伤正文里的换行 */
  display: block;
  margin: 6px 0 0;
  font-size: 0.13rem;
  font-weight: 600;
  color: var(--yun-text);
}
.shopping-item .goods-description strong:first-child {
  margin-top: 0;
}

.shopping-item .goods-description strong img {
  vertical-align: -2px;
  margin-right: 4px;
}

/* 价格区：橙色主价 + 橙色按钮 */
.shopping-item .price-box {
  border-top: 1px solid #f4f6f9;
  margin-top: 0.12rem;
  padding-top: 0.12rem;
}
.shopping-item .price-box .item-price {
  color: var(--yun-accent);
  font-size: 0.24rem;
  font-weight: 600;
}
.shopping-item .price-box .item-price .item-price-cycle {
  font-size: 0.13rem;
  color: var(--yun-text-mute);
  font-weight: 400;
}
.shopping-item .price-box .buy-btn {
  height: 0.34rem;
  padding: 0 0.2rem;
  border: none;
  border-radius: 0.04rem;
  background: linear-gradient(90deg, #ff8a3d, #ff6a00);
  color: #fff;
  font-size: 0.14rem;
  box-shadow: 0 2px 8px rgba(255, 106, 0, 0.24);
}
.shopping-item .price-box .buy-btn:hover { opacity: 0.92; }
.shopping-item .price-box .buy-btn.is-disabled,
.shopping-item .price-box .buy-btn.is-disabled:hover {
  background: #c9ced8;
  box-shadow: none;
  opacity: 1;
}

/* ---------- 卖点卡 ---------- */
.feature-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.2rem;
  margin-top: 0.24rem;
}
.feature-card {
  background: #fff;
  border: 1px solid var(--yun-border);
  border-radius: var(--yun-radius);
  padding: 0.28rem 0.2rem;
  text-align: center;
  transition: box-shadow 0.2s, border-color 0.2s;
}
.feature-card:hover {
  border-color: var(--yun-accent-line);
  box-shadow: 0 6px 20px rgba(20, 32, 60, 0.08);
}
.feature-icon {
  font-size: 0.26rem;
  line-height: 1;
  margin-bottom: 0.12rem;
}
.feature-title {
  font-size: 0.16rem;
  font-weight: 600;
  color: var(--yun-text);
  margin-bottom: 0.08rem;
}
.feature-desc {
  font-size: 0.13rem;
  line-height: 1.7;
  color: var(--yun-text-mute);
}

/* ---------- 窄屏 ---------- */
@media (max-width: 1440px) {
  .goods-list-div { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 1200px) {
  .goods-list-div { grid-template-columns: repeat(2, 1fr); }
  .filter-row { align-items: flex-start; }
  .search-tools .search-input { width: 2.4rem; }
}
@media (max-width: 860px) {
  .goods-list-div { grid-template-columns: 1fr; }
  .feature-row { grid-template-columns: 1fr; }
  .type-tabs { gap: 0.2rem; }
}


/* ==========================================================================
   v2 卡片样式（参考「订购产品」页那种：上灰底卖点 + 下白底名称/价格/按钮）
   放在文件末尾，直接覆盖前面的同选择器规则
   ========================================================================== */

/* ---------- 网格：3 列 ---------- */
.goods-list-div {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: 20px;
  row-gap: 20px;
}
/* 第一行：类别（左）+ 搜索（右上） */
.filter-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}
.filter-head .filter-line {
  margin-bottom: 0;
}
.filter-head .search-tools {
  margin-left: auto;
}

/* ---------- 分类：带标签的 chips 行 ---------- */
.filter-line {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}
.filter-label {
  flex: 0 0 auto;
  font-size: 13px;
  color: #5a6478;
  white-space: nowrap;
}
.type-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  border: 0;
  margin: 0;
}
.type-tab {
  position: relative;
  padding: 6px 20px;
  border: 1px solid #e3e6eb;
  border-radius: 4px;
  background: #fff;
  font-size: 13px;
  color: #485169;
  transition: all 0.2s;
}
.type-tab::after { display: none; }          /* 去掉原来的下划线激活态 */
.type-tab:hover { border-color: var(--yun-accent); color: var(--yun-accent); }
.type-tab.active {
  border-color: var(--yun-accent);
  color: var(--yun-accent);
  font-weight: 600;
  background: #fff;
}
.region-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.region-chip {
  padding: 6px 18px;
  border: 1px solid #e3e6eb;
  border-radius: 4px;
  background: #fff;
}
.region-chip.active {
  background: #fff;
  border-color: var(--yun-accent);
  color: var(--yun-accent);
  font-weight: 600;
}

/* ---------- 卡片本体 ---------- */
.shopping-item {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding-bottom: 0;
  background: #fff;
  border: 1px solid #ebedf0;
  border-radius: 8px;
  overflow: hidden;
}
/* 上：灰底卖点区 */
.shopping-item .goods-description {
  order: 1;
  flex: none;
  min-height: 210px;
  margin: 0;
  padding: 18px 18px 16px;
  border: 0;
  border-top: 0;
  background: #f7f8fa;
  font-size: 13px;
  line-height: 1.85;
  color: #485169;
}
.shopping-item .goods-description strong {
  display: block;
  margin: 8px 0 2px;
  font-size: 13.5px;
  font-weight: 600;
  color: #1e2736;
}
.shopping-item .goods-description strong:first-child { margin-top: 0; }
/* 小标题前的圆点（参考页那种蓝点，这里用主题橙） */
.shopping-item .goods-description strong::before {
  content: "";
  display: inline-block;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--yun-accent);
  margin-right: 6px;
  vertical-align: 2px;
}

/* 下：白底名称 / 价格 / 按钮 */
.shopping-item .goods-content {
  order: 2;
  padding: 14px 18px 16px;
  background: #fff;
}
.shopping-item .goods-name { margin: 0 0 12px; padding: 0; }
.shopping-item .goods-name .goods-name-text {
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0;
}
.shopping-item .goods-tag {
  height: auto;
  margin: 0 0 6px;
  padding: 0;
  background: transparent;
}
.shopping-item .goods-active { margin: 0 0 6px; padding: 0; }
.shopping-item .price-box {
  margin: 0;
  padding: 0;
  border: 0;
}
.shopping-item .price-box .item-price { font-size: 22px; }
.shopping-item .price-box .buy-btn {
  height: 34px;
  min-width: 88px;
  padding: 0 22px;
  border-radius: 4px;
  font-size: 14px;
}

/* 右上角推荐标：做成丝带感 */
.shopping-item .client-box {
  z-index: 2;
  padding: 3px 12px;
  font-size: 12px;
  font-weight: 600;
  border-radius: 0 0 0 10px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
}

/* ---------- 窄屏 ---------- */
@media (max-width: 1600px) {
  .goods-list-div { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 1200px) {
  .goods-list-div { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 860px) {
  .goods-list-div { grid-template-columns: 1fr; }
  .filter-line { align-items: center; flex-direction: row; gap: 0; } /* 2026-10-26 手机布局:类别地区同行 */
}

/* ---------- 卡片等高：描述区固定高度、内部滚动 ---------- */
@media (min-width: 861px) {
  .shopping-item {
    height: 506px;
    min-height: 0;
    justify-content: flex-start;
  }
  .shopping-item .goods-description {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .shopping-item .goods-content {
    flex: 0 0 auto;
  }
  /* 细滚动条，悬停才明显 */
  .shopping-item .goods-description::-webkit-scrollbar { width: 6px; }
  .shopping-item .goods-description::-webkit-scrollbar-track { background: transparent; }
  .shopping-item .goods-description::-webkit-scrollbar-thumb {
    background: #d8dce5; border-radius: 3px;
  }
  .shopping-item:hover .goods-description::-webkit-scrollbar-thumb { background: #b9bfcc; }
}

/* ---------- 1024yun: 紧凑地区下拉 ---------- */
.filter-line .zone-select, .filter-line .city-select { margin-right: 10px; }
.filter-line .el-select .el-input__inner { border-radius: 8px; }

/* ---------- 1024yun: 官网同款品牌导航条 ---------- */
.yun-topbar { background:#1b1238; }
.yun-topbar-in { max-width:100%; margin:0 auto; padding:0 24px; height:58px; display:flex; align-items:center; }
.yun-logo { font-size:19px; font-weight:700; color:#fff; letter-spacing:.5px; }
.yun-grad { background:linear-gradient(120deg,#a78bfa,#fb923c); -webkit-background-clip:text; background-clip:text; color:transparent; }
.yun-nav { display:flex; gap:28px; margin-left:52px; }
.yun-nav a { color:#aab3c5; font-size:14px; }
.yun-nav a:hover, .yun-nav a.on { color:#fff; }
.yun-nav-r { margin-left:auto; display:flex; gap:12px; align-items:center; }
.yun-ghost { color:#e8eaf0; border:1px solid rgba(255,255,255,.25); padding:6px 15px; border-radius:6px; font-size:13px; }
.yun-ghost:hover { border-color:#fff; }
.yun-mainbtn { background:#f97316; color:#fff; padding:6px 17px; border-radius:6px; font-size:13px; font-weight:600; }
.yun-mainbtn:hover { background:#ea580c; }
@media (max-width:960px) {
  .yun-nav { display:none; }
  .yun-topbar-in { padding:0 16px; }
}

/* topbar 独立于系统布局: sticky 高层级 */
.yun-topbar { position:sticky; top:0; z-index:2100; }

/* ==========================================================================
   2026-10-24 品牌收敛(与官网紫橙统一)
   1. 购买按钮恢复橙色:客户中心品牌层把 .el-button--primary 统一成紫色,
      购物车页里「购买」是主行动,必须与价格同为橙色,否则紫按钮+橙价格互相打架
   2. 查询是次要操作,改中性描边,不与购买抢注意力
   3. 商品描述里的图标是酷帆云外链 SVG(彩色,橙蓝绿混杂且依赖对方域名),统一隐藏
   ========================================================================== */
.shopping-item .price-box .buy-btn.el-button--primary {
  background: linear-gradient(90deg, #ff8a3d, #ff6a00) !important;
  border-color: transparent !important;
  color: #fff !important;
  box-shadow: 0 2px 8px rgba(255, 106, 0, 0.24);
}
.shopping-item .price-box .buy-btn.el-button--primary:hover,
.shopping-item .price-box .buy-btn.el-button--primary:focus {
  background: linear-gradient(90deg, #ff8a3d, #ea580c) !important;
  border-color: transparent !important;
  opacity: 0.94;
}
.shopping-item .price-box .buy-btn.is-disabled,
.shopping-item .price-box .buy-btn.is-disabled:hover {
  background: #c9ced8 !important;
  border-color: #c9ced8 !important;
  box-shadow: none;
  opacity: 1;
}

.search-tools .search-btn.el-button--primary {
  background: #fff !important;
  border: 1px solid #d8dce5 !important;
  color: #485169 !important;
  font-weight: 500;
}
.search-tools .search-btn.el-button--primary:hover,
.search-tools .search-btn.el-button--primary:focus {
  background: #fff !important;
  border-color: #7c3aed !important;
  color: #7c3aed !important;
}

.goods-description img {
  display: none !important;
}

/* ---------- 配色职责划分(2026-10-24 二次收敛) ----------
   紫 = 品牌/导航/结构  橙 = 价格/购买主行动
   这样每张卡片只剩「价格 + 购买」两处橙色,不再和标签、圆点抢色 */
.type-tab:hover {
  border-color: #7c3aed;
  color: #7c3aed;
}
.type-tab.active {
  border-color: #7c3aed;
  color: #7c3aed;
  background: #f7f4ff;
}
.shopping-item .goods-description strong::before {
  background: #7c3aed;
}

/* ---------- 2026-10-26 搜索置顶+类别下拉 ---------- */
.filter-head {
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
}
.filter-head .search-tools {
  margin-left: 0;
  width: 100%;
  display: flex;
  align-items: center;
}
.filter-head .search-tools .search-input {
  flex: 1;
  max-width: 520px;
}
.filter-head .first-select {
  width: 240px;
}
.filter-head .first-select .el-input__inner {
  border-radius: 8px;
}
@media (max-width: 960px) {
  .filter-head .search-tools {
    flex-wrap: wrap;
    gap: 8px;
  }
  .filter-head .search-tools .search-input {
    max-width: none;
    width: 100%;
    flex: none;
  }
  .filter-head .search-tools .search-btn {
    margin-left: auto;
  }
  .filter-head .first-select {
    width: 100%;
  }
  .goods-count {
    order: 3;
    width: auto;
  }
}

/* ---------- 2026-10-26 布局二版:搜索一行 + 类别地区一行 ---------- */
.filter-head {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
.filter-head .search-tools {
  flex-basis: 100%;
  width: 100%;
  display: flex;
  align-items: center;
}
.filter-head .filter-line {
  flex: 1 1 auto;
  min-width: 0;
}
@media (max-width: 960px) {
  .filter-head .filter-line {
    flex: 1 1 0;
    gap: 6px;
    margin-bottom: 0;
  }
  .filter-head .filter-label {
    display: none;
  }
  .filter-head .first-select,
  .filter-head .zone-select,
  .filter-head .city-select {
    width: auto !important;
    flex: 1 1 0;
  }
  .filter-head .search-tools {
    flex-wrap: nowrap;
    gap: 8px;
  }
  .filter-head .search-tools .search-input {
    flex: 1;
    width: auto;
    max-width: none;
  }
  .filter-head .search-tools .search-btn {
    margin-left: 0;
  }
  .goods-count {
    display: none;
  }
}

/* 二版补充:窄屏下拉可压缩(内部 input 也要 min-width:0) */
@media (max-width: 960px) {
  .filter-head .filter-line,
  .filter-head .first-select,
  .filter-head .zone-select,
  .filter-head .city-select {
    min-width: 0;
  }
  .filter-head .filter-line .el-select .el-input__inner {
    padding-left: 8px;
    padding-right: 22px;
  }
}

/* 二版再补:窄屏下拉定宽并排,避免内部折行 */
@media (max-width: 960px) {
  .filter-head .filter-line {
    flex: 1 1 0;
    min-width: 0;
    gap: 6px;
  }
  .filter-head .first-select {
    width: 100% !important;
    flex: none !important;
    min-width: 0;
  }
  .filter-head .zone-select,
  .filter-head .city-select {
    width: 50% !important;
    flex: none !important;
    min-width: 0;
    box-sizing: border-box;
  }
}

/* 二版终修:地区行内两下拉并排不折行(gap 0 + 定宽) */
@media (max-width: 960px) {
  .filter-head .filter-line {
    flex-wrap: nowrap;
    gap: 0;
    align-items: center;
  }
  .filter-head .filter-line .el-select {
    margin: 0 3px 0 0;
  }
  .filter-head .zone-select,
  .filter-head .city-select {
    width: calc(50% - 3px) !important;
  }
  .filter-head .first-select {
    width: calc(100% - 3px) !important;
  }
}

/* ---------- 2026-10-26 三下拉均分1/3 + 查询按钮橙色 ---------- */
@media (max-width: 960px) {
  .filter-head .filter-line {
    flex-wrap: nowrap;
    gap: 0;
  }
  .filter-head .first-select,
  .filter-head .zone-select,
  .filter-head .city-select {
    width: 33.33% !important;
    flex: none !important;
    min-width: 0;
    box-sizing: border-box;
    margin: 0 3px 0 0;
  }
  .filter-head .filter-line .el-select:last-of-type {
    margin-right: 0;
  }
}
/* 查询按钮:橙色,字号与筛选下拉一致 */
.search-tools .search-btn.el-button--primary {
  background: #f97316 !important;
  border-color: #f97316 !important;
  color: #fff !important;
  font-size: 14px;
  font-weight: 400;
}
.search-tools .search-btn.el-button--primary:hover,
.search-tools .search-btn.el-button--primary:focus {
  background: #ea580c !important;
  border-color: #ea580c !important;
}

/* ---------- 2026-10-26 标题行:订购产品 + 右上角搜索 ---------- */
.main-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 0.16rem;
}
.main-title-row .main-title {
  margin: 0;
}
.main-title-row .cart-des {
  flex: 1;
}
.main-title-row .search-tools {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
}
.main-title-row .search-tools .search-input {
  width: 2.6rem;
}
@media (max-width: 960px) {
  .main-title-row {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }
  .main-title-row .search-tools {
    width: 100%;
    flex-wrap: nowrap;
  }
  .main-title-row .search-tools .search-input {
    width: auto;
    flex: 1;
    max-width: none;
  }
  .goods-count {
    display: none;
  }
}

/* ==========================================================================
   2026-10-27 桌面端类别改回标签组(移动端仍是下拉)
   ========================================================================== */
/* 桌面:标签组显示、下拉隐藏 */
.type-tabs-desk {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.type-tabs-desk .type-tab {
  padding: 6px 18px;
  border: 1px solid #e3e6eb;
  border-radius: 4px;
  background: #fff;
  font-size: 13px;
  line-height: 1.4;
  color: #485169;
  cursor: pointer;
  transition: all .2s;
  white-space: nowrap;
}
.type-tabs-desk .type-tab::after { display: none; }
.type-tabs-desk .type-tab:hover {
  border-color: #7c3aed;
  color: #7c3aed;
}
.type-tabs-desk .type-tab.active {
  border-color: #7c3aed;
  color: #7c3aed;
  background: #f7f4ff;
  font-weight: 600;
}
.first-select-mob { display: none !important; }

@media (max-width: 960px) {
  .type-tabs-desk { display: none !important; }
  .first-select-mob { display: inline-block !important; }
}

/* 类别行与地区行各占一行(2026-10-27) */
.filter-head .cat-line,
.filter-head .zone-line {
  flex: 1 1 100%;
  width: 100%;
}
.filter-head .cat-line {
  margin-bottom: 0;
}
.filter-head .zone-line {
  margin-bottom: 0;
}
@media (max-width: 960px) {
  .filter-head .cat-line {
    flex: 1 1 0;
  }
}

/* ==========================================================================
   1024yun · 购物车移动端专项（≤960px）
   1) 合并双顶栏  2) 商品卡紧凑化  3) 筛选收进抽屉
   ========================================================================== */
@media (max-width: 960px) {

  /* ---------- 1. 合并双顶栏 ---------- */
  /* 隐藏 yun-topbar 注入的品牌条，改为把系统栏做成品牌条（保留汉堡菜单） */
  .yun-topbar { display: none !important; }

  .el-header { top: 0 !important; }
  .el-header i,
  .el-header span,
  .el-header .el-dropdown,
  .el-header .header-right { color: #e9e4ff !important; }
  .el-main { margin-top: 52px !important; padding-top: 10px !important; }
  .el-aside { top: 0 !important; height: 100vh !important; }

  /* ---------- 3. 筛选收进抽屉 ---------- */
  .m-filter-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 0 12px;
  }
  .m-fbtn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex: 1;
    height: 38px;
    padding: 0 14px;
    border: 1px solid #e6e2f2;
    border-radius: 10px;
    background: #fff;
    font-size: 13.5px;
    color: #5a6478;
  }
  .m-fbtn > span { color: #1e2736; font-weight: 600; }
  .m-fbtn em {
    font-style: normal;
    color: #7c3aed;
    font-size: 12.5px;
    max-width: 9em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .m-fbtn i:last-child { margin-left: auto; color: #9aa3b2; }
  .m-fcnt { flex: 0 0 auto; font-size: 12.5px; color: #8a93a5; }

  /* 折叠态隐藏筛选行 */
  .filter-head { display: none; }
  .filter-head.m-open {
    display: block;
    padding: 4px 0 12px;
    border-bottom: 1px solid #f0eef7;
    margin-bottom: 12px;
  }
  /* 抽屉内的类别标签横向可滑 */
  .filter-head.m-open .type-tabs-desk {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 8px;
    padding-bottom: 6px;
    -webkit-overflow-scrolling: touch;
  }
  .filter-head.m-open .type-tabs-desk::-webkit-scrollbar { display: none; }
  .filter-head.m-open .type-tab { flex: 0 0 auto; }

  /* ---------- 2. 商品卡紧凑化 ---------- */
  /* 手机上不铺整段参数，改用一行摘要 */
  .goods-description { display: none !important; }

  .shopping-item { padding: 14px 14px 12px !important; border-radius: 14px !important; }
  .m-spec {
    font-size: 12.5px;
    line-height: 1.6;
    color: #6b7280;
    margin: 6px 0 2px;
    word-break: break-all;
  }
  .m-spec b { color: #1e2736; font-weight: 600; }
  .goods-name-text { font-size: 15px !important; }
  /* 价格行：价格不换行，按钮固定宽度（不做通栏，避免挤压价格） */
  .price-box {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
  }
  .price-box-left { flex: 1 1 auto; min-width: 0; }
  .item-price { white-space: nowrap; font-size: 19px !important; }
  .shopping-item .buy-btn {
    flex: 0 0 auto;
    width: auto !important;
    min-width: 104px;
    height: 40px !important;
    padding: 0 18px !important;
    border-radius: 10px !important;
    font-size: 14.5px !important;
  }
}

/* 桌面端不显示移动专用块 */
@media (min-width: 961px) {
  .m-filter-bar, .m-spec { display: none !important; }
}

/* ==========================================================================
   移动端：搜索行修复 + 筛选三个下拉同行
   ========================================================================== */
@media (max-width: 960px) {

  /* ---- 1. 搜索行：输入框自适应，不再固定 3rem 导致左溢出 ---- */
  .search-tools {
    display: flex !important;
    align-items: center;
    gap: 8px;
    width: 100%;
    flex-wrap: nowrap;
  }
  .search-tools .search-input {
    flex: 1 1 auto;
    width: auto !important;
    min-width: 0;
    margin: 0 !important;
  }
  .search-tools .search-input .el-input__inner {
    height: 40px !important;
    line-height: 40px;
    border-radius: 10px !important;
  }
  .search-tools .search-btn {
    flex: 0 0 auto;
    width: auto !important;
    min-width: 64px;
    height: 40px !important;
    padding: 0 16px !important;
    margin: 0 !important;
    border-radius: 10px !important;
  }
  /* 商品数量已经显示在筛选条右侧，这里不重复 */
  .search-tools .goods-count { display: none !important; }

  /* ---- 2. 筛选展开：类别 / 地区 / 城市 三个下拉排成一行 ---- */
  .filter-head.m-open {
    display: flex !important;
    flex-wrap: nowrap;
    align-items: center;
    gap: 8px;
    padding: 4px 0 12px;
    border-bottom: 1px solid #f0eef7;
    margin-bottom: 12px;
  }
  /* 让两条 filter-line 的直子元素直接参与外层 flex 排布 */
  .filter-head.m-open .filter-line { display: contents; }
  /* 隐藏标签和桌面端的标签组，手机只用下拉 */
  .filter-head.m-open .filter-label,
  .filter-head.m-open .type-tabs-desk { display: none !important; }
  .filter-head.m-open .el-select {
    flex: 1 1 0;
    min-width: 0;
    width: auto !important;
    max-width: calc((100% - 16px) / 3);
  }
  .filter-head.m-open .el-select .el-input__inner {
    height: 38px !important;
    line-height: 38px;
    padding: 0 8px;
    font-size: 12.5px;
    border-radius: 10px !important;
  }
  .filter-head.m-open .el-select .el-input__suffix { right: 4px; }
}

/* ==========================================================================
   移动端：商品卡片 2×2（机型名 + 6 项配置 + 价格 + 购买）
   ========================================================================== */
@media (max-width: 960px) {

  .shopping-item .goods-description,
  .shopping-item .m-spec,
  .shopping-item .goods-tag,
  .shopping-item .goods-active,
  .shopping-item .client-box,
  .shopping-item .qty-box,
  .shopping-item .original-price {
    display: none !important;
  }

  /* 分页容器：横向滚动 + 吸附 */
  .goods-list-div {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory !important;
    gap: 0 !important;
    -webkit-overflow-scrolling: touch;
  }
  .goods-list-div::-webkit-scrollbar { display: none; }

  /* 每页：2×2 网格 */
  .goods-page {
    flex: 0 0 100%;
    scroll-snap-align: start;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    align-content: start;
  }

  /* 分页切换标志 */
  .goods-dots {
    display: flex;
    justify-content: center;
    gap: 6px;
    padding: 14px 0 4px;
  }
  .goods-dots i {
    width: 6px; height: 6px; border-radius: 3px;
    background: #d9dce3; transition: all .2s;
  }
  .goods-dots i.on { width: 16px; background: #f97316; }

  /* 卡片：纵向 */
  .shopping-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    padding: 14px 13px 13px !important;
    margin: 0 !important;
    border-radius: 14px !important;
    min-height: 0 !important;
  }

  .shopping-item .goods-content {
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0;
    width: 100% !important;
    flex: 1 1 auto;
  }

  /* 机型名（最多 2 行） */
  .shopping-item .goods-name {
    margin: 0 !important;
    display: block !important;
    text-align: left !important;
  }
  .shopping-item .goods-name-text {
    font-size: 14px !important;
    font-weight: 600;
    line-height: 1.4;
    min-height: 40px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  /* 6 项配置 */
  .shopping-item .spec-rows {
    margin-top: 8px;
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 10px 12px;
    background: #f8f9fb;
    border-radius: 9px;
  }
  .shopping-item .spec-rows .r {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 11.5px;
    line-height: 1.45;
  }
  .shopping-item .spec-rows .r span { color: #8a93a5; }
  .shopping-item .spec-rows .r b { color: #1e2736; font-weight: 600; }

  /* 价格 + 按钮（吸底） */
  .shopping-item .price-box {
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 6px !important;
    margin: auto 0 0 !important;
    padding-top: 12px !important;
    border-top: 1px dashed #eef0f3;
  }
  .shopping-item .price-box-left { flex: 0 1 auto; min-width: 0; }
  .shopping-item .item-price {
    font-size: 16px !important;
    font-weight: 700;
    white-space: nowrap;
  }
  .shopping-item .item-price-cycle { font-size: 11px; }
  .shopping-item .buy-btn {
    flex: 0 0 auto;
    width: auto !important;
    min-width: 58px;
    height: 34px !important;
    padding: 0 12px !important;
    margin: 0 !important;
    font-size: 13px !important;
    border-radius: 9px !important;
  }
}
/* ==========================================================================
   页脚（与官网 footer.html 共用结构）
   ========================================================================== */
.footer { background:#2a1c52; color:#8a92a3; padding:46px 0 0; margin-top:40px; }
.footer .wide { max-width:1280px; margin:0 auto; padding:0 28px; }
.grad-text { background:linear-gradient(120deg,#a78bfa,#fb923c); -webkit-background-clip:text; background-clip:text; color:transparent; }
.ft-in { display:flex; gap:56px; padding-bottom:36px; }
.ft-brand { flex:1.5; color:#fff; font-size:18px; font-weight:700; }
.ft-brand p { font-weight:400; font-size:13px; color:#6d7688; margin-top:12px; max-width:280px; }
.ft-col { flex:1; display:flex; flex-direction:column; gap:9px; }
.ft-col b { color:#fff; margin-bottom:4px; }
.ft-col a { color:#6d7688; font-size:13px; }
.ft-col a:hover { color:#fff; }
.ft-links { display:flex; align-items:center; flex-wrap:wrap; gap:10px; padding:0 0 18px; font-size:12.5px; color:#59627a; }
.ft-links a { color:#8a92a3; padding:3px 12px; border:1px solid #242c40; border-radius:4px; }
.ft-links a:hover { color:#fff; border-color:#3d4864; }
.ft-bar { border-top:1px solid #332763; padding:16px 0; text-align:center; font-size:12px; color:#59627a; }
.ft-bar a { color:#59627a; }
.ft-mobile { display:none; }
@media (max-width: 640px) {
  .footer { margin-top:30px; padding-top:32px; }
  .footer .wide { padding:0 16px; }
  .ft-in, .ft-links { display:none !important; }
  .ft-mobile { display:flex; flex-wrap:wrap; justify-content:center; gap:8px 18px; padding:20px 16px 0; }
  .ft-mobile a { color:#9aa0a8; font-size:13px; }
  .ft-mobile a:hover { color:#fff; }
  .ft-bar { text-align:center; font-size:11.5px; padding:12px 0 16px; }
}

/* 筛选按钮在搜索行内：紧凑、不占满 */
.search-tools .m-fbtn {
  flex: 0 0 auto !important;
  padding: 0 12px !important;
  height: 38px;
}
.search-tools .m-fbtn em { display: none; }

/* ========== 2026-10-28 订购页移动端：分类横滑胶囊(4px倒角) + 去搜索 ========== */
@media (max-width: 960px) {
  /* 隐藏搜索框 + 查询 + 筛选按钮 */
  .search-tools,
  .filter-head .search-tools,
  .m-fbtn { display: none !important; }

  /* 筛选区改为纵向两行 */
  .filter-head {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
  }
  .filter-head .filter-line {
    flex: 1 1 100% !important;
    width: 100% !important;
    min-width: 0 !important;
  }
  .filter-head .filter-label { display: none !important; }

  /* 类别：横滑胶囊（直角 + 4px 倒角） */
  .filter-head .type-tabs.type-tabs-desk {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    gap: 8px !important;
    padding-bottom: 2px !important;
    scrollbar-width: none !important;
    -webkit-overflow-scrolling: touch !important;
  }
  .filter-head .type-tabs.type-tabs-desk::-webkit-scrollbar { display: none !important; }
  .filter-head .type-tabs-desk .type-tab {
    flex: 0 0 auto !important;
    height: 34px !important;
    line-height: 32px !important;
    padding: 0 15px !important;
    border-radius: 4px !important;
    border: 1px solid #e9e5f7 !important;
    background: #fff !important;
    font-size: 12.5px !important;
    color: #5a6478 !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
    font-weight: 400 !important;
  }
  .filter-head .type-tabs-desk .type-tab.active {
    background: linear-gradient(120deg, #7c3aed, #a78bfa) !important;
    border-color: transparent !important;
    color: #fff !important;
    font-weight: 600 !important;
  }
  /* 移动端下拉类别隐藏 */
  .filter-head .first-select.first-select-mob { display: none !important; }

  /* 地区 + 城市：并排两个下拉 */
  .filter-head .zone-line {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
  }
  .filter-head .zone-select,
  .filter-head .city-select {
    width: auto !important;
    flex: 1 1 0 !important;
    min-width: 0 !important;
  }
  .filter-head .zone-select .el-input__inner,
  .filter-head .city-select .el-input__inner {
    height: 38px !important;
    line-height: 38px !important;
    border-radius: 10px !important;
    font-size: 13px !important;
  }
}

/* ========== 2026-10-28 桌面端修复：介绍区裁切 + 卡片写死高度 ========== */
@media (min-width: 861px) {
  /* 卡片不再写死高度，按内容自然撑开 */
  .shopping-item {
    height: auto !important;
    min-height: 0 !important;
  }
  /* 介绍区限制高度 + 可滚动 + 底部渐隐提示 */
  .shopping-item .goods-description {
    position: relative;
    flex: none !important;
    min-height: 0 !important;
    max-height: 210px !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    padding: 16px 18px 14px !important;
    background: #f7f8fa !important;
  }
  /* 滚动条常显但很细 */
  .shopping-item .goods-description::-webkit-scrollbar { width: 4px; }
  .shopping-item .goods-description::-webkit-scrollbar-track { background: transparent; }
  .shopping-item .goods-description::-webkit-scrollbar-thumb {
    background: #cfd4de; border-radius: 2px;
  }
  .shopping-item:hover .goods-description::-webkit-scrollbar-thumb { background: #aab1c0; }

  /* 介绍区底部渐隐，暗示「下面还有」 */
  .shopping-item .goods-description::after {
    content: "";
    position: sticky;
    bottom: -14px;
    display: block;
    height: 26px;
    margin: 0 -18px -14px;
    background: linear-gradient(180deg, rgba(247, 248, 250, 0), #f7f8fa 85%);
    pointer-events: none;
  }

  /* 内容区（标题+规格+价格）保持自然高度 */
  .shopping-item .goods-content {
    flex: 1 1 auto !important;
    display: flex;
    flex-direction: column;
  }
  .shopping-item .goods-content > *:last-child { margin-top: auto; }
}

/* ========== 2026-10-28 桌面端：去掉卡片介绍区（与移动端一致） ========== */
@media (min-width: 861px) {
  .shopping-item .goods-description { display: none !important; }
  .shopping-item {
    height: auto !important;
    min-height: 0 !important;
    padding: 16px 18px 14px !important;
    justify-content: flex-start !important;
  }
  .shopping-item .goods-content {
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    padding: 0 !important;
  }
  .shopping-item .goods-name { margin-top: 0 !important; }
  /* 价格/购买按钮吸底，卡片高度由内容决定 */
  .shopping-item .goods-price-box,
  .shopping-item .goods-buy { margin-top: auto !important; }
}

/* ========== 2026-10-28 桌面端修正：保留介绍区，去掉规格列表 ========== */
@media (min-width: 861px) {
  /* 恢复介绍区 */
  .shopping-item .goods-description {
    display: block !important;
    order: 1 !important;
    flex: none !important;
    min-height: 0 !important;
    max-height: 300px !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    margin: 0 !important;
    padding: 16px 18px 14px !important;
    background: #f7f8fa !important;
    border: 0 !important;
    border-top: 0 !important;
    font-size: 13px;
    line-height: 1.85;
    color: #485169;
  }
  .shopping-item .goods-description::-webkit-scrollbar { width: 4px; }
  .shopping-item .goods-description::-webkit-scrollbar-track { background: transparent; }
  .shopping-item .goods-description::-webkit-scrollbar-thumb { background: #cfd4de; border-radius: 2px; }
  .shopping-item:hover .goods-description::-webkit-scrollbar-thumb { background: #aab1c0; }

  /* 去掉重复的规格列表 */
  .shopping-item .spec-rows { display: none !important; }

  /* 卡片高度自适应 */
  .shopping-item {
    height: auto !important;
    min-height: 0 !important;
    padding: 0 0 14px !important;
  }
  .shopping-item .goods-content {
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    padding: 0 18px !important;
  }
  .shopping-item .goods-name { margin-top: 12px !important; }
  /* 价格行吸底 */
  .shopping-item .price-box { margin-top: auto !important; padding-top: 12px !important; }
}

/* ========== 2026-10-28 桌面端：介绍区完整显示，不再截断 ========== */
@media (min-width: 861px) {
  .shopping-item .goods-description {
    max-height: none !important;
    height: auto !important;
    overflow: visible !important;
    flex: none !important;
  }
  /* 去掉滚动条相关（不再需要滚动） */
  .shopping-item .goods-description::-webkit-scrollbar { display: none !important; }
  /* 卡片高度完全自适应 */
  .shopping-item { height: auto !important; min-height: 0 !important; align-self: start !important; }
  /* 价格行不吸底，紧跟在标题下方 */
  .shopping-item .price-box { margin-top: 10px !important; padding-top: 0 !important; }
}

/* ========== 2026-10-28 桌面端：卡片同行等高（高度取该行最高者） ========== */
@media (min-width: 861px) {
  /* 恢复 grid 拉伸行为 */
  .shopping-item {
    align-self: stretch !important;
    height: 100% !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
  }
  /* 内容区纵向 flex，价格吸底 */
  .shopping-item .goods-content {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    padding: 0 18px !important;
  }
  .shopping-item .price-box {
    margin-top: auto !important;
    padding-top: 12px !important;
  }
  /* 介绍区完整显示（不截断、不滚动） */
  .shopping-item .goods-description {
    max-height: none !important;
    overflow: visible !important;
    flex: none !important;
  }
  /* 规格列表保持隐藏 */
  .shopping-item .spec-rows { display: none !important; }
}

/* ========== 2026-10-28 修正：去掉 height:100%，靠 grid 默认 stretch 等高 ========== */
@media (min-width: 861px) {
  .shopping-item {
    height: auto !important;
    align-self: stretch !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
  }
  .shopping-item .goods-content {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
  }
  .shopping-item .price-box {
    margin-top: auto !important;
  }
}

/* ========== 2026-10-28 桌面端：卡片统一固定高度（取内容最高者 640px） ========== */
@media (min-width: 861px) {
  .shopping-item {
    height: 640px !important;
    min-height: 640px !important;
    max-height: 640px !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
  }
  /* 介绍区在固定高度内完整显示，超出则滚动 */
  .shopping-item .goods-description {
    flex: 0 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
  }
  .shopping-item .goods-description::-webkit-scrollbar { width: 4px; }
  .shopping-item .goods-description::-webkit-scrollbar-thumb { background: #cfd4de; border-radius: 2px; }
  /* 内容区：标题在上，价格吸底 */
  .shopping-item .goods-content {
    flex: 0 0 auto !important;
    display: flex !important;
    flex-direction: column !important;
  }
  .shopping-item .price-box {
    margin-top: auto !important;
    padding-top: 12px !important;
  }
  /* 规格列表保持隐藏 */
  .shopping-item .spec-rows { display: none !important; }
}

/* ========== 2026-10-28 桌面端：卡片高度收紧，减少按钮区空白 ========== */
@media (min-width: 861px) {
  .shopping-item {
    height: 560px !important;
    min-height: 560px !important;
    max-height: 560px !important;
  }
  /* 价格行紧贴标题，不再吸底留大空白 */
  .shopping-item .price-box {
    margin-top: 12px !important;
    padding-top: 12px !important;
    border-top: 1px solid #f0f2f5 !important;
  }
  /* 剩余空间放在介绍区下方（介绍多占一点） */
  .shopping-item .goods-description { flex: 1 1 auto !important; }
}

/* ========== 2026-10-28 桌面端：标题单行、取消标题下方空白 ========== */
@media (min-width: 861px) {
  /* 取消 space-between 撑开的空白 */
  .shopping-item .goods-content {
    justify-content: flex-start !important;
  }
  /* 产品名只留一行，超出省略 */
  .shopping-item .goods-name {
    margin: 10px 0 0 !important;
    min-height: 0 !important;
  }
  .shopping-item .goods-name .goods-name-text {
    display: block !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
  }
  /* 隐藏空的活动标签占位（原来 23px 空块） */
  .shopping-item .goods-active:empty { display: none !important; }
  /* 价格行紧接标题 */
  .shopping-item .price-box {
    margin-top: 10px !important;
    padding-top: 10px !important;
  }
  /* 介绍区吃掉剩余高度 */
  .shopping-item .goods-description { flex: 1 1 auto !important; }
}

/* ========== 2026-10-28 桌面端：介绍区两列 + 卡片 420px ========== */
@media (min-width: 861px) {
  .shopping-item {
    height: 420px !important;
    min-height: 420px !important;
    max-height: 420px !important;
    overflow: hidden !important;
  }
  .shopping-item .goods-description {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: hidden !important;
    column-count: 1 !important;
    column-gap: 14px !important;
    column-rule: none;
    padding: 14px 16px !important;
    font-size: 12.5px !important;
    line-height: 1.7 !important;
  }
  /* 小标题不与内容分离 */
  .shopping-item .goods-description strong {
    break-after: avoid !important;
    break-inside: avoid !important;
    margin: 6px 0 1px !important;
    font-size: 12.5px !important;
  }
  .shopping-item .goods-description strong:first-child { margin-top: 0 !important; }
  /* 去掉之前加的渐隐伪元素（会破坏分栏） */
  .shopping-item .goods-description::after { display: none !important; }
  .shopping-item .goods-description::-webkit-scrollbar { display: none !important; }
}

/* ========== 2026-10-28 恢复单列介绍 + 卡片 480px（可滚动） ========== */
@media (min-width: 861px) {
  .shopping-item {
    height: 480px !important;
    min-height: 480px !important;
    max-height: 480px !important;
    overflow: hidden !important;
  }
  .shopping-item .goods-description {
    column-count: 1 !important;
    column-rule: none !important;
    column-gap: 0 !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 14px 16px !important;
    font-size: 12.5px !important;
    line-height: 1.75 !important;
  }
  .shopping-item .goods-description::-webkit-scrollbar { width: 4px; display: block !important; }
  .shopping-item .goods-description::-webkit-scrollbar-track { background: transparent; }
  .shopping-item .goods-description::-webkit-scrollbar-thumb { background: #cfd4de; border-radius: 2px; }
  .shopping-item:hover .goods-description::-webkit-scrollbar-thumb { background: #aab1c0; }
  .shopping-item .goods-description strong {
    break-after: auto !important;
    break-inside: auto !important;
    margin: 6px 0 1px !important;
    font-size: 12.5px !important;
  }
  .shopping-item .goods-description strong:first-child { margin-top: 0 !important; }
}

/* ========== 2026-10-28 卡片：只显示到「存储配置」，其余点展开 ========== */
@media (min-width: 861px) {
  /* 卡片高度改为自适应，展开时可增高 */
  .shopping-item {
    height: auto !important;
    min-height: 400px !important;
    max-height: none !important;
    align-self: start !important;
  }
  /* 介绍默认截断在「存储配置」之后 */
  .shopping-item .goods-description {
    max-height: 208px !important;
    overflow: hidden !important;
    flex: 0 0 auto !important;
    position: relative;
  }
  .shopping-item .goods-description.is-open {
    max-height: none !important;
    overflow: visible !important;
  }
  /* 截断时底部渐隐 */
  .shopping-item .goods-description:not(.is-open)::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 28px;
    background: linear-gradient(180deg, rgba(247,248,250,0), #f7f8fa 90%);
    pointer-events: none;
    display: block !important;
  }
  /* 展开按钮 */
  .shopping-item .desc-toggle {
    display: inline-flex !important;
    align-items: center;
    gap: 3px;
    margin: 0 !important;
    padding: 4px 16px 8px !important;
    font-size: 11.5px !important;
    color: #7c3aed !important;
    font-weight: 600 !important;
    cursor: pointer;
    background: #f7f8fa !important;
    user-select: none;
  }
  .shopping-item .desc-toggle:hover { color: #6d28d9 !important; }
  .shopping-item .desc-toggle i { font-size: 11px; }

  /* 标题与价格之间的空隙压缩 */
  .shopping-item .goods-content {
    flex: 0 0 auto !important;
    justify-content: flex-start !important;
  }
  .shopping-item .goods-name { margin: 8px 0 0 !important; }
  .shopping-item .goods-active:empty { display: none !important; }
  .shopping-item .price-box {
    margin-top: 8px !important;
    padding-top: 8px !important;
  }
}

/* ========== 2026-10-28 修正：单列 + 按钮在介绍下方 ========== */
@media (min-width: 861px) {
  .shopping-item .goods-description {
    column-count: 1 !important;
    column-rule: none !important;
    column-gap: 0 !important;
    order: 1 !important;
    max-height: 208px !important;
    overflow: hidden !important;
    flex: 0 0 auto !important;
  }
  .shopping-item .goods-description.is-open {
    max-height: none !important;
    overflow: visible !important;
  }
  .shopping-item .desc-toggle {
    order: 2 !important;
    display: flex !important;
    justify-content: flex-start !important;
    width: 100% !important;
  }
  .shopping-item .goods-content {
    order: 3 !important;
  }
  /* 取消最小高度造成的空白 */
  .shopping-item {
    min-height: 0 !important;
    height: auto !important;
  }
}

/* ========== 2026-10-28 强制单列：重置所有分栏相关属性 ========== */
@media (min-width: 861px) {
  .shopping-item .goods-description {
    columns: auto !important;
    column-count: auto !important;
    column-width: auto !important;
    column-fill: auto !important;
    column-span: none !important;
    column-gap: normal !important;
    column-rule: none !important;
    display: block !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
  }
  /* 内部元素全部回归正常流 */
  .shopping-item .goods-description > *,
  .shopping-item .goods-description > * > * {
    float: none !important;
    position: static !important;
    display: block !important;
    max-width: 100% !important;
  }
  .shopping-item .goods-description strong {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  .shopping-item .goods-description img {
    display: inline-block !important;
    width: 14px !important;
    height: 14px !important;
  }
}

/* ========== 2026-10-28 修复：恢复介绍区图标 ========== */
@media (min-width: 861px) {
  .shopping-item .goods-description img {
    display: inline-block !important;
    width: 14px !important;
    height: 14px !important;
    max-width: 14px !important;
    vertical-align: -2px !important;
    margin-right: 4px !important;
    position: static !important;
    float: none !important;
  }
  /* strong 内部保持行内流（文字 + 图标同一行） */
  .shopping-item .goods-description strong {
    display: block !important;
    width: 100% !important;
  }
  .shopping-item .goods-description strong > * {
    display: inline !important;
    position: static !important;
    float: none !important;
  }
  .shopping-item .goods-description strong img {
    display: inline-block !important;
  }
}

/* ========== 2026-10-28 修复：鼠标在介绍区时页面可正常滚动 ========== */
@media (min-width: 861px) {
  .shopping-item .goods-description {
    overscroll-behavior: auto !important;
    overscroll-behavior-y: auto !important;
    touch-action: auto !important;
    pointer-events: auto !important;
  }
}

/* ========== 2026-10-28 去掉标题与价格之间的隐形占位空白 ========== */
@media (min-width: 861px) {
  /* 隐藏 opacity:0 的「暂无信息」占位文字 */
  .shopping-item .goods-active .active-name[style*="opacity"] {
    display: none !important;
  }
  .shopping-item .goods-active {
    margin: 0 !important;
    padding: 0 !important;
    min-height: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
  }
  /* 有真实活动标签时才恢复高度 */
  .shopping-item .goods-active:not(:has(.active-name[style*="opacity"])) {
    height: auto !important;
    margin-bottom: 6px !important;
  }
  /* 标题直接接分隔线 */
  .shopping-item .goods-name { margin: 8px 0 0 !important; }
  .shopping-item .price-box { margin-top: 8px !important; padding-top: 8px !important; }
}

/* ========== 2026-10-28 卡片之间留出间隙 ========== */
@media (min-width: 861px) {
  /* 横向：4 列之间 18px */
  .goods-list-div {
    column-gap: 18px !important;
    row-gap: 0 !important;
  }
  /* 纵向：同列卡片之间 18px */
  .goods-page > .shopping-item {
    margin-bottom: 18px !important;
  }
  .goods-page > .shopping-item:last-child {
    margin-bottom: 0 !important;
  }
}

/* ========== 2026-10-28 修复 footer：标题继承 html 的 75px rem 基准 ========== */
.footer .ft-col b,
.footer .ft-col strong {
  font-size: 15px !important;
  line-height: 1.4 !important;
  font-weight: 700 !important;
}
.footer .ft-brand { font-size: 18px !important; }
.footer .ft-brand p { font-size: 13px !important; }
.footer .ft-brand .grad-text { font-size: inherit !important; }
.footer .ft-col a { font-size: 13px !important; }
.footer .ft-links,
.footer .ft-links a,
.footer .ft-links span { font-size: 12.5px !important; }
.footer .ft-mobile a { font-size: 13px !important; }
.footer .ft-bar,
.footer .ft-bar a { font-size: 12px !important; }

/* ========== 2026-10-29 修复桌面端商品列表「竖排」 ==========
   原因：10-28 为手机端 2×2 分页加了 .goods-page 包裹层（每页 4 个），
        但桌面端没有任何 .goods-page 样式 → 它是普通 block，
        外层 .goods-list-div 的 4 列 grid 作用在「页」上，
        卡片在页内竖着堆（沈阳只有 4 个 = 1 页 = 一列 4 张）。
   修法：桌面端让包裹层 display:contents 退出布局，卡片重新成为网格项。 */
@media (min-width: 961px) {
  .goods-page { display: contents !important; }
  .goods-list-div { row-gap: 18px !important; }
  .goods-page > .shopping-item { margin-bottom: 0 !important; }
}