/* ============================================================
   📥 发票收件箱（mailbox.js · v2.40.0）
   ------------------------------------------------------------
   独立成文件而不是塞进 design.css 的原因：
   design.css 是并行会话频繁改动的主样式文件，追加的段落会被整段覆盖
   （已实际发生一次：样式写完又被覆盖丢失，页面裸奔）。
   独立文件只有本功能自己会动，物理上杜绝冲突。
   依赖 design.css 的设计令牌（--brand / --panel / --txt-3 …），
   在 index.html 里排在 design.css 之后加载。
   ============================================================ */

/* ---- 邮箱配置卡片 ---- */
.mb-cfg-hd{ display:flex; justify-content:space-between; align-items:flex-start; gap:var(--s4); flex-wrap:wrap; }
.mb-cfg-hd h3{ padding:0 !important; margin:0 0 4px !important; border:0 !important; }
.mb-cfg-hd p{ margin:0; font-size:var(--f-12); line-height:var(--lh-normal); }
.mb-cfg-btns{ display:flex; gap:var(--s2); flex:none; }

.mb-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(210px, 1fr)); gap:var(--s3); margin:var(--s4) 0 var(--s3); }
.mb-grid .fld{ display:flex; flex-direction:column; gap:5px; }
.mb-grid .fld > span{ font-size:var(--f-12); color:var(--txt-2); font-weight:600; }
.mb-grid input{
  padding:7px 10px; font-size:var(--f-13); border:1px solid var(--line);
  border-radius:var(--r-sm); background:var(--panel); color:var(--txt);
  font-family:inherit; width:100%; min-height:34px;
}
.mb-grid input:focus{ outline:none; border-color:var(--brand); box-shadow:0 0 0 2px var(--brand-50); }

.mb-switches{ display:flex; align-items:center; gap:var(--s4); flex-wrap:wrap;
  padding:var(--s3) var(--s4); background:var(--panel-2);
  border:1px solid var(--line-2); border-radius:var(--r-md); }
.mb-switches .sw{ display:flex; align-items:baseline; gap:7px; cursor:pointer; font-size:var(--f-13); }
.mb-switches .sw input{ width:16px; height:16px; accent-color:var(--brand); flex:none; position:relative; top:2px; }
.mb-switches .sw em{ font-style:normal; font-size:var(--f-11); }
.mb-status{ margin-top:var(--s3); font-size:var(--f-12); line-height:var(--lh-normal); }

/* ---- 汇总条 ---- */
.mb-sum-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:var(--s3); }
.mb-stat{ padding:var(--s3) var(--s4); border-radius:var(--r-md);
  background:var(--panel-2); border:1px solid var(--line-2); }
.mb-stat-t{ font-size:var(--f-11); color:var(--txt-3); letter-spacing:.02em; }
.mb-stat-v{ font-size:var(--f-21); font-weight:700; letter-spacing:-.02em; margin:2px 0 1px;
  color:var(--txt); font-variant-numeric:tabular-nums; }
.mb-stat-s{ font-size:var(--f-11); color:var(--txt-3); line-height:1.5; }

/* ---- 筛选 + 批量 ---- */
.mb-bar{ display:flex; justify-content:space-between; align-items:center; gap:var(--s3); flex-wrap:wrap; margin-bottom:var(--s2); }
.mb-bar .seg{ display:inline-flex; gap:2px; padding:3px; background:var(--panel-3);
  border:1px solid var(--line-2); border-radius:var(--r-md); }
.mb-bar .seg-i{ border:0; background:transparent; padding:5px 12px; border-radius:var(--r-xs);
  font-size:var(--f-12); color:var(--txt-2); cursor:pointer; font-family:inherit; }
.mb-bar .seg-i b{ color:var(--txt-3); font-weight:600; }
.mb-bar .seg-i.on{ background:var(--panel); color:var(--brand); box-shadow:var(--sh-1); font-weight:600; }
.mb-bar .seg-i.on b{ color:var(--brand); }

/* ---- 分组统计表 ----
   注意：td:first-child 用 max-width:0 + ellipsis 截断时，
   后面的 td 必须给固定宽度，否则表格按内容撑开会被长文本挤出重叠
   （实际踩过：销方名一长，金额列就压到别的格子上叠字）。 */
.mb-group-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(250px, 1fr)); gap:var(--s4); }
.mb-gt{ min-width:0; }
.mb-gt-t{ font-size:var(--f-12); font-weight:700; color:var(--txt-2); margin-bottom:6px; }
.mb-gtt{ width:100%; table-layout:fixed; border-collapse:collapse; font-size:var(--f-12); }
.mb-gtt td{ padding:5px 6px; border-bottom:1px solid var(--line-2); overflow:hidden; }
.mb-gtt td:first-child{ color:var(--txt); width:auto; text-overflow:ellipsis; white-space:nowrap; }
.mb-gtt td.n{ text-align:right; color:var(--txt-2); font-variant-numeric:tabular-nums;
  white-space:nowrap; width:56px; padding-left:2px; padding-right:2px; }
.mb-gtt td.n.t{ color:var(--txt-3); width:70px; }

/* ---- 票卡片 ----
   .mb-card-t 用 flex 1 + min-width:0 允许收缩，徽章区 flex:none 不被挤走；
   金额行独立成块（不塞进 hd 里），避免长票号把金额顶到徽章底下叠字。 */
.mb-cards{ display:grid; grid-template-columns:repeat(auto-fill, minmax(340px, 1fr)); gap:var(--s3); }
.mb-card{ padding:var(--s4) !important; display:flex; flex-direction:column; gap:var(--s3);
  min-width:0; overflow:hidden; }
.mb-card.done{ background:var(--panel-2); border-style:dashed; }
.mb-card.bad{ border-color:var(--warn-100); background:var(--warn-50); }

.mb-card-hd{ display:flex; align-items:flex-start; gap:var(--s2); flex-wrap:wrap; min-width:0; }
.mb-chk{ flex:none; display:inline-flex; }
.mb-chk input{ width:16px; height:16px; accent-color:var(--brand); cursor:pointer; margin-top:2px; }
.mb-card-t{ display:flex; align-items:flex-start; gap:var(--s2); flex:1 1 190px; min-width:0; }
.mb-no{ font-size:var(--f-15); font-weight:700; letter-spacing:-.01em; color:var(--txt);
  font-variant-numeric:tabular-nums; word-break:break-all; min-width:0; }
.mb-sub{ font-size:var(--f-11); color:var(--txt-3); margin-top:2px; line-height:1.5;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%; }
.mb-badges{ display:flex; align-items:center; gap:5px; flex-wrap:wrap; flex:none; margin-left:auto; }
.mb-amt{ display:flex; align-items:baseline; gap:var(--s2); flex-wrap:wrap;
  padding-top:var(--s2); border-top:1px dashed var(--line-2); min-width:0; }
.mb-amt b{ font-size:var(--f-18); font-weight:700; letter-spacing:-.02em; color:var(--txt);
  font-variant-numeric:tabular-nums; white-space:nowrap; }
.mb-amt .muted{ font-size:var(--f-11); }

.mb-badge{ display:inline-block; padding:1px 7px; border-radius:var(--r-full);
  font-size:var(--f-11); background:var(--panel-3); color:var(--txt-3);
  border:1px solid var(--line-2); white-space:nowrap; }
.mb-badge.ok{ background:var(--ok-50); color:var(--ok); border-color:var(--ok-100); }
.mb-badge.w{ background:var(--warn-50); color:var(--warn); border-color:var(--warn-100); }
.mb-badge.e{ background:var(--err-50); color:var(--err); border-color:var(--err-100); }

.mb-edit{ display:grid; grid-template-columns:1fr 1fr; gap:var(--s2); }
.mb-edit .fld{ display:flex; flex-direction:column; gap:4px; }
.mb-edit .fld > span{ font-size:var(--f-11); color:var(--txt-3); font-weight:600; }
.mb-edit input, .mb-edit select{
  padding:6px 9px; font-size:var(--f-12); border:1px solid var(--line);
  border-radius:var(--r-xs); background:var(--panel); color:var(--txt);
  font-family:inherit; width:100%; min-height:32px;
}
.mb-edit input:focus, .mb-edit select:focus{ outline:none; border-color:var(--brand); box-shadow:0 0 0 2px var(--brand-50); }

.mb-items{ font-size:var(--f-12); }
.mb-items summary{ cursor:pointer; color:var(--brand); font-weight:600; padding:3px 0; }
.mb-it{ width:100%; border-collapse:collapse; margin:6px 0 3px; font-size:var(--f-11); }
.mb-it td{ padding:3px 5px; border-bottom:1px solid var(--line-2); color:var(--txt-2); }
.mb-it td.n{ text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.mb-it td.t{ color:var(--txt-3); }

.mb-fail{ font-size:var(--f-12); color:var(--warn); line-height:var(--lh-normal); }
.mb-fail .muted{ color:var(--txt-3); font-size:var(--f-11); }

.mb-card-ft{ display:flex; align-items:center; gap:var(--s2); flex-wrap:wrap;
  margin-top:auto; padding-top:var(--s2); border-top:1px solid var(--line-2); }
.mb-card-ft .muted{ font-size:var(--f-11); }
.mb-card-ft a.btn{ text-decoration:none; }

/* 窄屏：编辑区与卡片改单列 */
@media (max-width: 620px){
  .mb-edit{ grid-template-columns:1fr; }
  .mb-cards{ grid-template-columns:1fr; }
  .mb-cfg-btns{ width:100%; }
  .mb-cfg-btns .btn{ flex:1 1 auto; }
}