/* ===== 费用报销单 · 打印预览弹窗 · 240 × 140 mm 横版凭证纸 ===== */
/* 纸张尺寸改这里即可换纸（需与 expense_print.js 里的 PW/PH/M 保持一致） */
:root{
  --pw: 240mm;
  --ph: 140mm;
  --pm: 6mm;                 /* 页边距 */
  --col-gap: 6mm;            /* 双栏间距 */
  --h-head: 9mm;             /* 主标题 */
  --h-info: 11mm;            /* 信息栏（无边框）*/
  --h-th: 8mm;               /* 表头 */
  --h-sum: 9mm;              /* 合计行 */
  --h-sign: 9mm;             /* 签字栏 */
}

/* ---------- 遮罩与弹窗容器 ---------- */
.pm-mask{
  /* 需高于 .modal-mask(100) 与 .toast-root(200)，否则弹窗会被盖住 */
  position:fixed; inset:0; z-index:300;
  background:rgba(15,23,42,.55);
  display:flex; align-items:center; justify-content:center;
  padding:24px;
}
.pm-box{
  width:min(1180px, 100%);
  max-height:100%;
  display:flex; flex-direction:column;
  background:#fff; border-radius:12px; overflow:hidden;
  box-shadow:0 18px 48px rgba(15,23,42,.35);
  font-family:"Microsoft YaHei","PingFang SC",sans-serif; color:#0f172a;
}
.pm-box *{box-sizing:border-box}
.pm-box .grow{flex:1}

.pm-head{
  display:flex; align-items:center; gap:10px;
  padding:12px 16px; border-bottom:1px solid #e2e8f0; background:#fbfdff;
}
.pm-title{font-size:15px;font-weight:600}
.pm-badge{
  padding:2px 9px;border-radius:20px;background:#eff6ff;color:#1d4ed8;
  font-size:11.5px;font-weight:600;
}
.pm-badge.alt{background:#ecfdf5;color:#047857}
.pm-x{
  cursor:pointer; color:#94a3b8; font-size:16px; line-height:1;
  padding:4px 6px; border-radius:6px;
}
.pm-x:hover{background:#f1f5f9;color:#334155}

.pm-note{
  padding:7px 16px;font-size:12px;background:#fffbeb;color:#92400e;
  border-bottom:1px solid #fde68a;
}
.pm-note:empty{display:none}
.pm-note.ok{background:#ecfdf5;color:#047857;border-color:#a7f3d0}

/* ---------- 工具条 ---------- */
.pm-tb{
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  padding:10px 16px; border-bottom:1px solid #e2e8f0; background:#fff;
}
.pm-lab{font-size:12.5px;color:#475569}
/* 打印机数量 / 隐藏提示 */
.pm-tip{font-size:11.5px;color:#94a3b8;margin-left:2px;white-space:nowrap}
.pm-sep{width:1px;height:18px;background:#e2e8f0;margin:0 4px}
.pm-sel{
  height:30px;border:1px solid #cbd5e1;border-radius:6px;padding:0 8px;
  font-size:12.5px;background:#fff;color:#0f172a;min-width:160px;max-width:320px;
}
.pm-sel.num{min-width:64px;text-align:center;max-width:80px}
.pm-pager{
  font-size:12.5px;color:#475569;min-width:56px;text-align:center;
  font-variant-numeric:tabular-nums;
}
.pm-btn{
  height:30px;padding:0 12px;border:1px solid #cbd5e1;border-radius:6px;
  background:#fff;color:#334155;font-size:12.5px;cursor:pointer;
}
.pm-btn:hover{background:#f8fafc}
.pm-btn.primary{background:#2563eb;border-color:#2563eb;color:#fff}
.pm-btn.primary:hover{background:#1d4ed8}
.pm-btn.ghost{color:#64748b}
.pm-btn[disabled]{opacity:.5;cursor:not-allowed}

/* ---------- 预览舞台 ---------- */
.pm-stage{
  padding:18px; overflow:auto; background:#eef2f7;
  display:flex; justify-content:center; align-items:flex-start;
  flex:1; min-height:0;
}
.pm-wrap{
  width:var(--pw);
  transform-origin:top center;
  flex:none;
}
.pm-loading{padding:60px 0;text-align:center;color:#94a3b8;font-size:13px}

.pm-foot{
  padding:9px 16px;font-size:11.5px;color:#64748b;
  border-top:1px solid #e2e8f0;background:#fbfdff;text-align:center;
}

/* ---------- 纸张 ---------- */
/* border-box 必须显式声明：打印时 .pm-print-root 不在 .pm-box 内，
   拿不到 .pm-box * 那条规则；若退回 content-box，
   140mm 高 + 6mm×2 内边距 = 152mm 会溢出成两页 */
.sheet, .sheet *{ box-sizing:border-box; }
.sheet{
  width:var(--pw); height:var(--ph);
  background:#fff; position:relative; overflow:hidden;
  box-shadow:0 6px 22px rgba(15,23,42,.16);
  padding:var(--pm);
  display:flex; flex-direction:column;
  font-family:"Microsoft YaHei","PingFang SC","SimSun",sans-serif;
}

/* ============ 明细页 ============ */
:root{
  --c-main:#1565c0;
  --c-deep:#0d47a1;
  --c-light:#eef5fc;
  --c-band:#e8f1fb;
  --c-zebra:#f6f9fd;
  --c-text:#123a5e;
  --c-label:#5a7a9a;
  --c-line:#b8c6d4;
}

.ttl{
  text-align:center;font-weight:700;letter-spacing:5mm;
  line-height:var(--h-head);height:var(--h-head);
  font-size:5.4mm;color:var(--c-main);
}
.ttl .pg{font-size:3mm;color:#90a4b8;letter-spacing:0;margin-left:2mm;font-weight:400}

/* 信息栏：整行无边框，浅蓝底 + 左侧蓝色竖条 */
.info{
  display:flex;align-items:stretch;height:var(--h-info);margin-bottom:2mm;
  background:var(--c-light);border-left:1.2mm solid var(--c-main);
  padding:0 3mm;
}
.info>span{
  display:flex;align-items:center;gap:1.5mm;min-width:0;
  overflow:hidden;white-space:nowrap;padding:0 2mm;
}
.info i{font-style:normal;color:var(--c-label);font-size:3.1mm}
.info b{font-weight:600;color:var(--c-text);font-size:3.6mm}
.info .i1,.info .i2,.info .i4,.info .i5{flex:0 0 auto}
.info .i3{flex:1}
.info .iamt{flex:0 0 auto;margin-left:auto}
.info .iamt b{font-size:4.2mm;font-weight:700;color:var(--c-main)}

.tbl-wrap{overflow:hidden}
.cols{display:flex;gap:var(--col-gap)}
.col{flex:1;min-width:0}

/* 表头：蓝底 + 上下横线；表体无任何边框 */
table{width:100%;border-collapse:collapse;table-layout:fixed}
thead th{
  background:var(--c-band);color:var(--c-deep);font-weight:700;
  font-size:3.4mm;height:var(--h-th);padding:0 1.5mm;
  border-top:0.5mm solid var(--c-deep);
  border-bottom:0.5mm solid var(--c-deep);
  border-left:none;border-right:none;text-align:center;
}
thead th.l{text-align:left}
thead th.r{text-align:right}
tbody td{
  border:none;padding:0 1.5mm;overflow:hidden;
  font-size:3.6mm;color:var(--c-text);line-height:1.2;
}
tbody tr.odd{background:var(--c-zebra)}
/* 空白行：撑满表格用，保持单据规整（不写字，只保留斑马纹） */
tbody tr.blank td{height:inherit;min-height:1mm}
td.c{text-align:center}
td.l{text-align:left}
td.r{text-align:right;font-variant-numeric:tabular-nums}
td.nm{white-space:nowrap;text-overflow:ellipsis}
td.cnt{font-size:3.2mm;color:var(--c-label)}
td.amt{font-weight:700;color:var(--c-main)}
td.rmk{font-size:3.2mm;color:var(--c-label);white-space:nowrap;text-overflow:ellipsis}
.cat{color:var(--c-label);font-size:3.0mm}

/* 合计行：上下横线 + 浅蓝底 */
.sum{
  display:flex;justify-content:space-between;align-items:center;
  height:var(--h-sum);padding:0 3mm;font-size:3.8mm;background:var(--c-band);
  border-top:0.5mm solid var(--c-deep);border-bottom:0.5mm solid var(--c-deep);
}
.sum .cn{color:var(--c-deep)}
.sum .cn b{font-weight:700;margin-left:1.5mm;color:var(--c-text)}
.sum .num{font-weight:700;font-size:4.4mm;color:var(--c-main);font-variant-numeric:tabular-nums}

/* 签字栏：无边框，仅下划线（限定在报销凭证 .sheet 内，避免污染合同模块的签字框） */
.sheet .sign{
  display:flex;gap:6mm;align-items:flex-end;height:var(--h-sign);
  font-size:3.2mm;color:var(--c-label);padding-top:1mm;
}
.sheet .sign span{flex:1;border-bottom:0.3mm solid var(--c-line);padding-bottom:0.8mm;min-width:0}

/* ============ 凭证页（保持不变）============ */
.vh{display:flex;justify-content:space-between;align-items:baseline;height:7mm;font-size:3mm}
.vh .no{font-weight:700}
.vgrid{display:flex;gap:3mm;flex:1;min-height:0}
.vcell{
  flex:1;display:flex;flex-direction:column;border:1px dashed #888;
  padding:1.5mm;min-width:0;overflow:hidden;
}
.vcell.empty{border-style:dotted;opacity:.35}
.vimg{flex:1;display:flex;align-items:center;justify-content:center;overflow:hidden;min-height:0}
.vimg img{max-width:100%;max-height:100%;object-fit:contain;display:block}
.vcap{font-size:2.4mm;text-align:center;margin-top:1mm;line-height:1.35}
.vfoot{text-align:center;font-size:2.4mm;color:#666;padding-top:1mm}

/* ================= 打印 ================= */
/* 浏览器打印回退路径：
   JS 会把全部页面塞进挂在 body 下的 .pm-print-root，
   下面把 body 的其他直接子元素（含弹窗遮罩）全部隐藏，只留打印内容。 */
@media print {
  /* 注意：@page 里 CSS 变量不会被解析，必须写死尺寸。
     换纸时这里和 assets/js/expense_print.js 顶部的 PW / PH 要一起改。 */
  @page { size: 240mm 140mm; margin: 0; }

  html, body { background:#fff; margin:0; padding:0; }

  body > *:not(.pm-print-root) { display:none !important; }
  .pm-print-root { display:block !important; }

  .pm-print-root .sheet {
    width:240mm; height:140mm;
    box-shadow:none; margin:0; padding:6mm;
    page-break-after:always; break-after:page;
  }
  .pm-print-root .sheet:last-child { page-break-after:auto; break-after:auto; }

  body { -webkit-print-color-adjust:exact; print-color-adjust:exact; }
}
