/* ---------- Bảng thông số kỹ thuật (gọn), sản phẩm liên quan tự tính, so sánh ---------- */
.sp{border:1px solid var(--line);border-radius:10px;overflow:hidden;font-size:13px;background:#fff}
.sg{display:grid;grid-template-columns:28% 1fr;border-top:1px solid var(--line)}
.sg:first-child{border-top:0}
.sg-l{background:var(--paper);font-weight:700;display:flex;align-items:center;justify-content:center;text-align:center;padding:8px 12px;border-right:1px solid var(--line)}
.sg-r{display:flex;flex-direction:column}
.sr{padding:7px 14px;border-top:1px solid var(--line);display:grid;align-items:center;min-height:34px}
.sr:first-child{border-top:0}
.sr.kv{grid-template-columns:minmax(150px,38%) 1fr;padding:0}
.sr.kv>*{padding:7px 14px}
.sr.kv .k{background:var(--paper);font-weight:600;text-align:center;border-right:1px solid var(--line);align-self:stretch;display:flex;align-items:center;justify-content:center}
.sr.c2{grid-template-columns:1fr 1fr}
.sr.c3{grid-template-columns:1.6fr .5fr .6fr;padding:0}
.sr.c3>*,.sr.c2>*{padding:7px 14px}
.sr.c3>*+*,.sr.c2>*+*{border-left:1px solid var(--line);align-self:stretch;display:flex;align-items:center}
.sr .sub{display:block;font-size:12px;color:var(--muted)}
.sg.tick .sr.kv{grid-template-columns:minmax(150px,38%) 1fr}
.tk{display:inline-flex;width:20px;height:20px;border-radius:50%;align-items:center;justify-content:center;font-size:11.5px;font-weight:700}
.tk.on{background:#1aa3dd;color:#fff}
.tk.off{background:var(--fill);color:var(--muted)}
.sp-na{color:var(--muted)}
.mobile .sg{grid-template-columns:1fr}
.mobile .sg-l{border-right:0;border-bottom:1px solid var(--line);justify-content:flex-start;padding:7px 12px}
.mobile .sr.kv{grid-template-columns:44% 1fr}
.mobile .sr.c3{grid-template-columns:1.4fr .5fr .7fr}
.sp-pick{display:flex;gap:8px;align-items:center;justify-content:flex-end;font-size:12px;color:var(--muted);margin-bottom:8px}
.sp-pick select,.cmp-pick select{font:inherit;font-size:12px;padding:3px 6px;border:1px solid var(--line);border-radius:6px}
.rel-host .card{position:relative}
.sim{position:absolute;top:8px;left:8px;z-index:2;background:#1f9d55;color:#fff;font-size:11px;font-weight:700;border-radius:999px;padding:2px 8px}
.rel-empty-note{border:2px dashed var(--line);border-radius:10px;padding:18px;font-size:13px;color:var(--muted);text-align:center}
body.shot .wf-only{display:none!important}
body.shot .sec.rel-empty{display:none!important}
.cmp tr.cg td{background:var(--ink);color:#fff;font-weight:700;text-align:left;font-size:12.5px;padding:6px 10px;position:static}
.cmp tr.df td:not(:first-child){font-weight:600}
.only-diff .cmp tr.eq{display:none}
.cmp-mode span{cursor:pointer}
.cmp-pick{display:block;font-size:11.5px;color:var(--muted);margin-top:4px}
.cmp th .ph.img{height:110px}
.cmp{table-layout:fixed}
.cmp th:first-child,.cmp td:first-child{width:200px}
.mobile .cmp th:first-child,.mobile .cmp td:first-child{width:130px}
.mobile .cmp{min-width:560px}
.cmp td{padding:7px 10px}
/* sửa trực tiếp trên bảng thông số */
.gen .ed{outline:none;border-radius:3px;padding:0;margin:0;min-width:14px;display:inline-block}
.gen .ed:hover{background:#fff8d6;box-shadow:0 0 0 2px #fff8d6}
.gen .ed:focus{background:#fff;box-shadow:0 0 0 2px var(--ui)}
.gen .ed:empty::before{content:attr(data-ph);color:var(--muted)}
body.shot .gen .ed:empty::before{content:'—'}
.cv{color:var(--muted)}
.tk-ed{cursor:pointer}
.sr,.sg-l{position:relative}
.sp-act{position:absolute;right:4px;top:50%;transform:translateY(-50%);display:none;gap:2px;background:#fff;border:1px solid var(--line);border-radius:6px;padding:2px;z-index:3}
.sp-act.g{right:auto;left:4px;top:4px;transform:none}
.sr:hover>div>.sp-act,.sr:hover .sp-act,.sg-l:hover>.sp-act{display:flex}
.sp-act b,.sp-bar b,.sp-addg b,.sp-addline{cursor:pointer;font-size:11.5px;padding:2px 6px;border-radius:4px;font-weight:600}
.sp-act b:hover,.sp-bar b:hover,.sp-addg b:hover{background:var(--fill)}
.sp-act b.x,.sp-bar b.x{color:var(--danger)}
.sp-addline{color:var(--ui)}
.sp-bar{display:flex;gap:6px;align-items:center;justify-content:flex-end;flex-wrap:wrap;margin-bottom:6px;font-size:12px}
.sp-bar .sp-pick{margin:0}
.sp-meta{font-size:12px;color:var(--muted);margin-bottom:8px;text-align:right}
.sp-meta .ed{color:var(--ink);font-weight:600}
.sp-addg{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:8px;font-size:12px;color:var(--muted)}
.sp-addg b{border:1px dashed var(--line);color:var(--ui)}
.sr:not(.kv):not(.c2):not(.c3){display:flex;align-items:center;flex-wrap:wrap;gap:0 4px}
.sr.kv>div:last-child{display:flex;align-items:center;gap:4px;flex-wrap:wrap}