/* ==========================================================================
   FUNION LiteTrade · 产品对比（v1.0.28 · M1-08）
   1) .cmp        卡片右上角「对比」复选框（与左上 .pflag 主推角标错开）
   2) .flt-cmp-add 详情页报价面板内的「加入对比」按钮
   3) .flt-tray   底部固定对比栏
   4) .cmp-*      对比页（page-compare.php）
   注意：对比页容器 .flt-compare 上加 overflow-x:clip 兜底，避免任何子元素
   撑破 body 造成整页横移（v1.0.27 教训）。
   ========================================================================== */

/* ---------- 1) 卡片对比复选框 ---------- */
.prod-card .cmp{
	position:absolute;
	top:8px;
	right:8px;
	z-index:3;
	display:inline-flex;
	align-items:center;
	gap:6px;
	height:32px;                /* T-08 触控达标 */
	padding:0 10px;
	border:1px solid var(--border);
	border-radius:6px;
	background:rgba(255,255,255,.95);
	font-family:var(--font);
	font-size:12px;
	font-weight:600;
	color:var(--text-2);
	cursor:pointer;
	transition:all .15s
}
.prod-card .cmp:hover{border-color:var(--primary);color:var(--primary)}
.prod-card .cmp .box{
	width:15px;height:15px;
	border:1.5px solid currentColor;
	border-radius:3px;
	display:grid;place-items:center;
	font-size:11px;line-height:1
}
.prod-card .cmp.on{background:var(--primary);border-color:var(--primary);color:#fff}
.prod-card .cmp.on .box{background:#fff;color:var(--primary)}

/* ---------- 2) 详情页「加入对比」 ---------- */
.flt-cmp-add{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:6px;
	min-height:40px;
	padding:0 10px;
	border-radius:6px;
	border:1px solid rgba(255,255,255,.4);
	background:transparent;
	color:#fff;
	font-family:var(--font);
	font-size:10px;
	font-weight:600;
	cursor:pointer;
	transition:.15s
}
.flt-cmp-add:hover{border-color:#fff;background:rgba(255,255,255,.12)}
.flt-cmp-add.on{background:#fff;color:var(--primary);border-color:#fff}
/* ---------- 3) 底部固定对比栏 ---------- */
.flt-tray{
	position:fixed;
	left:0;right:0;bottom:0;
	z-index:100;
	display:none;
	background:#fff;
	border-top:1px solid var(--border);
	box-shadow:0 -8px 28px rgba(16,24,40,.10);
	padding:12px 0
}
.flt-tray.on{display:block}
.flt-tray .wrap{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.flt-tray .cmp-slots{display:flex;gap:10px}
.flt-tray .slot{
	position:relative;
	width:52px;height:52px;
	border-radius:6px;
	border:1px solid var(--border);
	background:var(--bg-2);
	display:grid;place-items:center;
	overflow:hidden
}
.flt-tray .slot img{width:100%;height:100%;object-fit:cover;display:block}
.flt-tray .slot b{font-family:var(--mono);font-size:10px;font-weight:700;color:#9AA4B8}
.flt-tray .slot.add{border-style:dashed}
.flt-tray .slot .x{
	position:absolute;top:-6px;right:-6px;
	width:22px;height:22px;
	border-radius:50%;
	background:var(--dark);color:#fff;
	font-size:13px;line-height:22px;text-align:center;
	cursor:pointer;border:2px solid #fff
}
.flt-tray .cmp-cnt{font-size:13px;font-weight:600;color:var(--text-2)}
.flt-tray .cmp-sp{flex:1}
.flt-tray .cmp-go{min-height:40px}
.flt-tray .cmp-go:disabled{opacity:.45;cursor:not-allowed}

/* 满额轻提示（JS 创建，2 秒自动移除） */
.flt-cmp-toast{
	position:fixed;
	left:50%;bottom:96px;
	transform:translateX(-50%);
	z-index:90;
	background:var(--dark);color:#fff;
	font-size:13px;font-weight:600;
	padding:10px 18px;border-radius:6px;
	box-shadow:0 8px 24px rgba(16,24,40,.2)
}
/* ---------- 4) 对比页 ---------- */
/* v1.0.29：上边距 44 → 80（Boss 实测偏挤，与页面顶部导航拉开距离） */
.flt-compare{padding:80px 0 120px;overflow-x:clip}
.flt-compare .cmp-head{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.flt-compare h1{font-size:28px;font-weight:700;letter-spacing:-.02em}
.flt-compare .cmp-sw{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;color:var(--text-2);cursor:pointer;min-height:32px}
.flt-compare .cmp-sw input{width:16px;height:16px;accent-color:var(--primary)}
.flt-compare .cmp-clear{margin-left:auto;font-size:13px;color:var(--text-2);text-decoration:underline}
.flt-compare .cmp-clear:hover{color:var(--primary)}
.flt-compare .cmp-empty{padding:80px 24px;text-align:center;background:#fff;border:1px solid var(--border);border-radius:8px}
.flt-compare .cmp-empty h2{font-size:20px;margin-bottom:10px}
.flt-compare .cmp-empty p{color:var(--text-2);max-width:560px;margin:0 auto 22px}
.cmp-scroll{overflow-x:auto;background:#fff;border:1px solid var(--border);border-radius:8px}
.cmp-table{border-collapse:collapse;width:100%;min-width:640px}
.cmp-table th,.cmp-table td{padding:14px 16px;text-align:left;border-bottom:1px solid var(--divider);font-size:13.5px;vertical-align:middle}
.cmp-table thead th{position:sticky;top:0;background:var(--bg-2);z-index:2}
/* 首列 sticky：移动端横滚时参数名常驻 */
.cmp-table .cmp-rowh{
	position:sticky;left:0;
	background:#fff;
	width:120px;min-width:120px;
	font-weight:600;color:var(--text-2);font-size:12.5px;
	z-index:1;border-right:1px solid var(--divider)
}
.cmp-table thead .cmp-rowh{background:var(--bg-2);z-index:3}
.cmp-col .cmp-col-in{display:flex;flex-direction:column;gap:4px;align-items:flex-start}
.cmp-col img,.cmp-col .cmp-ph{width:56px;height:56px;object-fit:cover;border-radius:6px;background:var(--bg-2)}
.cmp-col .cmp-sku{font-family:var(--mono);font-size:13px;font-weight:700;color:var(--text)}
.cmp-col .cmp-name{font-size:12px;color:var(--text-2)}
/* 差异行：左侧 3px 主色竖条（克制，不吵） */
.cmp-table tr.is-diff td:first-child{box-shadow:inset 3px 0 0 var(--primary)}
.cmp-table .cmp-dash{color:#C3CCDF}
.cmp-table tr.cmp-grp td{background:var(--primary-soft);font-weight:700;font-size:12.5px;color:var(--ink)}

/* 对比页询盘入口（M2）：每列「询盘该型号」+ 底部「批量询盘」 */
.cmp-col .cmp-inq{display:inline-block;margin-top:8px;font-size:12.5px;font-weight:600;color:var(--primary);text-decoration:none}
/* v1.0.78：排除按钮（同 a 元素），避免下划线带到按钮文字 */
.cmp-col .cmp-inq:hover:not(.btn){text-decoration:underline}
.cmp-inq-foot{display:flex;justify-content:flex-end;padding-top:18px}
.cmp-inq-foot .btn{min-height:42px}

@media(max-width:767px){
	.flt-compare{padding:80px 0 120px}
	.flt-compare h1{font-size:22px}
	.cmp-table{min-width:560px}
	.cmp-table .cmp-rowh{width:96px;min-width:96px;padding:12px 10px;font-size:11.5px}
	/* 对比栏：贴底通栏 + 安全区适配 */
	.flt-tray{padding:10px 0 calc(10px + env(safe-area-inset-bottom))}
	.flt-tray .wrap{gap:10px}
	.flt-tray .slot{width:44px;height:44px}
	.flt-tray .cmp-go{height:38px;padding:0 14px;font-size:13px}
}