/* ============================================================
   购物车 · 新版（/cart）
   与 note2 / checkout2 / me2 共用一套设计语言：
   米色底 + 白色大圆角卡 + 黑色系 CTA + 无衬线价格
   类名统一 ct2- 前缀，作用域限定 .ct2-page（不影响老页面）
   ============================================================ */

.ct2-page{
  background:var(--bg);
  min-height:100vh;
  padding-bottom:calc(100px + var(--safe-b));
  -webkit-text-size-adjust:100%;
}

/* ---------- 顶部栏（毛玻璃粘性） ---------- */
.ct2-top{
  position:sticky;top:0;z-index:30;
  background:rgba(250,248,245,.86);
  -webkit-backdrop-filter:saturate(180%) blur(16px);
  backdrop-filter:saturate(180%) blur(16px);
  border-bottom:1px solid var(--line-2);
}
.ct2-top .in{
  position:relative;display:flex;align-items:center;justify-content:space-between;
  height:50px;padding:0 12px;
}
.ct2-top .bk{
  width:34px;height:34px;flex:none;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  color:var(--ink);text-decoration:none;
}
.ct2-top .bk svg{width:20px;height:20px}
.ct2-top .bk:active{background:var(--bg-sunk)}
.ct2-top .tt{
  font-size:15px;font-weight:600;color:var(--ink);letter-spacing:.08em;
}
.ct2-top .pr{
  font-size:11.5px;color:var(--muted);letter-spacing:.02em;
  font-variant-numeric:tabular-nums;
  min-width:34px;text-align:right;
}

/* ---------- 主体 ---------- */
.ct2-body{padding:14px 14px 0}

@keyframes ct2Rise{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:none}
}
.ct2-slogan,.ct2-sec,.ct2-empty{animation:ct2Rise .5s var(--ease-out) both}
.ct2-sec:nth-of-type(2){animation-delay:.06s}
.ct2-sec:nth-of-type(3){animation-delay:.12s}

/* ---------- 空态 ---------- */
.ct2-empty{
  padding:56px 22px 30px;text-align:center;
}
.ct2-empty .ic{
  width:74px;height:74px;margin:0 auto 18px;border-radius:50%;
  background:var(--bg-sunk);color:var(--line);
  display:flex;align-items:center;justify-content:center;
}
.ct2-empty .ic svg{width:32px;height:32px}
.ct2-empty .t{
  font-size:16px;font-weight:600;color:var(--ink);letter-spacing:.04em;
}
.ct2-empty .d{
  margin-top:9px;font-size:12.5px;line-height:1.8;color:var(--faint);
  letter-spacing:.02em;
}
.ct2-empty .ct2-btn{margin-top:22px;max-width:200px;margin-left:auto;margin-right:auto}

/* 主按钮（黑色系，全站统一） */
.ct2-btn{
  display:flex;align-items:center;justify-content:center;
  height:46px;border:0;border-radius:14px;
  background:var(--ink);color:#F5F1EA;
  font-family:var(--sans);font-size:14px;font-weight:600;letter-spacing:.06em;
  text-decoration:none;cursor:pointer;
  transition:transform .18s var(--ease);
}
.ct2-btn:active{transform:scale(.985)}

/* ---------- 满减提示条 ---------- */
.ct2-slogan{
  display:flex;align-items:center;gap:8px;
  padding:11px 14px;border-radius:14px;
  background:var(--gold-soft);border:1px solid var(--line-gold);
}
.ct2-slogan .tag{
  flex:none;padding:2px 7px;border-radius:6px;
  background:var(--ink);color:#F5F1EA;
  font-size:10px;font-weight:600;letter-spacing:.06em;
}
.ct2-slogan .tx{
  font-size:12px;color:#7A6140;letter-spacing:.02em;line-height:1.5;
}

/* ---------- 卡片 ---------- */
.ct2-sec{
  margin-top:12px;padding:16px;border-radius:20px;
  background:var(--surface);border:1px solid var(--line-2);
}
.ct2-sec .hd{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:12px;
}
.ct2-sec .hd .t{
  font-size:14.5px;font-weight:600;color:var(--ink);letter-spacing:.05em;
}
.ct2-sec .hd .n{
  font-size:12px;color:var(--muted);text-decoration:none;letter-spacing:.02em;
  padding:8px 0;margin:-8px 0;
}
.ct2-sec .hd .n:active{opacity:.6}

/* ---------- 宝贝清单 ---------- */
.ct2-list{display:flex;flex-direction:column;gap:12px}
.ct2-item{
  position:relative;display:flex;align-items:flex-start;gap:12px;
  padding-bottom:12px;border-bottom:1px solid var(--line-2);
}
.ct2-item:last-child{padding-bottom:0;border-bottom:0}
.ct2-item .cv{
  position:relative;flex:none;width:78px;height:98px;border-radius:14px;overflow:hidden;
  background:var(--bg-sunk);display:block;
}
.ct2-item .cv img{width:100%;height:100%;object-fit:cover;display:block}
.ct2-item .cv .sd{
  position:absolute;left:0;right:0;bottom:0;
  padding:3px 0 4px;text-align:center;
  background:rgba(23,19,16,.62);color:#F5F1EA;
  font-size:10px;letter-spacing:.08em;
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
}
.ct2-item .gi{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px;padding-right:34px}
.ct2-item .bd{
  font-size:9.5px;color:var(--gold);letter-spacing:.14em;text-transform:uppercase;
}
.ct2-item .tt{
  font-size:13.5px;font-weight:500;color:var(--ink);line-height:1.5;
  text-decoration:none;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.ct2-item .pp{
  font-family:var(--sans);font-size:16px;font-weight:700;color:var(--ink);
  letter-spacing:-.01em;font-variant-numeric:tabular-nums;margin-top:2px;
}
.ct2-item .chg{
  font-size:11px;color:var(--faint);line-height:1.5;
}
.ct2-item .rsn{
  font-size:11.5px;color:#9A5B3F;line-height:1.5;
}
/* 买不了：整条降饱和，一眼区分 */
.ct2-item.off .cv img{filter:grayscale(.6);opacity:.7}
.ct2-item.off .tt,.ct2-item.off .pp{color:var(--muted)}

/* 移除：右上角图标按钮（点击区 36×36） */
.ct2-item .rm{
  position:absolute;right:-4px;top:-2px;
  width:36px;height:36px;padding:0;border:0;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:transparent;color:var(--faint);cursor:pointer;
  transition:background .18s var(--ease),color .18s var(--ease);
}
.ct2-item .rm svg{width:15px;height:15px}
.ct2-item .rm:active{background:var(--bg-sunk);color:var(--ink-2)}

/* ---------- 凑单进度 ---------- */
.ct2-progress{
  padding:12px 13px;border-radius:14px;margin-bottom:14px;
  background:var(--bg-sunk);
}
.ct2-progress .row{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  font-size:12px;color:var(--ink-2);letter-spacing:.02em;
}
.ct2-progress .row b{
  font-family:var(--sans);font-weight:700;color:var(--ink);
  font-variant-numeric:tabular-nums;
}
.ct2-progress .row a{
  flex:none;color:var(--gold);text-decoration:none;font-size:12px;
}
.ct2-progress .bar{
  margin-top:9px;height:4px;border-radius:999px;
  background:rgba(23,19,16,.09);overflow:hidden;
}
.ct2-progress .bar i{
  display:block;height:100%;border-radius:999px;background:var(--ink);
  /* 金额很小时也留一点可见宽度，否则空槽看着像坏了 */
  min-width:4px;
  transition:width .4s var(--ease-out);
}

/* ---------- 金额明细 ---------- */
.ct2-sum{display:flex;flex-direction:column}
.ct2-sum .row{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:7px 0;font-size:13px;color:var(--muted);
}
.ct2-sum .row .v{
  color:var(--ink-2);font-variant-numeric:tabular-nums;
}
.ct2-sum .row.save .v{color:var(--ink);font-weight:600}
.ct2-sum .row .pill{
  margin-left:5px;padding:1px 6px;border-radius:5px;
  background:var(--ink);color:#F5F1EA;
  font-size:10px;letter-spacing:.04em;
}
.ct2-sum .row.total{
  margin-top:6px;padding-top:12px;border-top:1px solid var(--line-2);
  font-size:13px;color:var(--ink);
}
.ct2-sum .row.total .v{
  font-family:var(--sans);font-size:21px;font-weight:700;color:var(--ink);
  letter-spacing:-.02em;font-variant-numeric:tabular-nums;
}
.ct2-note{
  margin-top:12px;font-size:11px;line-height:1.7;color:var(--faint);
  letter-spacing:.02em;
}

/* ---------- 底栏（实心 + 安全区） ---------- */
.ct2-bar{
  position:fixed;left:0;right:0;bottom:0;z-index:80;
  display:flex;align-items:center;gap:12px;
  padding:11px 14px calc(11px + var(--safe-b));
  background:var(--bg);
  border-top:1px solid var(--line);
}
.ct2-bar .cnt{
  flex:none;font-size:12.5px;color:var(--muted);letter-spacing:.02em;
}
.ct2-bar .cnt b{
  font-family:var(--sans);font-weight:700;color:var(--ink);
  font-variant-numeric:tabular-nums;
}
.ct2-btn-ink{
  flex:1;height:46px;border:0;border-radius:14px;
  background:var(--ink);color:#F5F1EA;
  font-family:var(--sans);font-size:15px;font-weight:600;letter-spacing:.06em;
  cursor:pointer;
  transition:transform .18s var(--ease),opacity .18s var(--ease);
}
.ct2-btn-ink:active{transform:scale(.985)}
.ct2-btn-ink:disabled{
  background:var(--bg-sunk);color:var(--faint);cursor:not-allowed;
  transform:none;
}
