/* 跨境ERP - 自定义样式 (配合 Bootstrap 5) */
:root{
  --sidebar-bg:#16202e;
  --sidebar-hover:#22304a;
  --sidebar-active:#2f6feb;
  --accent:#2f6feb;
  --page-bg:#f4f6fa;
}
*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,"Segoe UI",Roboto,"Helvetica Neue","PingFang SC","Microsoft YaHei",sans-serif;
  background:var(--page-bg);color:#1f2a37;font-size:14px}
.app{display:flex;min-height:100vh}

/* ---------- 侧边栏 ---------- */
.sidebar{width:230px;flex:0 0 230px;background:var(--sidebar-bg);color:#c8d3e0;display:flex;flex-direction:column;
  position:sticky;top:0;height:100vh;overflow-y:auto}
.brand{display:flex;gap:10px;align-items:center;padding:16px 16px 14px;border-bottom:1px solid #26344a}
.brand-logo{background:var(--sidebar-active);color:#fff;font-weight:700;border-radius:8px;padding:6px 9px;font-size:13px}
.brand-title{color:#fff;font-weight:600;font-size:14px;line-height:1.2}
.brand-sub{font-size:11px;color:#7f8ea3}
.menu{padding:10px 8px;flex:1}
.menu-group{padding:12px 10px 4px;font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:#6d7d93}
.menu a{display:flex;align-items:center;gap:9px;padding:8px 11px;border-radius:7px;color:#c8d3e0;text-decoration:none;
  font-size:13.5px;margin-bottom:1px;cursor:pointer}
.menu a:hover{background:var(--sidebar-hover);color:#fff}
.menu a.active{background:var(--sidebar-active);color:#fff;font-weight:600}
.menu a .ico{width:17px;text-align:center;opacity:.95}
.menu a .badge{margin-left:auto}

/* ---------- 可折叠菜单 (Data Details: 三组报表数据, 默认收起) ---------- */
.menu-fold{display:none}
.menu-fold.open{display:block}
.menu .menu-fold-head .caret{margin-left:auto;font-size:10px;opacity:.7;transition:transform .15s;
  padding:2px 7px;border-radius:5px;cursor:pointer}
.menu .menu-fold-head .caret:hover{background:rgba(255,255,255,.14);opacity:1}
.menu .menu-fold-head.open .caret{transform:rotate(180deg)}
.menu .menu-fold-head.has-active{color:#fff}
.menu-fold .menu-group{padding-left:18px;font-size:10px}
.menu-fold a{padding-left:22px;font-size:13px}
.sidebar-foot{padding:12px 16px;border-top:1px solid #26344a;color:#6d7d93}
.tiny{font-size:10.5px;line-height:1.6}

/* ---------- 主区 ---------- */
.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{height:58px;background:#fff;border-bottom:1px solid #e3e8ef;display:flex;align-items:center;gap:12px;
  padding:0 18px;position:sticky;top:0;z-index:20}
.page-title{font-size:17px;font-weight:600;margin:0;flex:1}
.topbar-right{display:flex;align-items:center;gap:10px}
.chip{background:#eef2f8;color:#43536b;border-radius:20px;padding:3px 11px;font-size:12px;white-space:nowrap}
.operator-box{display:flex;align-items:center;gap:6px;font-size:12px;color:#6b7a90;margin:0}
.page{padding:18px;flex:1}

/* ---------- 卡片 / 表格 ---------- */
.card{border:1px solid #e3e8ef;border-radius:10px;background:#fff;box-shadow:0 1px 2px rgba(16,24,40,.04);margin-bottom:16px}
.card-head{padding:12px 16px;border-bottom:1px solid #eef1f6;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.card-head h2{font-size:14.5px;font-weight:600;margin:0;flex:1}
.card-body{padding:16px}
.card-body.p0{padding:0}
.table{margin:0;font-size:13px}
.table>thead>tr>th{background:#f8fafc;color:#54637a;font-weight:600;font-size:11.5px;text-transform:uppercase;
  letter-spacing:.03em;white-space:nowrap;border-bottom:1px solid #e8edf3;padding:9px 12px}
.table>tbody>tr>td{padding:9px 12px;vertical-align:middle;border-color:#eef1f6}
.table-hover>tbody>tr:hover>td{background:#f7faff}
.num{text-align:right;font-variant-numeric:tabular-nums}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px}
.muted{color:#7b8798}
.toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.toolbar .form-control,.toolbar .form-select{max-width:220px}

/* ---------- 统计卡 ---------- */
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin-bottom:16px}
.stat{background:#fff;border:1px solid #e3e8ef;border-radius:10px;padding:14px 16px}
.stat .k{font-size:11.5px;color:#7b8798;text-transform:uppercase;letter-spacing:.05em}
.stat .v{font-size:22px;font-weight:700;margin-top:5px;font-variant-numeric:tabular-nums}
.stat .s{font-size:11.5px;color:#98a4b5;margin-top:3px}
.stat.blue .v{color:#2f6feb}.stat.green .v{color:#12a150}.stat.red .v{color:#e5484d}
.stat.amber .v{color:#d97706}.stat.grey .v{color:#54637a}

/* ---------- 弹窗 ---------- */
.modal-title{font-size:15.5px;font-weight:600}
.modal-header{padding:13px 18px}
.modal-body{padding:18px}
.modal-footer{padding:11px 18px}
.form-label{font-size:12.5px;font-weight:600;color:#43536b;margin-bottom:3px}
.form-control,.form-select{font-size:13.5px}
.form-control-sm,.form-select-sm{font-size:12.5px}
.item-table input{font-size:13px}
.item-table td{padding:5px 6px}
.hint{font-size:11.5px;color:#8894a7;margin-top:4px}
.section-title{font-size:12px;font-weight:700;color:#54637a;text-transform:uppercase;letter-spacing:.05em;
  margin:16px 0 8px;border-bottom:1px solid #eef1f6;padding-bottom:5px}
.section-title:first-child{margin-top:0}

/* ---------- 提示 ---------- */
.toast-wrap{position:fixed;top:16px;right:16px;z-index:2000;display:flex;flex-direction:column;gap:8px}
.toast-item{background:#fff;border-left:4px solid var(--accent);border-radius:7px;box-shadow:0 6px 20px rgba(16,24,40,.16);
  padding:11px 15px;font-size:13.5px;min-width:230px;animation:slideIn .18s ease}
.toast-item.ok{border-color:#12a150}.toast-item.err{border-color:#e5484d}.toast-item.warn{border-color:#d97706}
@keyframes slideIn{from{transform:translateX(24px);opacity:0}to{transform:none;opacity:1}}
.loading{position:fixed;inset:0;background:rgba(255,255,255,.55);display:none;align-items:center;justify-content:center;z-index:1500}
.loading.on{display:flex}

/* ---------- 特殊价缺失提示 (Special Price 模式回退批发价) ---------- */
.form-control.is-warn, .form-control.is-warn:focus{border-color:#d97706;background:#fffbeb}
.sp-warn{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:999px;font-size:11px;
  color:#92400e;background:#fef3c7;border:1px solid #fcd34d;white-space:nowrap}

/* ---------- 分币种合计 (灰色合计框上方, 右对齐) ---------- */
.cur-totals{margin:0 0 6px;padding-right:2px}
.cur-totals .kv{width:290px;margin-left:auto;font-size:12.5px;color:#6b7a90;padding:1px 0}
.cur-totals .kv .k{color:#8894a7}
.cur-totals .kv .v{font-weight:600;color:#43536b}

/* ---------- 可搜索下拉 (combobox) ---------- */
.ss-wrap{position:relative}
.ss-input{cursor:text;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%236b7a90'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 9px center;background-size:12px;padding-right:28px}
.ss-list{position:fixed;display:none;max-height:240px;overflow-y:auto;background:#fff;border:1px solid #d7dee8;
  border-radius:8px;box-shadow:0 10px 26px rgba(16,24,40,.16);z-index:1090;padding:3px}
.ss-list.open{display:block}
.ss-item{padding:6px 10px;font-size:13px;border-radius:6px;cursor:pointer;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.ss-item:hover,.ss-item.hi{background:#eef4ff}
.ss-item.selected{background:#e8f0fe;font-weight:600;color:#1b56c4}
.ss-empty{padding:9px 10px;font-size:12.5px;color:#98a4b5}

/* ---------- 其他 ---------- */
.badge-status{font-size:11px;padding:3px 8px;border-radius:20px;font-weight:600}
.st-new{background:#e8f0fe;color:#1b56c4}.st-ship{background:#fff3e0;color:#b45309}
.st-done{background:#e6f6ec;color:#0f7a3d}.st-void{background:#f2f4f7;color:#6b7a90}
.st-returning{background:#fdeef0;color:#c02b31}
.empty{text-align:center;color:#98a4b5;padding:34px 10px;font-size:13px}

/* ---------- View 弹窗底部的操作记录 (记录多时在框内滚动, 不撑爆弹窗) ---------- */
.log-scroll{max-height:280px;overflow:auto;border:1px solid #eef1f6;border-radius:8px}
.log-scroll .table{margin:0}
.log-scroll>table>thead>tr>th{position:sticky;top:0;z-index:1}
.log-scroll tr.log-extra{display:none}
.log-more{padding:6px 2px 0;font-size:12px;color:#7b8798}
.log-more a{cursor:pointer;color:var(--accent)}
.log-x{display:inline-block;margin-left:6px;padding:0 6px;border-radius:999px;font-size:11px;
  color:#43536b;background:#eef2f8}
.tabs{display:flex;gap:4px;border-bottom:1px solid #e8edf3;margin-bottom:14px}
.tabs .tab{padding:8px 14px;font-size:13.5px;color:#54637a;cursor:pointer;border-bottom:2px solid transparent}
.tabs .tab.active{color:var(--accent);border-color:var(--accent);font-weight:600}
.pager{display:flex;gap:6px;align-items:center;justify-content:flex-end;padding:10px 14px;font-size:12.5px;color:#6b7a90}
.detail-box{background:#f8fafc;border:1px solid #eef1f6;border-radius:8px;padding:13px 15px}
.kv{display:flex;justify-content:space-between;gap:14px;padding:3.5px 0;font-size:13px}
.kv .k{color:#7b8798}
.kv .v{font-weight:600;font-variant-numeric:tabular-nums}
.total-line{border-top:1px dashed #cfd8e3;margin-top:6px;padding-top:6px;font-size:14.5px}
canvas{max-width:100%}
@media (max-width:900px){
  .sidebar{position:fixed;left:-240px;z-index:1200;transition:left .2s}
  .sidebar.open{left:0}
  .app{display:block}
}