/* ============================================================
 * 咖莱翼 · 三平台外卖定价引擎 — UI 设计系统
 * 版式与「外卖利润管家(profit-app)」同源：设计令牌 / 布局 / 组件
 * ============================================================ */
:root{
  /* 默认令牌与 profit-app 出厂外观(sunset 暖橙 #F97316)对齐；实际运行时由主题桥接按共享外观配置覆盖 */
  --brand:#f97316;
  --brand-deep:#a94d0e;
  --brand-soft:#fef0e6;
  --accent:#fd9c53;         /* ← 主色 400 档（桥接覆盖），与 profit-app --accent 口径一致 */
  --brand-rgb:249,115,22;   /* 主色 RGB 三元组，供 rgba() 光晕/阴影使用 */
  --hero-mid:#814926;       /* 深色头图渐变中段（桥接覆盖），随主色收敛 */
  --bg-tint:#f973161c;      /* 页面顶部氛围光晕（桥接覆盖） */
  --ink:#182230;
  --ink-2:#3d4a5c;
  --sub:#71809a;
  --line:#e6eaf1;
  --line-strong:#d4dae4;
  --bg:#f3f5f9;
  --card:#ffffff;
  --ok:#0f9960;
  --ok-soft:#e8f7f0;
  --warn:#c77d0a;
  --warn-soft:#fdf6e7;
  --bad:#d43c33;
  --bad-soft:#fdeeec;
  --info:#2f6fed;
  --info-soft:#ecf2fe;
  --radius:12px;
  --radius-sm:8px;
  --shadow:0 1px 2px rgba(23,32,54,.05),0 4px 16px rgba(23,32,54,.06);
  --shadow-lg:0 8px 32px rgba(23,32,54,.14);
  --font:-apple-system,"Segoe UI","PingFang SC","Microsoft YaHei","Helvetica Neue",sans-serif;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;font-family:var(--font);font-size:13.5px;color:var(--ink);background:
  radial-gradient(1200px 400px at 85% -180px,var(--bg-tint,#f973161c) 0%,transparent 60%),
  var(--bg);-webkit-font-smoothing:antialiased;}

/* ---------- 顶部导航 ---------- */
.topbar{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);padding:0 28px;display:flex;align-items:center;flex-wrap:wrap;gap:10px 16px;min-height:60px;}
.logo{display:flex;align-items:center;gap:11px;}
.logo-mark{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,var(--brand),var(--accent));
  color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:16px;
  box-shadow:0 4px 12px rgba(var(--brand-rgb),.35);letter-spacing:-.5px;}
.logo h1{margin:0;font-size:15.5px;font-weight:700;letter-spacing:.2px;}
.logo p{margin:1px 0 0;font-size:11px;color:var(--sub);letter-spacing:.3px;}
.topbar .spacer{flex:1;}
.plat-sel{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--sub);}
.plat-sel select{width:auto;min-width:110px;}
.plat-tag{display:inline-block;padding:2px 9px;border-radius:999px;font-size:11px;font-weight:700;color:#fff;}
.plat-meituan{background:#ffd100;color:#5a4500;} .plat-taobao{background:#ff5000;color:#fff;} .plat-jd{background:#e1251b;color:#fff;}

/* ---------- 布局 ---------- */
.layout{display:grid;grid-template-columns:430px minmax(0,1fr);gap:20px;padding:20px 28px 40px;align-items:start;max-width:1560px;margin:0 auto;}
.col-report{position:sticky;top:80px;}
@media (max-width:1080px){.layout{grid-template-columns:1fr;}.col-report{position:static;}}

/* ---------- 卡片 / 步骤 ---------- */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);
  padding:18px 20px;margin-bottom:18px;}
.card-head{display:flex;align-items:center;gap:10px;margin-bottom:4px;}
.step-no{flex:0 0 26px;width:26px;height:26px;border-radius:8px;background:var(--brand-soft);color:var(--brand);
  font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center;}
.card h2{font-size:14.5px;margin:0;font-weight:700;letter-spacing:.2px;}
.card .sub{font-size:12px;color:var(--sub);margin:6px 0 2px;line-height:1.6;}
.card h3{font-size:12.5px;margin:16px 0 8px;color:var(--ink-2);font-weight:700;}
.divider{border:none;border-top:1px dashed var(--line-strong);margin:16px 0 4px;}

/* ---------- 表单 ---------- */
label{display:block;font-size:12px;color:var(--ink-2);margin:10px 0 5px;font-weight:600;letter-spacing:.2px;}
input,select,textarea{width:100%;padding:9px 11px;border:1px solid var(--line-strong);border-radius:var(--radius-sm);
  font-size:13px;font-family:var(--font);color:var(--ink);background:#fff;transition:border .15s,box-shadow .15s;outline:none;}
input:focus,select:focus,textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(var(--brand-rgb),.12);}
input::placeholder,textarea::placeholder{color:#a8b3c5;}
input[type="file"]{padding:7px;font-size:12px;color:var(--sub);background:var(--bg);border-style:dashed;cursor:pointer;}
textarea{resize:vertical;font-family:Consolas,Menlo,monospace;font-size:12px;line-height:1.6;}
.row{display:flex;gap:10px;} .row>*{flex:1;min-width:0;}
#newStoreBtn{white-space:nowrap;}
.row>.half{flex:0 0 calc(50% - 5px);}
.row.half{flex-wrap:wrap;} /* 半宽行可换行：主站三字段(平台补贴+神券+环保捐赠)时自动两行排布 */
.pnl-coupon-chk{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:400;color:var(--sub);cursor:pointer;letter-spacing:0;white-space:nowrap;}
.pnl-coupon-chk input{accent-color:#9aa5b5;margin:0;cursor:pointer;}
.pnl-coupon-chk input:not(:checked){accent-color:var(--brand);}
#pnlCoupon[readonly]{background:var(--bg);color:var(--sub);}
#pnlEco[readonly]{background:var(--bg);color:var(--sub);cursor:not-allowed;}
.pnl-coupon-hint{font-size:10.5px;color:var(--sub);line-height:1.5;margin-top:4px;min-height:14px;}

/* ---------- 按钮 ---------- */
button{background:var(--brand);color:#fff;border:0;border-radius:var(--radius-sm);padding:9px 16px;
  font-size:13px;font-weight:600;font-family:var(--font);cursor:pointer;margin-top:10px;
  transition:background .15s,transform .05s,box-shadow .15s,opacity .15s;box-shadow:0 2px 6px rgba(var(--brand-rgb),.25);}
button:hover{background:var(--brand-deep);}
button:active{transform:translateY(1px);}
button:disabled{opacity:.45;cursor:not-allowed;box-shadow:none;}
button.ghost{background:#fff;color:var(--brand);border:1px solid var(--brand);box-shadow:none;}
button.ghost:hover{background:var(--brand-soft);}
button.danger{background:#fff;color:var(--bad);border:1px solid var(--bad);box-shadow:none;}
button.danger:hover{background:var(--bad-soft);}
button.sm{padding:6px 12px;font-size:12px;margin-top:6px;}
button.block{width:100%;}
button.neutral{background:#fff;color:var(--ink-2);border:1px solid var(--line-strong);box-shadow:none;}
button.neutral:hover{background:var(--bg);}
.topbar button{margin:0;padding:6px 12px;font-size:12px;white-space:nowrap;}
.topbar button.ghost{color:var(--brand);}

/* ---------- 表格 ---------- */
table{width:100%;border-collapse:collapse;font-size:12.5px;margin-top:10px;}
th,td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle;}
th{background:#f7f9fc;color:var(--ink-2);font-size:11.5px;font-weight:700;letter-spacing:.3px;
  border-bottom:1px solid var(--line-strong);}
tbody tr:hover{background:#fafbfd;}
td input,td select{padding:5px 7px;font-size:12.5px;}
.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;}
.tbl-scroll{overflow-x:auto;}
.tbl-scroll table{min-width:1080px;}

/* ---------- 当前生效签约参数（只读七字段） ---------- */
table.agr-params{margin-top:0;font-size:12px;background:#fff;border:1px solid var(--line-strong);border-radius:var(--radius-sm);overflow:hidden;}
table.agr-params tr:last-child td{border-bottom:none;}
table.agr-params td{padding:7px 10px;}
table.agr-params td.apk{width:172px;background:#f7f9fc;color:var(--ink-2);font-weight:700;font-size:11.5px;white-space:nowrap;}
table.agr-params td.apv{line-height:1.7;color:var(--ink);}
/* 签约参数 · 手动输入模式 */
.am-in{width:76px;padding:3px 6px;font-size:12px;border:1px solid var(--line-strong);border-radius:4px;font-family:inherit;color:var(--ink);background:#fff;}
.am-in:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 2px var(--brand-soft);}
.am-in.am-txt{width:170px;}
.am-grid{display:flex;flex-direction:column;gap:5px;}
.am-grid .am-row{display:flex;align-items:center;gap:4px;flex-wrap:wrap;}
#agrManualBar button{margin:0;}

/* ---------- 商品列表（步骤 2，折叠 + 滚动容器） ---------- */
.prod-scroll{max-height:400px;overflow-y:auto;border:1px solid var(--line-strong);border-radius:var(--radius-sm);
  background:#fff;padding:2px 10px 6px;overscroll-behavior:contain;}
.prod-scroll table{margin-top:4px;}
.prod-scroll::-webkit-scrollbar{width:8px;}
.prod-scroll::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:4px;}
.prod-scroll::-webkit-scrollbar-thumb:hover{background:var(--sub);}

/* ---------- 提示条 / 徽标 ---------- */
.tip{font-size:12.5px;border-radius:var(--radius-sm);padding:9px 12px;margin-top:10px;line-height:1.6;
  background:var(--warn-soft);border:1px solid #f3e2bb;color:#8a6117;display:none;}
.tip.ok{background:var(--ok-soft);border-color:#bfe8d4;color:#0b7a4b;}
.tip.bad{background:var(--bad-soft);border-color:#f2c7c2;color:#a3271f;}
.muted{color:var(--sub);font-size:12px;line-height:1.7;}
.ok{color:var(--ok);} .bad{color:var(--bad);}
.badge{display:inline-block;padding:2px 9px;border-radius:999px;font-size:11px;font-weight:600;letter-spacing:.3px;}
.badge.ok{background:var(--ok-soft);color:var(--ok);}
.badge.bad{background:var(--bad-soft);color:var(--bad);}
.badge.info{background:var(--info-soft);color:var(--info);}

/* ---------- 报表区 ---------- */
.report-scope{display:flex;align-items:center;gap:8px;margin-bottom:10px;}
.report-empty{background:var(--card);border:1px dashed var(--line-strong);border-radius:var(--radius);
  padding:70px 30px;text-align:center;display:flex;flex-direction:column;gap:10px;align-items:center;}
.report-empty .big{font-size:44px;}
#reportWrap{min-height:300px;}

/* ============================================================
 * 定价报表（用户认可版式：深色渐变头图 + 卡片 + 四梯度色条 + 费用独立罗列）
 * ============================================================ */
.pr{font-family:var(--font);color:var(--ink);font-size:13px;}
.pr-hero{background:linear-gradient(135deg,#1f2733 0%,var(--hero-mid,#814926) 55%,var(--brand) 100%);color:#fff;
  border-radius:14px;padding:26px 28px;box-shadow:var(--shadow-lg);}
.pr-hero .pr-kicker{font-size:11px;letter-spacing:2px;opacity:.72;text-transform:uppercase;}
.pr-hero h1{margin:6px 0 4px;font-size:21px;letter-spacing:.5px;}
.pr-hero .pr-meta{font-size:12px;opacity:.82;line-height:1.8;}
.pr-hero .pr-meta b{color:rgba(255,255,255,.92);}
.pr-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-top:16px;}
.pr-kpi{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;box-shadow:var(--shadow);}
.pr-kpi .k{font-size:11.5px;color:var(--sub);letter-spacing:.4px;}
.pr-kpi .v{font-size:21px;font-weight:800;margin-top:4px;font-variant-numeric:tabular-nums;}
.pr-kpi .v.hl{color:var(--brand);} .pr-kpi .v.up{color:var(--ok);} .pr-kpi .v.down{color:var(--bad);}
.pr-sec{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:16px 18px;margin-top:14px;}
.pr-sec h2{font-size:14px;margin:0 0 4px;display:flex;align-items:center;gap:8px;}
.pr-sec h2 .bar{width:4px;height:15px;border-radius:2px;background:linear-gradient(180deg,var(--brand),var(--accent));display:inline-block;}
.pr-sec .note{font-size:11.5px;color:var(--sub);line-height:1.7;margin:2px 0 6px;}
.pr table{margin-top:8px;font-size:12px;}
.pr th{white-space:nowrap;}
.pr td.tier{white-space:nowrap;}
.tier-chip{display:inline-block;padding:2px 10px;border-radius:999px;color:#fff;font-size:11px;font-weight:700;}
.pr-foot{margin-top:14px;font-size:11.5px;color:var(--sub);line-height:1.9;
  background:var(--card);border:1px dashed var(--line-strong);border-radius:var(--radius);padding:12px 16px;}
.pr-foot b{color:var(--ink-2);}

/* ---------- 平台规则明细弹层 ---------- */
#rulesModal{position:fixed;inset:0;z-index:60;}
.rules-mask{position:absolute;inset:0;background:rgba(23,32,54,.45);backdrop-filter:blur(2px);}
.rules-panel{position:relative;margin:5vh auto 0;width:min(780px,92vw);max-height:90vh;display:flex;flex-direction:column;
  background:var(--card);border-radius:14px;box-shadow:var(--shadow-lg);overflow:hidden;}
.rules-head{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line);
  background:linear-gradient(135deg,#1f2733 0%,var(--hero-mid,#814926) 55%,var(--brand) 100%);color:#fff;}
.rules-head>b{font-size:14px;letter-spacing:.5px;}
.rules-tabs{display:flex;gap:6px;margin-left:auto;}
.rules-tab{margin:0;padding:5px 13px;font-size:12px;border-radius:999px;background:rgba(255,255,255,.14);
  color:#fff;border:1px solid rgba(255,255,255,.25);box-shadow:none;font-weight:600;}
.rules-tab:hover{background:rgba(255,255,255,.26);}
.rules-tab.on{background:#fff;color:var(--brand);border-color:#fff;}
.rules-close{margin:0;padding:4px 10px;font-size:13px;border-radius:8px;background:rgba(255,255,255,.14);
  color:#fff;border:1px solid rgba(255,255,255,.25);box-shadow:none;}
.rules-close:hover{background:rgba(255,255,255,.28);}
.rules-body{overflow-y:auto;padding:16px 18px 20px;overscroll-behavior:contain;}
.rules-sec{margin-bottom:6px;}
.rules-sec h3{display:flex;align-items:center;gap:8px;font-size:13.5px;margin:14px 0 2px;}
.rules-sec h3 .dot{width:9px;height:9px;border-radius:50%;display:inline-block;}
.rules-sec .note{font-size:11.5px;color:var(--sub);line-height:1.7;margin:2px 0 0;}

/* ---------- 到手测算弹层（平台账单仿真） ---------- */
#pnlModal{position:fixed;inset:0;z-index:60;}

/* ---------- 微信分享弹层 ----------
   与规则明细 / 到手测算弹层同样固定全屏；缺此规则时 .rules-panel 会按普通块级排到
   文档流末尾（页面最底部、视口之外），点击「微信分享」看起来"没有反应"。 */
#shareModal{position:fixed;inset:0;z-index:60;}
/* ---------- 门店动态店铺码弹层（与规则/测算/分享同款固定全屏定位） ---------- */
#storeCodeModal{position:fixed;inset:0;z-index:60;}

/* ---------- 历史定价核算记录弹层 ---------- */
#histModal{position:fixed;inset:0;z-index:60;}
.hist-list{display:flex;flex-direction:column;gap:10px;}
.hist-empty{font-size:13px;color:var(--sub);line-height:1.8;padding:8px 2px;}
.hist-item{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px 14px;}
.hist-pick{flex:0 0 auto;align-self:flex-start;margin-top:2px;}
.hist-pick input{width:16px;height:16px;cursor:pointer;}
.hist-main{flex:1 1 auto;min-width:0;}
.hist-title{font-size:13.5px;font-weight:700;display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.hist-meta{font-size:12px;color:var(--sub);margin-top:4px;line-height:1.6;}
.hist-acts{flex:0 0 auto;display:flex;gap:8px;}
.hist-cmp-wrap{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:6px;}
.hist-cmp-col{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px 16px;}
.hist-cmp-col h3{font-size:13px;margin:0 0 6px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.hist-cmp-row{font-size:12.5px;color:var(--ink-2);line-height:1.9;border-top:1px dashed var(--line-strong);margin-top:10px;padding-top:8px;}
.hist-cmp-row .k{color:var(--sub);}
.hist-cmp-note{font-size:12px;color:var(--sub);margin-top:12px;line-height:1.7;}
.rules-panel.small{width:min(600px,92vw);}
.pnl-plat{width:auto!important;flex:0 0 auto!important;margin:0 0 0 auto;padding:5px 9px!important;font-size:12px;
  border-radius:8px;border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.14);color:#fff;font-weight:600;}
.pnl-plat option{color:var(--ink);background:#fff;}
.bill{background:#fff;border:1px solid var(--line-strong);border-radius:10px;padding:6px 16px 12px;margin-top:16px;box-shadow:var(--shadow);}
.bill-row{display:flex;align-items:baseline;gap:8px;padding:8px 0;font-size:12.8px;}
.bill-row .bn{flex:1;color:var(--ink);line-height:1.6;}
.bill-row .bq{color:var(--sub);font-size:11px;font-weight:400;}
.bill-row .bv{font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:600;}
.bill-div{border-top:1px dashed var(--line-strong);margin:4px 0;}
.bill-total{display:flex;justify-content:space-between;align-items:baseline;padding:10px 0 2px;font-size:13px;font-weight:700;}
.bill-total .bv{font-size:20px;font-variant-numeric:tabular-nums;}
.bill-note{font-size:11px;color:var(--sub);line-height:1.8;margin:6px 0 2px;}
.tag-chip{display:inline-block;padding:1px 7px;border:1px solid var(--accent);color:var(--accent);border-radius:4px;
  font-size:10.5px;margin-left:6px;font-weight:600;vertical-align:1px;}
.bill-tier{margin-top:12px;padding-bottom:6px;border-bottom:1px dashed var(--line);display:flex;align-items:center;flex-wrap:wrap;}
.pnl-chips{display:flex;gap:8px;align-items:center;}
.pnl-chip{padding:5px 16px;border:1.5px solid var(--line-strong);border-radius:18px;background:#fff;color:var(--ink);
  font-size:12.5px;font-weight:600;cursor:pointer;transition:all .15s;}
.pnl-chip:hover{border-color:var(--accent);}
.pnl-chip.on{background:var(--brand);border-color:var(--brand);color:#fff;}

@media print{
  #rulesModal,#pnlModal,#shareModal,#storeCodeModal{display:none!important;}
  .topbar,.report-scope,.layout>.col-inputs{display:none!important;}
  .layout{display:block;padding:0;max-width:none;}
  .col-report{position:static;}
  body{background:#fff;}
  .pr-sec,.pr-kpi{box-shadow:none;}
}

/* ============ P1 UI 基线对齐（2026-09-20） · 仅视觉，零业务/API ============ */
/* 2.3 平台标识去重：顶栏下拉已显平台选中值，彩色徽标冗余 → 隐藏其一（不删功能，仅消重） */
#platTag{ display:none; }
/* 2.2 签约参数长值折行不破行高（key 已 172px 定宽、value 左对齐；补断词防溢出） */
table.agr-params td.apv{ word-break: break-word; }
/* 2.3 预览区空态对齐基线 .uib-empty 语义（图标+标题+说明已有 report-empty，补白卡片感） */
.col-report .report-empty{ background: var(--card); }