/**
 * 迅睿前台 · 商城页面样式（商品详情 / 列表 / 购物车 / 结算 / 订单 / 会员中心）
 *
 * 为什么抽成独立文件：
 *   原先这套样式内联在 template/pc/default/home/shop/shop_head.html 的 <style> 里，
 *   只有商城页能用。产品中心（/product/、/env/*.html）要变成同一套商城页面时，
 *   若不抽出来就得复制一份，两套样式必然逐渐走样（历史上 .pcard/.gcard 就漂移过）。
 *   现在 shop_head.html 与 product_head.html 都 <link> 这一份，样式单一来源。
 *
 * 依赖：kesion.css 里定义的 CSS 变量 --c-ink / --c-primary / --c-line 等。
 */

/* ===== 商城专用样式（以 shop- 前缀隔离，避免与主题冲突） ===== */
.shop-bar{background:#fff;border-bottom:1px solid var(--c-line);position:sticky;top:0;z-index:60;box-shadow:0 2px 12px rgba(22,35,63,.05)}
.shop-bar .wrap{display:flex;align-items:center;gap:18px;min-height:56px;flex-wrap:wrap}
.shop-bar-nav{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.shop-bar-nav a{padding:7px 14px;border-radius:99px;font-size:14px;color:#44506b;font-weight:600;transition:.25s;white-space:nowrap}
.shop-bar-nav a:hover{color:var(--c-primary);background:#F0F5FE}
.shop-bar-nav a.on{background:var(--c-primary);color:#fff}
.shop-bar-tools{margin-left:auto;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.shop-search{display:flex;align-items:center;background:#f4f5f8;border-radius:99px;padding:4px 4px 4px 14px}
.shop-search input{border:0;background:transparent;outline:0;width:170px;font-size:14px;color:var(--c-text)}
.shop-search button{border:0;background:var(--c-primary);color:#fff;border-radius:99px;padding:7px 16px;font-size:13px;cursor:pointer;font-weight:600}
.shop-cur{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--c-mut)}
.shop-cur select{border:1px solid var(--c-line);border-radius:8px;padding:6px 8px;font-size:13px;color:var(--c-ink);background:#fff;cursor:pointer;outline:0}
.shop-link{font-size:14px;color:#44506b;font-weight:600;display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.shop-link:hover{color:var(--c-primary)}
.shop-link b{background:var(--c-primary);color:#fff;border-radius:99px;font-size:12px;min-width:19px;height:19px;display:inline-flex;align-items:center;justify-content:center;padding:0 5px;font-weight:700}
.shop-userbar{display:flex;align-items:center;gap:12px;font-size:13px;color:var(--c-mut)}
.shop-userbar a{color:#44506b;font-weight:600}
.shop-userbar a:hover{color:var(--c-primary)}

.shop-sec{padding:34px 0 56px}
.shop-sec.shop-bg{background:var(--c-bg)}
.shop-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:22px;flex-wrap:wrap}
.shop-head h2{font-size:23px;color:var(--c-ink);font-weight:700}
.shop-head h2 small{font-size:13px;color:var(--c-mut);font-weight:400;margin-left:8px}
.shop-head a.more{font-size:13px;color:var(--c-primary);font-weight:600}
.shop-notice{background:#EEF2FB;border:1px solid #C2D4FA;color:#8a5a12;border-radius:10px;padding:11px 16px;font-size:13.5px;margin-bottom:22px;display:flex;gap:9px;align-items:flex-start}
.shop-notice b{color:var(--c-primary)}

.shop-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.shop-card{background:#fff;border:1px solid var(--c-line);border-radius:14px;overflow:hidden;transition:transform .3s,box-shadow .3s,border-color .3s;display:flex;flex-direction:column}
.shop-card:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:#B4CBF9}
.shop-card .ph{aspect-ratio:1/1;background:#f4f5f8;overflow:hidden;position:relative}
.shop-card .ph img{width:100%;height:100%;object-fit:contain;transition:transform .6s}
.shop-card:hover .ph img{transform:scale(1.07)}
.shop-card .tag{position:absolute;left:10px;top:10px;background:var(--c-primary);color:#fff;font-size:12px;border-radius:6px;padding:3px 9px;font-weight:600}
.shop-card .tag.soldout{background:#8a94a6}
.shop-card .bd{padding:14px 14px 16px;display:flex;flex-direction:column;gap:7px;flex:1}
.shop-card .nm{font-size:14.5px;color:var(--c-ink);font-weight:600;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:42px}
.shop-card .sub{font-size:12.5px;color:var(--c-mut);display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.shop-card .pr{display:flex;align-items:baseline;gap:8px;margin-top:auto}
.shop-price{color:var(--c-red);font-weight:800;font-size:18px}
.shop-price-old{color:#a8b0bf;font-size:12.5px;text-decoration:line-through}
.shop-card .meta{font-size:12px;color:var(--c-mut);display:flex;justify-content:space-between}

.shop-cats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.shop-cat{background:#fff;border:1px solid var(--c-line);border-radius:12px;padding:16px;transition:.28s}
.shop-cat:hover{border-color:var(--c-primary);box-shadow:0 8px 24px rgba(1,51,153,.12);transform:translateY(-4px)}
.shop-cat b{display:block;color:var(--c-ink);font-size:15px;margin-bottom:6px}
.shop-cat span{font-size:12.5px;color:var(--c-mut)}
.shop-cat .leaves{margin-top:9px;display:flex;flex-wrap:wrap;gap:6px}
.shop-cat .leaves a{font-size:12px;color:#5b6880;background:#f4f5f8;border-radius:6px;padding:3px 8px}
.shop-cat .leaves a:hover{background:#E5EDFD;color:var(--c-primary)}

.shop-layout{display:grid;grid-template-columns:250px 1fr;gap:26px;align-items:start}
.shop-side{background:#fff;border:1px solid var(--c-line);border-radius:14px;padding:18px;position:sticky;top:74px}
.shop-side h3{font-size:15px;color:var(--c-ink);margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--c-line)}
.shop-side-g{margin-bottom:14px}
.shop-side-g>a{display:block;font-size:14px;color:var(--c-ink);font-weight:600;padding:6px 0}
.shop-side-g>a.on,.shop-side-g>a:hover{color:var(--c-primary)}
.shop-side-g .lv2{display:flex;flex-direction:column;gap:2px;padding-left:10px;border-left:2px solid #f0f1f4;margin-top:4px}
.shop-side-g .lv2 a{font-size:13px;color:#5b6880;padding:4px 0}
.shop-side-g .lv2 a.on,.shop-side-g .lv2 a:hover{color:var(--c-primary)}
.shop-side-g .lv2 span{float:right;color:#b7bfcc;font-size:12px}

.shop-toolbar{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--c-line);border-radius:12px;padding:11px 16px;margin-bottom:18px;flex-wrap:wrap}
.shop-toolbar .lab{font-size:13px;color:var(--c-mut)}
.shop-toolbar a{font-size:13.5px;color:#44506b;padding:5px 12px;border-radius:99px}
.shop-toolbar a.on{background:#E5EDFD;color:var(--c-primary);font-weight:700}
.shop-toolbar .cnt{margin-left:auto;font-size:13px;color:var(--c-mut)}
.shop-toolbar .cnt b{color:var(--c-primary)}

.shop-pager{display:flex;align-items:center;gap:7px;margin-top:30px;flex-wrap:wrap}
.shop-pager ul{display:flex;gap:7px;list-style:none;flex-wrap:wrap}
.shop-pager a,.shop-pager span{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:36px;padding:0 11px;border:1px solid var(--c-line);border-radius:9px;background:#fff;color:#44506b;font-size:13.5px}
.shop-pager a:hover{border-color:var(--c-primary);color:var(--c-primary)}
.shop-pager li.on span{background:var(--c-primary);border-color:var(--c-primary);color:#fff;font-weight:700}
.shop-pager li.gap{padding:0 4px;color:#b7bfcc}
.shop-pager-total{font-size:13px;color:var(--c-mut);margin-left:6px}

.shop-pd{display:grid;grid-template-columns:1.05fr 1fr;gap:40px;align-items:start}
.shop-pd-gal .main{border:1px solid var(--c-line);border-radius:16px;overflow:hidden;background:#fff;aspect-ratio:1/1}
.shop-pd-gal .main img{width:100%;height:100%;object-fit:cover}
.shop-pd-gal .thumbs{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
.shop-pd-gal .thumbs img{width:74px;height:74px;object-fit:cover;border-radius:10px;border:2px solid var(--c-line);cursor:pointer}
.shop-pd-gal .thumbs img.on{border-color:var(--c-primary)}
.shop-pd-info h1{font-size:25px;color:var(--c-ink);line-height:1.4;font-weight:700}
.shop-pd-sub{color:var(--c-mut);font-size:14px;margin-top:8px;line-height:1.6}
.shop-pd-price{background:linear-gradient(135deg,#F0F5FE,#FAFCFF);border:1px solid #C2D4FA;border-radius:14px;padding:18px 20px;margin:18px 0}
.shop-pd-price .now{color:var(--c-red);font-size:31px;font-weight:800}
.shop-pd-price .old{color:#a8b0bf;text-decoration:line-through;margin-left:12px;font-size:15px}
.shop-pd-price .off{background:var(--c-red);color:#fff;font-size:12px;border-radius:6px;padding:3px 8px;margin-left:12px;vertical-align:5px}
.shop-pd-rows{border-top:1px solid var(--c-line);padding-top:16px;display:flex;flex-direction:column;gap:12px}
.shop-pd-row{display:flex;gap:14px;font-size:14px}
.shop-pd-row .k{width:78px;color:var(--c-mut);flex-shrink:0}
.shop-pd-row .v{color:var(--c-ink);font-weight:600}
.shop-qty{display:inline-flex;align-items:center;border:1px solid var(--c-line);border-radius:9px;overflow:hidden;background:#fff}
.shop-qty button{width:34px;height:34px;border:0;background:#f9fafb;color:var(--c-ink);font-size:17px;cursor:pointer;line-height:1}
.shop-qty input{width:52px;height:34px;border:0;text-align:center;font-size:14px;outline:0;color:var(--c-ink)}
/* 多规格选择器 */
.shop-pd-specs{margin:16px 0 4px;display:flex;flex-direction:column;gap:12px}
.shop-spec-row{display:flex;gap:14px;align-items:flex-start;font-size:14px}
.shop-spec-row .sk{width:78px;color:var(--c-mut);flex-shrink:0;line-height:30px}
.shop-spec-row .sv{display:flex;flex-wrap:wrap;gap:8px}
.spec-val{border:1px solid var(--c-line);background:#fff;color:var(--c-ink);border-radius:8px;padding:6px 14px;font-size:13.5px;cursor:pointer;transition:.2s;line-height:1.2}
.spec-val:hover{border-color:var(--c-primary);color:var(--c-primary)}
.spec-val.on{border-color:var(--c-primary);background:#E8EFFD;color:var(--c-primary);font-weight:700}
.spec-val.dead{color:#c3cad6;text-decoration:line-through;cursor:not-allowed;background:#fafbfc}
.shop-spec-picked{font-size:13px;color:#5b6880}
.shop-spec-picked .warn{color:#c0392b}
.shop-spec-picked .ok{color:#1e8a4c}
/* 规格标签（购物车 / 结算 / 订单详情） */
.shop-spec-tag{display:inline-block;background:#E8EFFD;border:1px solid #AFC7F8;color:#b06a00;font-size:12px;line-height:1.5;border-radius:6px;padding:1px 8px;margin:3px 0}
.shop-pd-btns{display:flex;gap:14px;margin-top:22px;flex-wrap:wrap}
.shop-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:99px;padding:13px 32px;font-size:15px;font-weight:700;cursor:pointer;transition:.25s;text-decoration:none}
.shop-btn.primary{background:var(--c-primary);color:#fff}
.shop-btn.primary:hover{background:var(--c-primary-d)}
.shop-btn.dark{background:var(--c-ink);color:#fff}
.shop-btn.dark:hover{background:var(--c-ink-2)}
.shop-btn.ghost{background:#fff;border:1px solid var(--c-line);color:var(--c-ink)}
.shop-btn.ghost:hover{border-color:var(--c-primary);color:var(--c-primary)}
.shop-btn.sm{padding:8px 18px;font-size:13.5px}
.shop-btn[disabled],.shop-btn.disabled{background:#c9ced8;cursor:not-allowed;color:#fff}
.shop-tabs{margin-top:38px;background:#fff;border:1px solid var(--c-line);border-radius:14px;overflow:hidden}
.shop-tabs-hd{display:flex;gap:4px;border-bottom:1px solid var(--c-line);background:#fbfbfc;padding:0 10px}
/* 注意：标签头只用 <label>，不要用不可点的 <span>（历史上用 span 当假标签 → 用户报「点不了」） */
.shop-tabs-bd{padding:24px;color:#3d475c;line-height:1.9;font-size:14.5px}
.shop-tabs-bd img{max-width:100%;border-radius:10px;margin:10px 0}

/* ===== 详情页真·标签页（纯 CSS radio + :checked，无 JS 依赖）=====
   为什么不用 JS 切换：模板资源 URL 的 ?v= 若取不到文件 mtime，用户浏览器会长期
   吃旧 JS/CSS。用 radio + :checked 做切换，标签能力不依赖任何脚本，天然抗缓存。
   （?v= 现已改为取文件 mtime，见 config/custom.php 的 dr_theme_asset()。） */
.shop-tab-r{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.shop-tabs-hd label{padding:14px 20px;font-size:14.5px;color:#5b6880;font-weight:600;cursor:pointer;user-select:none;transition:color .2s,background .2s}
.shop-tabs-hd label:hover{color:var(--c-primary);background:#F0F5FE}
.shop-tabs-bd .shop-tab-pane{display:none}
.shop-tabs-bd .shop-tab-pane>p:first-child,.shop-tabs-bd .shop-tab-pane>h3:first-child{margin-top:0}
/* 选中态：第 N 个 radio 选中 → 第 N 个 label 高亮 + 第 N 个 pane 显示 */
#shop-tab-1:checked~.shop-tabs-hd label:nth-of-type(1),
#shop-tab-2:checked~.shop-tabs-hd label:nth-of-type(2),
#shop-tab-3:checked~.shop-tabs-hd label:nth-of-type(3){color:var(--c-primary);box-shadow:inset 0 -2px 0 var(--c-primary)}
#shop-tab-1:checked~.shop-tabs-bd .shop-tab-pane:nth-of-type(1),
#shop-tab-2:checked~.shop-tabs-bd .shop-tab-pane:nth-of-type(2),
#shop-tab-3:checked~.shop-tabs-bd .shop-tab-pane:nth-of-type(3){display:block}

/* 规格参数表：两列表格，与 .article-body table 观感一致 */
.shop-spec-table{width:100%;border-collapse:collapse;margin:0 0 8px;font-size:14.5px}
.shop-spec-table th,.shop-spec-table td{border:1px solid var(--c-line);padding:11px 14px;text-align:left;vertical-align:top}
.shop-spec-table th{width:168px;background:#F2F5FA;color:#16233f;font-weight:600;white-space:nowrap}
.shop-spec-table tr:nth-child(even) td{background:#fbfbfc}
.shop-spec-empty{margin:0;color:#7b8598}

/* 历史内容里有 29/99 件商品的富文本以「裸 <li>」开头（没有 <ul> 包裹，也没有闭合），
   在 .article-body 里会被当成列表项渲染出一个孤零零的项目符号。
   只针对「.article-body 的直接子 li」去符号，正常 <ul><li> 不受影响。 */
.article-body.pd-body>li{list-style:none;padding-left:0;margin-left:0}

.shop-table{width:100%;border-collapse:collapse;background:#fff}
.shop-table th,.shop-table td{padding:14px 12px;border-bottom:1px solid var(--c-line);font-size:14px;text-align:left;vertical-align:middle}
.shop-table th{background:#fbfbfc;color:#5b6880;font-weight:600;font-size:13px}
.shop-table .td-goods{display:flex;gap:12px;align-items:center}
.shop-table .td-goods img{width:64px;height:64px;object-fit:cover;border-radius:9px;border:1px solid var(--c-line);flex-shrink:0}
.shop-table .td-goods b{display:block;color:var(--c-ink);font-size:14px;font-weight:600;line-height:1.45}
.shop-table .td-goods small{color:var(--c-mut);font-size:12px}
.shop-panel{background:#fff;border:1px solid var(--c-line);border-radius:14px;overflow:hidden}
.shop-panel-hd{padding:15px 20px;border-bottom:1px solid var(--c-line);font-weight:700;color:var(--c-ink);font-size:15px;background:#fbfbfc}
.shop-panel-bd{padding:20px}
.shop-sum{margin-left:auto;width:100%;max-width:340px;background:#fff;border:1px solid var(--c-line);border-radius:14px;padding:20px}
.shop-sum .r{display:flex;justify-content:space-between;font-size:14px;color:#5b6880;padding:7px 0}
.shop-sum .r.total{border-top:1px dashed var(--c-line);margin-top:8px;padding-top:14px;font-size:15px;color:var(--c-ink);font-weight:700}
.shop-sum .r.total em{color:var(--c-red);font-size:23px;font-weight:800;font-style:normal}
.shop-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:18px;flex-wrap:wrap}
.shop-form{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.shop-form .full{grid-column:1/-1}
.shop-field{display:flex;flex-direction:column;gap:7px}
.shop-field label{font-size:13.5px;color:#5b6880;font-weight:600}
.shop-field label i{color:var(--c-red);font-style:normal;margin-left:3px}
.shop-field input,.shop-field textarea,.shop-field select{border:1px solid var(--c-line);border-radius:10px;padding:11px 13px;font-size:14px;color:var(--c-ink);outline:0;background:#fff;font-family:inherit;transition:.2s;width:100%}
.shop-field input:focus,.shop-field textarea:focus,.shop-field select:focus{border-color:var(--c-primary);box-shadow:0 0 0 3px rgba(1,51,153,.12)}
.shop-radios{display:flex;gap:12px;flex-wrap:wrap}
.shop-radio{display:flex;align-items:center;gap:9px;border:1px solid var(--c-line);border-radius:11px;padding:12px 16px;cursor:pointer;transition:.2s;background:#fff}
.shop-radio:hover{border-color:var(--c-primary)}
.shop-radio.on{border-color:var(--c-primary);background:#EEF2FB;box-shadow:0 0 0 3px rgba(1,51,153,.1)}
.shop-radio input{margin:0;accent-color:var(--c-primary)}
.shop-radio b{font-size:14px;color:var(--c-ink);font-weight:600}
.shop-addr-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;margin-bottom:18px}
.shop-addr{border:1px solid var(--c-line);border-radius:12px;padding:15px;background:#fff;position:relative}
.shop-addr.on{border-color:var(--c-primary);box-shadow:0 0 0 3px rgba(1,51,153,.1)}
.shop-addr b{display:block;color:var(--c-ink);font-size:14.5px;margin-bottom:5px}
.shop-addr b em{font-style:normal;font-size:11.5px;color:#fff;background:var(--c-primary);border-radius:5px;padding:2px 7px;margin-left:7px;font-weight:600}
.shop-addr p{font-size:13px;color:#5b6880;line-height:1.7}
.shop-addr .ops{margin-top:10px;display:flex;gap:12px;font-size:12.5px}
.shop-addr .ops a{color:#7b8598}
.shop-addr .ops a:hover{color:var(--c-primary)}
.shop-empty{text-align:center;padding:60px 20px;color:var(--c-mut);background:#fff;border:1px dashed var(--c-line);border-radius:14px}
.shop-empty h3{color:var(--c-ink);font-size:17px;margin-bottom:8px}
.shop-empty .shop-btn{margin-top:16px}
.shop-status{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;border-radius:99px;padding:4px 13px}
.shop-status.s0{background:#E5EDFD;color:#b26a00}
.shop-status.s1{background:#e8f2ff;color:#1c6fd4}
.shop-status.s2{background:#eaf4ff;color:#1c6fd4}
.shop-status.s3{background:#e9f7ee;color:#1e8a4c}
.shop-status.s4{background:#f1f2f5;color:#78828f}
.shop-status.s5{background:#fdecec;color:#c0392b}
.shop-ord-card{border:1px solid var(--c-line);border-radius:14px;background:#fff;margin-bottom:18px;overflow:hidden}
.shop-ord-hd{display:flex;align-items:center;gap:16px;padding:13px 20px;background:#fbfbfc;border-bottom:1px solid var(--c-line);font-size:13px;color:#5b6880;flex-wrap:wrap}
.shop-ord-hd .sn{color:var(--c-ink);font-weight:700}
.shop-ord-hd .sp{margin-left:auto}
.shop-ord-bd{padding:16px 20px;display:flex;gap:16px;flex-wrap:wrap;align-items:center}
.shop-ord-good{display:flex;gap:11px;align-items:center;min-width:220px;flex:1}
.shop-ord-good img{width:58px;height:58px;object-fit:cover;border-radius:9px;border:1px solid var(--c-line)}
.shop-ord-good b{font-size:13.5px;color:var(--c-ink);line-height:1.5;display:block}
.shop-ord-good small{color:var(--c-mut);font-size:12px}
.shop-ord-ft{padding:13px 20px;border-top:1px solid var(--c-line);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.shop-ord-ft .amt{margin-right:auto;font-size:13.5px;color:#5b6880}
.shop-ord-ft .amt em{color:var(--c-red);font-size:19px;font-weight:800;font-style:normal}
.shop-tabsline{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:22px}
.shop-tabsline a{padding:9px 18px;border:1px solid var(--c-line);border-radius:99px;font-size:13.5px;color:#44506b;background:#fff}
.shop-tabsline a.on{background:var(--c-primary);border-color:var(--c-primary);color:#fff;font-weight:700}
.shop-tabsline a span{color:#a8b0bf;margin-left:5px;font-size:12.5px}
.shop-tabsline a.on span{color:#C2D4FA}
.shop-logs{list-style:none;display:flex;flex-direction:column;gap:0}
.shop-logs li{position:relative;padding:0 0 20px 24px;border-left:2px solid var(--c-line);margin-left:6px}
.shop-logs li:last-child{border-left-color:transparent;padding-bottom:0}
.shop-logs li::before{content:"";position:absolute;left:-7px;top:3px;width:12px;height:12px;border-radius:50%;background:#fff;border:3px solid var(--c-primary)}
.shop-logs b{display:block;color:var(--c-ink);font-size:14px;font-weight:600}
.shop-logs small{color:var(--c-mut);font-size:12.5px}
.shop-kv{display:grid;grid-template-columns:repeat(2,1fr);gap:10px 24px}
.shop-kv .r{display:flex;gap:10px;font-size:14px}
.shop-kv .k{color:var(--c-mut);min-width:72px}
.shop-kv .v{color:var(--c-ink);font-weight:600;word-break:break-all}

/* ===== 结算 / 订单 / 地址 补充样式 ===== */
.shop-grid.g3{grid-template-columns:repeat(3,1fr)}
.shop-side-g>a span.num{float:right;color:#b7bfcc;font-size:12px;font-weight:400}
.shop-alert{background:#EEF2FB;border:1px solid #C2D4FA;color:#8a5a12;border-radius:10px;padding:11px 16px;font-size:13.5px;margin-bottom:16px}
.shop-alert a{color:var(--c-primary);font-weight:600}
.shop-narrow{max-width:640px;margin:0 auto}
.shop-co{display:grid;grid-template-columns:1fr 360px;gap:24px;align-items:start}
.shop-co-2{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.shop-steps{display:flex;align-items:center;gap:10px;margin-bottom:24px;flex-wrap:wrap}
.shop-step{display:flex;align-items:center;gap:8px;font-size:13.5px;color:#9aa3b2;font-weight:600;padding:8px 18px;border-radius:99px;background:#fff;border:1px solid var(--c-line)}
.shop-step b{width:20px;height:20px;border-radius:50%;background:#e8eaef;color:#8a94a6;display:inline-flex;align-items:center;justify-content:center;font-size:12px}
.shop-step.on{border-color:var(--c-primary);color:var(--c-primary)}
.shop-step.on b{background:var(--c-primary);color:#fff}
.shop-step.done{color:#1e8a4c;border-color:#bfe6cd}
.shop-step.done b{background:#1e8a4c;color:#fff}
.shop-sum-items{border-bottom:1px dashed var(--c-line);margin-bottom:12px;padding-bottom:6px;max-height:260px;overflow:auto}
.shop-sum-item{display:flex;gap:10px;align-items:center;padding:8px 0;font-size:13px}
.shop-sum-item img{width:46px;height:46px;object-fit:cover;border-radius:8px;border:1px solid var(--c-line);flex-shrink:0}
.shop-sum-item>div{flex:1;min-width:0}
.shop-sum-item b{display:block;color:var(--c-ink);font-weight:600;font-size:13px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.shop-sum-item small{color:var(--c-mut);font-size:12px}
.shop-sum-item>span{color:var(--c-ink);font-weight:700;font-size:13.5px;white-space:nowrap}
.shop-ord-head{display:flex;align-items:center;gap:18px;background:#fff;border:1px solid var(--c-line);border-radius:14px;padding:18px 22px;margin-bottom:18px;flex-wrap:wrap}
.shop-ord-head .st{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.shop-ord-head .st b{font-size:16px;color:var(--c-ink)}
.shop-ord-head .ops{margin-left:auto;display:flex;gap:10px;flex-wrap:wrap}
.shop-check{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;color:#5b6880;cursor:pointer;font-weight:600}
.shop-check input{accent-color:var(--c-primary);width:16px;height:16px;margin:0}
@media(max-width:1080px){
  .shop-grid{grid-template-columns:repeat(3,1fr)}
  .shop-grid.g3{grid-template-columns:repeat(2,1fr)}
  .shop-cats{grid-template-columns:repeat(2,1fr)}
  .shop-layout{grid-template-columns:1fr}
  .shop-side{position:static}
  .shop-pd{grid-template-columns:1fr;gap:24px}
  .shop-co{grid-template-columns:1fr}
  .shop-co-2{grid-template-columns:1fr}
  .shop-sum{position:static !important}
}
@media(max-width:760px){
  .shop-grid,.shop-grid.g3{grid-template-columns:1fr}
  .shop-bar .wrap{min-height:0;padding:10px 0;gap:10px}
  .shop-bar-tools{margin-left:0;width:100%}
  .shop-search{flex:1}
  .shop-search input{width:100%}
  .shop-form{grid-template-columns:1fr}
  .shop-kv{grid-template-columns:1fr}
  .shop-table th:nth-child(3),.shop-table td:nth-child(3){display:none}
}

/* 数字与单位/词性之间留出视觉空格（英文版 YEAR / m² 等） */
.stat .num i{margin-left:6px}

/* 规格参数表：跟随内容容器宽度 */
.shop-spec-table{width:100%;max-width:100%;table-layout:fixed}
.shop-spec-table th{width:200px}
.shop-spec-table td{word-break:break-word}
@media (max-width:760px){.shop-spec-table th{width:118px}}

@media(max-width:520px){.shop-grid,.shop-grid.g3{grid-template-columns:1fr}}