/* =====================================================================
   JKPOS 官网 · 服务商中心「V2 迁移 V3」迁移中心样式 (migrate.css) v1.0
   任务 #2919/#2738：销售助手迁移中心落地官网服务商中心 tab。
   跟随官网 Apple 白卡设计语言（style.css 变量），组件前缀 mg-。
   ===================================================================== */

#pane-migrate{--mg-blue:#0071e3;--mg-soft:#e8f1fc;--mg-green:#248a3d;--mg-green-bg:#e6f5ea;
  --mg-orange:#c56a00;--mg-orange-bg:#fff3e2;--mg-red:#d70015;--mg-red-bg:#feecec;
  font-size:14px;color:var(--ink)}
#pane-migrate .mg-hide{display:none!important}

/* ---------- 卡片 / 布局 ---------- */
.mg-card{background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:16px;padding:18px 20px;
  box-shadow:0 1px 4px rgba(0,0,0,.04);margin-bottom:14px}
.mg-card h3{font-size:15px;font-weight:700;margin:0 0 12px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.mg-card h3 .sub{color:var(--sub);font-weight:400;font-size:12.5px}
.mg-card h3 .r{margin-left:auto;display:flex;align-items:center;gap:8px;font-weight:400;font-size:12.5px;color:var(--sub)}
.mg-two{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}
.mg-head{display:flex;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap}
.mg-head .ttl{font-size:17px;font-weight:800}
.mg-head .bk{color:var(--link);cursor:pointer;font-size:13px;white-space:nowrap}
.mg-head .r{margin-left:auto;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.mg-tip{font-size:12.5px;color:var(--sub);line-height:1.7}
.mg-muted{color:var(--faint)}
.mg-num{font-variant-numeric:tabular-nums}
.mg-money{font-variant-numeric:tabular-nums;font-weight:600}
.mg-link{color:var(--link);cursor:pointer;white-space:nowrap}
.mg-link.dis{color:#b9bfc7;cursor:not-allowed}
.mg-stateline{display:flex;gap:6px 20px;font-size:12.5px;color:var(--sub);margin-bottom:12px;flex-wrap:wrap}
.mg-stateline b{color:var(--ink);font-weight:600}

/* ---------- 统计卡 ---------- */
.mg-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}
.mg-kpi{background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:16px;padding:14px 18px;box-shadow:0 1px 4px rgba(0,0,0,.04)}
.mg-kpi .l{color:var(--sub);font-size:12.5px}
.mg-kpi .v{font-size:26px;font-weight:800;margin-top:2px;font-variant-numeric:tabular-nums}
.mg-kpi .v small{font-size:12px;color:var(--faint);font-weight:400;margin-left:6px}

/* ---------- 按钮 ---------- */
.mg-btn{display:inline-flex;align-items:center;gap:6px;border:none;border-radius:980px;cursor:pointer;
  padding:8px 18px;font-size:13px;font-weight:600;font-family:inherit;background:var(--mg-blue);color:#fff;
  transition:background .2s,opacity .2s;line-height:1.4;white-space:nowrap}
.mg-btn:hover{background:var(--blue-h)}
.mg-btn.ghost{background:#fff;color:var(--ink);border:1px solid rgba(0,0,0,.16)}
.mg-btn.ghost:hover{background:#f5f5f7}
.mg-btn.warn{background:#e58900}.mg-btn.warn:hover{background:#c97800}
.mg-btn.green{background:var(--mg-green)}.mg-btn.green:hover{background:#1d7433}
.mg-btn.danger{background:#fff;color:var(--mg-red);border:1px solid #f3b6bc}.mg-btn.danger:hover{background:var(--mg-red-bg)}
.mg-btn.sm{padding:5px 12px;font-size:12.5px}
.mg-btn:disabled,.mg-btn.dis{background:#c6ccd3;color:#fff;border:none;cursor:not-allowed;pointer-events:none}
.mg-btn.ghost:disabled,.mg-btn.ghost.dis,.mg-btn.danger:disabled,.mg-btn.danger.dis{background:#f5f5f7;color:#b0b6be;border:1px solid rgba(0,0,0,.08)}

/* ---------- 状态徽章 ---------- */
.mg-st{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;border-radius:10px;padding:2px 9px;white-space:nowrap}
.mg-st::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.mg-st.blue{background:var(--mg-soft);color:var(--mg-blue)}
.mg-st.green{background:var(--mg-green-bg);color:var(--mg-green)}
.mg-st.orange{background:var(--mg-orange-bg);color:var(--mg-orange)}
.mg-st.gray{background:#f0f1f3;color:#6b7280}
.mg-st.red{background:var(--mg-red-bg);color:var(--mg-red)}

/* ---------- 表格 ---------- */
.mg-tbwrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.mg-tb{width:100%;border-collapse:collapse;font-size:12.8px;background:#fff}
.mg-tb th{background:#f7f8fa;text-align:left;padding:9px 12px;color:#6b7280;font-weight:600;border-bottom:1px solid var(--line);white-space:nowrap}
.mg-tb td{padding:10px 12px;border-bottom:1px solid #f2f3f5;white-space:nowrap;vertical-align:middle}
.mg-tb tr:last-child td{border-bottom:none}
.mg-tb tr.pick{cursor:pointer}
.mg-tb tr.pick:hover td{background:#f7f9ff}
.mg-tb tr.sel td{background:var(--mg-soft)}
.mg-tb td.diff{color:var(--mg-red);font-weight:700}
.mg-tb td.okc{color:var(--mg-green);font-weight:700}
.mg-pgr{display:flex;align-items:center;gap:10px;margin-top:10px;font-size:12.5px;color:var(--sub)}
.mg-pgr .r{margin-left:auto;display:flex;gap:6px;align-items:center}
.mg-pgr button{border:1px solid rgba(0,0,0,.14);background:#fff;border-radius:8px;padding:3px 10px;font-size:12.5px;cursor:pointer;font-family:inherit;color:var(--ink)}
.mg-pgr button:disabled{color:#c0c4cb;cursor:not-allowed}

/* ---------- 进度条 ---------- */
.mg-bar{height:6px;background:#eef0f2;border-radius:3px;overflow:hidden;width:96px;display:inline-block;vertical-align:middle}
.mg-bar i{display:block;height:100%;background:var(--mg-blue);border-radius:3px;transition:width .3s}
.mg-bar.g i{background:var(--mg-green)}
.mg-bigbar{height:10px;background:#eef0f2;border-radius:5px;overflow:hidden;margin:8px 0 6px}
.mg-bigbar i{display:block;height:100%;background:linear-gradient(90deg,#0071e3,#5aa9f0);border-radius:5px;transition:width .4s}

/* ---------- 筛选 / 搜索 ---------- */
.mg-pills{display:flex;gap:6px;margin-bottom:10px;flex-wrap:wrap}
.mg-pill{border:1px solid rgba(0,0,0,.14);background:#fff;border-radius:980px;padding:4px 13px;font-size:12.5px;color:#555;cursor:pointer;font-family:inherit}
.mg-pill.on{border-color:var(--mg-blue);color:var(--mg-blue);background:var(--mg-soft);font-weight:600}
.mg-search{display:inline-flex;align-items:center;gap:6px;border:1px solid rgba(0,0,0,.14);border-radius:980px;padding:5px 12px;background:#fff}
.mg-search input{border:none;outline:none;font-size:12.5px;font-family:inherit;width:180px;background:none;color:var(--ink)}

/* ---------- 表单 ---------- */
.mg-frm{display:flex;align-items:flex-start;gap:12px;margin-bottom:10px;font-size:13px}
.mg-frm .lb{width:92px;color:#555;padding-top:8px;flex-shrink:0}
.mg-frm .lb i{color:var(--mg-red);font-style:normal;margin-right:2px}
.mg-frm .ct{flex:1;min-width:0}
.mg-inp{width:100%;border:1px solid rgba(0,0,0,.16);border-radius:10px;padding:8px 12px;font-size:13px;outline:none;background:#fff;color:var(--ink);font-family:inherit}
.mg-inp:focus{border-color:var(--mg-blue);box-shadow:0 0 0 3px rgba(0,113,227,.12)}
.mg-inp[disabled]{background:#f5f5f7;color:#86868b}
.mg-err{color:var(--mg-red);font-size:12.5px;margin:6px 0 0;min-height:16px}
.mg-res{border:1px dashed rgba(0,0,0,.16);border-radius:12px;padding:10px 14px;margin-top:8px;font-size:12.8px}
.mg-res .kv{display:flex;justify-content:space-between;gap:12px;padding:3px 0}
.mg-res .kv b{font-weight:600;text-align:right}
.mg-ok{color:var(--mg-green);font-weight:600}
.mg-bad{color:var(--mg-red);font-weight:600}
.mg-wn{color:var(--mg-orange);font-weight:600}

/* ---------- 单选 / 勾选 ---------- */
.mg-radio{display:inline-flex;align-items:center;gap:6px;margin:2px 14px 2px 0;font-size:12.8px;cursor:pointer;color:var(--ink)}
.mg-radio .o{width:15px;height:15px;border-radius:50%;border:1.5px solid #c9cdd4;flex-shrink:0;background:#fff}
.mg-radio.on .o{border:4.5px solid var(--mg-blue)}
.mg-chk{display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.mg-chk .b{width:15px;height:15px;border-radius:4px;border:1.5px solid #c9cdd4;display:inline-flex;align-items:center;justify-content:center;background:#fff;flex-shrink:0}
.mg-chk .b svg{width:10px;height:10px;stroke:#fff;stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round;display:none}
.mg-chk.on .b{background:var(--mg-blue);border-color:var(--mg-blue)}
.mg-chk.on .b svg{display:block}
.mg-chk.lock{cursor:not-allowed}
.mg-chk.lock .b{background:#c9cdd4;border-color:#c9cdd4}
.mg-chk.lock .b svg{display:block}

/* ---------- 向导步条 ---------- */
.mg-steps{display:flex;align-items:center;background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:16px;
  padding:13px 18px;box-shadow:0 1px 4px rgba(0,0,0,.04);margin-bottom:14px;overflow-x:auto}
.mg-step{display:flex;align-items:center;gap:8px;font-size:12.8px;color:var(--faint);white-space:nowrap}
.mg-step .n{width:22px;height:22px;border-radius:50%;border:1.5px solid #d4d8df;display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex-shrink:0}
.mg-step.done{color:var(--mg-green)}
.mg-step.done .n{background:var(--mg-green);border-color:var(--mg-green);color:#fff}
.mg-step.on{color:var(--mg-blue);font-weight:700}
.mg-step.on .n{background:var(--mg-blue);border-color:var(--mg-blue);color:#fff}
.mg-step .ln{width:52px;height:1px;background:#e3e6ea;margin:0 12px;flex-shrink:0}

/* ---------- 提示条 / 冲突卡 ---------- */
.mg-alert{border-radius:12px;padding:10px 14px;font-size:12.8px;margin-bottom:8px;display:flex;gap:9px;align-items:flex-start;line-height:1.65}
.mg-alert.red{background:var(--mg-red-bg);color:#a3131f}
.mg-alert.orange{background:var(--mg-orange-bg);color:#8a5300}
.mg-alert.blue{background:var(--mg-soft);color:#155bb5}
.mg-alert b{font-weight:700}
.mg-sec{font-size:13px;font-weight:700;margin:14px 0 8px;display:flex;align-items:center;gap:7px}
.mg-sec:first-child{margin-top:0}
.mg-sec .cnt{font-weight:600;font-size:11px;border-radius:9px;padding:1px 8px;background:#f0f1f3;color:#6b7280}
.mg-sec .cnt.red{background:var(--mg-red-bg);color:var(--mg-red)}
.mg-sec .cnt.orange{background:var(--mg-orange-bg);color:var(--mg-orange)}
.mg-sec .cnt.green{background:var(--mg-green-bg);color:var(--mg-green)}
.mg-conf{border:1px solid rgba(0,0,0,.1);border-radius:12px;padding:11px 14px;margin-bottom:8px}
.mg-conf .h{display:flex;align-items:center;gap:7px;font-weight:700;font-size:13px;margin-bottom:3px}
.mg-conf .d{color:var(--sub);font-size:12.5px;margin-bottom:7px}
.mg-conf .opts{display:flex;flex-wrap:wrap;gap:4px 0;align-items:center}
.mg-conf .mg-inp{width:190px;display:inline-block;margin-left:6px;padding:5px 10px;font-size:12.5px}
.mg-plug{display:flex;align-items:center;gap:9px;padding:7px 0;border-bottom:1px solid #f2f3f5;font-size:12.8px}
.mg-plug:last-child{border-bottom:none}
.mg-plug .arr{color:var(--faint)}
.mg-plug.off{color:#b0b6be}
.mg-plug .mg-st{margin-left:auto}

/* ---------- 阶段 chips / 日志 ---------- */
.mg-phases{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:6px}
.mg-ph{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;border-radius:12px;padding:3px 10px;background:#f0f1f3;color:#6b7280;white-space:nowrap}
.mg-ph .dot{width:6px;height:6px;border-radius:50%;background:currentColor}
.mg-ph.done{background:var(--mg-green-bg);color:var(--mg-green)}
.mg-ph.run{background:var(--mg-soft);color:var(--mg-blue);font-weight:700}
.mg-ph.run .dot{animation:mgBlink 1s infinite}
.mg-ph.fail{background:var(--mg-red-bg);color:var(--mg-red)}
@keyframes mgBlink{50%{opacity:.2}}
.mg-log{background:#1d1d1f;color:#c9d1e0;border-radius:12px;padding:10px 14px;font-family:"SF Mono",Menlo,Consolas,monospace;font-size:11.5px;min-height:96px;max-height:132px;overflow:auto;line-height:1.75}
.mg-log .t{color:#6b7280;margin-right:6px}

/* ---------- 切换清单 / 指引 ---------- */
.mg-cl{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid #f2f3f5;font-size:12.8px}
.mg-cl:last-child{border-bottom:none}
.mg-cl .t{flex:1;min-width:0;white-space:normal}
.mg-cl .own{color:var(--faint);font-size:11.5px;border:1px solid rgba(0,0,0,.1);border-radius:10px;padding:0 8px;white-space:nowrap;flex-shrink:0}
.mg-cl.done .t{color:var(--faint);text-decoration:line-through}
.mg-cl.wait{opacity:.55}
.mg-guide{background:#f7f8fa;border-radius:12px;padding:12px 14px;font-size:12.5px;color:#444;white-space:pre-wrap;max-height:200px;overflow:auto;line-height:1.75}

/* ---------- 操作区 ---------- */
.mg-ops{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.mg-ops .div{width:1px;height:22px;background:rgba(0,0,0,.1);margin:0 4px}

/* ---------- 抽屉 ---------- */
.mg-dmask{position:fixed;inset:0;background:rgba(20,24,30,.35);z-index:1200;display:none}
.mg-dmask.show{display:block}
.mg-drawer{position:fixed;top:0;right:0;bottom:0;width:480px;max-width:94vw;background:#fff;
  box-shadow:-12px 0 36px rgba(0,0,0,.16);transform:translateX(102%);transition:transform .25s var(--ease);
  z-index:1201;display:flex;flex-direction:column}
.mg-drawer.show{transform:translateX(0)}
.mg-drawer .dh{padding:15px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:8px;font-weight:700;font-size:14px}
.mg-drawer .dh .x{margin-left:auto;color:#b9bfc7;cursor:pointer;font-weight:400;font-size:20px;line-height:1}
.mg-drawer .db{padding:14px 18px;overflow:auto;flex:1}
.mg-fail{border:1px solid rgba(0,0,0,.1);border-radius:12px;padding:9px 12px;margin-bottom:8px;font-size:12.5px}
.mg-fail .r{display:flex;gap:8px;align-items:center;margin-bottom:3px;flex-wrap:wrap}
.mg-fail .r b{font-weight:600}
.mg-fail .snap{color:var(--faint);font-family:"SF Mono",Menlo,Consolas,monospace;font-size:11px;background:#f7f8fa;border-radius:6px;padding:4px 8px;margin-top:5px;white-space:normal;word-break:break-all}

/* ---------- 弹窗 ---------- */
.mg-mask{position:fixed;inset:0;background:rgba(20,24,30,.45);display:none;align-items:center;justify-content:center;z-index:1300;padding:18px}
.mg-mask.show{display:flex}
.mg-modal{width:500px;max-width:96vw;max-height:88vh;overflow:auto;background:#fff;border-radius:18px;padding:20px 22px;box-shadow:0 24px 70px rgba(0,0,0,.3)}
.mg-modal h3{font-size:15px;font-weight:700;margin:0 0 12px;display:flex;align-items:center;gap:8px}
.mg-modal h3 .x{margin-left:auto;color:#b9bfc7;cursor:pointer;font-weight:400;font-size:20px;line-height:1}
.mg-modal .body{font-size:13px;color:#444;margin-bottom:14px;line-height:1.7}
.mg-modal .body ul{margin:8px 0 0 18px}
.mg-modal .act{display:flex;justify-content:flex-end;gap:8px}

/* ---------- toast ---------- */
.mg-toastwrap{position:fixed;top:70px;left:50%;transform:translateX(-50%);z-index:1400;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none}
.mg-toast{background:#fff;border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.16);padding:9px 16px;font-size:12.8px;color:#333;max-width:82vw}
.mg-toast.err{color:var(--mg-red)}

/* ---------- 空态 / 登录卡 ---------- */
.mg-empty{text-align:center;color:var(--sub);font-size:13px;padding:34px 10px}
.mg-empty b{display:block;font-size:14px;color:var(--ink);margin-bottom:4px}
.mg-login{max-width:520px;margin:0 auto}

/* ---------- 响应式 ---------- */
@media(max-width:900px){
  .mg-two{grid-template-columns:1fr}
  .mg-kpis{grid-template-columns:repeat(2,1fr)}
  .mg-frm{flex-direction:column;gap:4px}
  .mg-frm .lb{width:auto;padding-top:0}
  .mg-search input{width:120px}
}
