/* ==========================================================================
   双屏审单工作台（Business Workbench）
   参考形态：共享中心业务处理台 —— 左侧单据影像、右侧制单与分录
   设计依据：
     * 江苏政采共享中心记账 6 步：收件确认 → 条码扫描 → 票据录入（自动生成分录）
       → 结转费用 → 凭证审核 → 凭证查阅（联动原始影像）
     * 内蒙古政采：驳回须选择批退原因；提交后即时评分反馈
   ========================================================================== */

/* 让双屏审单对话框更宽 */
.dialog--dual { width: min(1180px, calc(100vw - 32px)); }

.dual {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: 0;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--color-surface);
}

.dual__pane {
  display: grid;
  align-content: start;
  gap: var(--space-4);
  padding: var(--space-5);
  min-width: 0;
}

.dual__pane--left { border-right: 1px solid var(--color-border); background: var(--paper-050); }

.dual__title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  color: var(--color-heading);
  font-size: var(--text-sm);
  font-weight: var(--weight-bold);
}

.dual__title small { color: var(--color-text-subtle); font-weight: var(--weight-normal); font-size: var(--text-xs); }

/* 影像区：教学环境用图示占位，不使用真实票据图片 */
.dual__images { display: grid; gap: var(--space-3); }

.dual__image {
  position: relative;
  display: grid;
  gap: var(--space-2);
  padding: var(--space-4);
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-sm);
  background: repeating-linear-gradient(135deg, #fff, #fff 10px, var(--paper-050) 10px, var(--paper-050) 20px);
}

.dual__image-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold);
  color: var(--color-heading);
}

.dual__image-tag {
  padding: 2px var(--space-2);
  border-radius: var(--radius-xs);
  background: var(--ink-050);
  color: var(--ink-700);
  font-family: var(--font-mono);
  font-size: 10px;
}

.dual__image-lines { display: grid; gap: var(--space-2); }

.dual__image-line {
  height: 7px;
  border-radius: 3px;
  background: var(--paper-200);
}

.dual__image-line:nth-child(1) { width: 62%; }
.dual__image-line:nth-child(2) { width: 88%; }
.dual__image-line:nth-child(3) { width: 74%; }

.dual__image-meta {
  color: var(--color-text-subtle);
  font-family: var(--font-mono);
  font-size: 10px;
}

/* 右侧制单：字段网格 */
.dual__form { display: grid; gap: var(--space-3); }

.dual__row {
  display: grid;
  grid-template-columns: 78px minmax(0, 1fr);
  gap: var(--space-3);
  align-items: center;
}

.dual__row label { color: var(--color-text-subtle); font-size: var(--text-xs); }

.dual__row .input,
.dual__row .select { min-height: 34px; padding: var(--space-2) var(--space-3); font-size: var(--text-sm); }

/* 自动生成的分录 */
.entry {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  overflow: hidden;
}

.entry__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  padding: var(--space-2) var(--space-3);
  background: var(--ink-050);
  border-bottom: 1px solid var(--color-border);
  font-size: var(--text-xs);
  font-weight: var(--weight-bold);
  color: var(--ink-700);
}

.entry table { width: 100%; border-collapse: collapse; font-size: var(--text-xs); }

.entry th,
.entry td {
  padding: var(--space-2) var(--space-3);
  border-bottom: 1px solid var(--color-border);
  text-align: left;
  white-space: nowrap;
}

.entry thead th { background: var(--paper-050); color: var(--color-text-subtle); font-weight: var(--weight-bold); }
.entry tbody tr:last-child td { border-bottom: 0; }
.entry .dr { color: var(--color-heading); font-weight: var(--weight-semibold); }
.entry .cr { padding-left: var(--space-5); color: var(--color-text-muted); }
.entry td.num { text-align: right; font-family: var(--font-mono); font-variant-numeric: tabular-nums; }

.entry__sum {
  display: flex;
  justify-content: space-between;
  padding: var(--space-2) var(--space-3);
  background: var(--paper-050);
  border-top: 1px solid var(--color-border);
  font-size: var(--text-xs);
}

.entry__sum strong { font-family: var(--font-mono); color: var(--color-heading); }

/* 批退原因选择 */
.reject-box {
  display: grid;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-4);
  border: 1px solid var(--vermilion-600);
  border-radius: var(--radius-sm);
  background: var(--vermilion-100);
}

.reject-box__title { color: var(--vermilion-700); font-size: var(--text-xs); font-weight: var(--weight-bold); }
.reject-box .select { border-color: var(--vermilion-600); }

/* 提交后的即时评分 */
.score-note {
  display: grid;
  gap: var(--space-2);
  padding: var(--space-4);
  border: 1px solid var(--color-border);
  border-left: 3px solid var(--gold-500);
  border-radius: var(--radius-sm);
  background: var(--gold-100);
  font-size: var(--text-sm);
}

.score-note__row { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-3); }
.score-note__row strong { font-family: var(--font-mono); color: var(--color-heading); }
.score-note__ok { color: var(--green-700); }
.score-note__bad { color: var(--vermilion-700); }

@media (max-width: 900px) {
  .dual { grid-template-columns: minmax(0, 1fr); }
  .dual__pane--left { border-right: 0; border-bottom: 1px solid var(--color-border); }
}

@media print {
  .dual { break-inside: avoid; }
}