/* ============================================================================
   契约 HTML 文档渲染样式 —— 唯一来源（single source of truth）
   ----------------------------------------------------------------------------
   本文件同时供两处使用，改这里即两处生效：
     1. :3000 编辑器 SPA —— editor/public/index.html 通过
        <link rel="stylesheet" href="/render/docx-render.css"> 引入，
        页面盒 #editor/#editor-compare 带 .docx-render 类；
     2. :3100 同步转换 / ReVal 等外部消费方 —— 后端 GET /api/render.css
        代理本文件，外部项目注入 <style> 后给 .docx-render/.docx-paper 容器用。

   作用域类： .docx-render（文档内容） / .docx-paper（A4 纸张外观）。
   编辑器 chrome（工具栏、侧栏、缩放、.ProseMirror、.tableWrapper 等）仍在
   editor/public/styles.css，不进这里。
   ============================================================================ */

.docx-render {
  font-family: '宋体', SimSun, serif;
  line-height: 1.6;
  word-break: break-word;
  position: relative;
  z-index: 0;
}

/* 旧版 _GB2312 字体名（仿宋_GB2312 / 楷体_GB2312）在新系统上往往没装，而 docx 里
   的 run 就是按这个名字写的。浏览器对内联 `font-family:仿宋_GB2312` 找不到字体时
   会直接回落到容器默认（宋体），看起来"仿宋变宋体"；Word 则会把它替换成同族的
   仿宋。用 @font-face 的 local() 把旧名别名到本机同族字体，让两端表现一致。
   契约 HTML 里的 font-family 名不动（往返仍写回原字体名）。 */
@font-face {
  font-family: '仿宋_GB2312';
  src: local('FangSong'), local('仿宋'), local('STFangsong'), local('华文仿宋');
}
@font-face {
  font-family: '楷体_GB2312';
  src: local('KaiTi'), local('楷体'), local('STKaiti'), local('华文楷体');
}
@font-face {
  font-family: '仿宋体';
  src: local('FangSong'), local('仿宋'), local('STFangsong');
}

/* 标题字号（与 Word 样式一致） */
.docx-render h1 { font-size: 24px; }
.docx-render h2 { font-size: 20px; }
.docx-render h3 { font-size: 17px; }
.docx-render h4 { font-size: 14px; }
.docx-render h5 { font-size: 13px; }
.docx-render h6 { font-size: 12px; }

/* 表格：占满页宽、固定布局、塌陷边框，单元格内边距取 Word 默认。
   固定布局要按 Word 原始列宽显示，须由渲染层按 data-colwidths 铺 <colgroup>
   （见 src/render/renderHtml.js）。min-width 取 --page-content-width（编辑器由 JS
   写入 px），外部消费方无该变量时回退 100%（撑满纸张内容区）。 */
.docx-render table {
  border-collapse: collapse;
  width: 100%;
  table-layout: fixed;
  margin: 8px 0;
}
.docx-render table:not(td table) { min-width: var(--page-content-width, 100%) !important; }
.docx-render td table { min-width: 0 !important; }
/* 单元格内边距取 Word 的默认 w:tblCellMar：左右 0.19cm(5.4pt)、上下 0。源表若显式
   声明了 w:tblCellMar，渲染层会把该表单元格的内联 padding 烘焙进去（优先级更高）；
   此前这里硬编码 4px 8px，让窄边距表的显示内边距远大于原文。
   不再给单元格设 min-width：列宽由 tblGrid/colgroup 决定，再加下限只会让本来就窄的列
   （70722 技术报告 序号列 42px）显示偏宽、并且拖不窄。 */
.docx-render th,
.docx-render td { border: 1px solid #888; padding: 0 5.4pt; }
/* 内容一律不得画到单元格边框外。窄单元格里「评估价格（元）」会折成
   评估价格 / （元），而全角左括号（行首禁则）在部分渲染器（Word 的"允许标点溢出边界"、
   WPS 等）里被挂到单元格边界之外，看上去括号跑进了相邻单元格（70722 技术报告）。
   裁掉越界部分即可保证"括号不超出单元格边框"。 */
.docx-render th,
.docx-render td { overflow: hidden; }

/* <th> 在本契约里只表示「跨页重复的标题行」(w:tblHeader)，Word 不会因为它改变对齐或加粗，
   对齐/字重只由段落自身决定。浏览器的 th 默认 { text-align:center; font-weight:bold } 会篡改版式：
   无边框布局表（整段正文塞进 1×1 表格，中文报告模板常见）里整段话会被居中并加粗。
   还原为与 td 一致——段落自带 style="text-align:center" 时仍会居中（内联优先级更高）。 */
.docx-render th {
  text-align: inherit;
  font-weight: inherit;
}

/* 图片限制在页宽内；浮动图(衬底) */
.docx-render img { max-width: 100%; }
.docx-render img[data-float-behind] { z-index: -1; }

/* 浮动文本框占位符（如【WBK…】二维码占位）：绝对定位的辅助占位，docx 里必须保留
   （后续盖章/二维码按 data-float-x/y 定位写入），但屏显一律不展示。 */
.docx-render span[data-float-box] { display: none; }

/* 中文禁则：行首/行尾标点不孤立，长英文/数字可断行，与 Word 折行一致 */
.docx-render p,
.docx-render li,
.docx-render td,
.docx-render th,
.docx-render h1,
.docx-render h2,
.docx-render h3,
.docx-render h4,
.docx-render h5,
.docx-render h6 {
  overflow-wrap: anywhere;
  line-break: strict;
}

/* 空段落显示为可见空行（编辑器对空块注入 <br>，裸 HTML 空 <p></p> 会塌陷）。
   Word 的空段落按 w:spacing 的行距占位，通常没有段前/段后距；浏览器默认的
   1em 上下边距会凭空加高每个空行（封面 4 个空行漂移 ~42pt，浮动图因此下沉）。
   源文档显式写了段前/段后距时，内联 margin 仍会覆盖这里的 0。 */
.docx-render p:empty { margin: 0; }
.docx-render p:empty::before { content: '\00a0'; }

/* 分页符 / 分节符 显示标记（仅屏显，不影响导出） */
.docx-render [data-page-break] {
  border-top: 1px dashed #bbb; text-align: center; margin: 12px 0;
  color: #999; font-size: 12px;
}
.docx-render [data-page-break]::after { content: "⏎ 分页符"; }
.docx-render [data-section-break] {
  border-top: 1px dashed #bbb; text-align: center; margin: 12px 0;
  color: #999; font-size: 12px;
}
.docx-render [data-section-break]::after { content: "⏎ 分节符（新页）"; }
.docx-render [data-page-break-before] { position: relative; padding-top: 24px; }
.docx-render [data-page-break-before]::before {
  content: "⏎ 分页符";
  position: absolute; top: 0; left: 0; right: 0;
  text-align: center; color: #999; font-size: 12px;
  border-top: 1px dashed #bbb; padding-top: 2px;
}

/* 目录（TOC）点线填充 */
.docx-render .toc { display: flex; align-items: baseline; }
.docx-render .toc-title { white-space: nowrap; }
.docx-render .toc-dots { flex: 1; min-width: 12px; border-bottom: 1px dotted #000; margin: 0 3px; }
.docx-render .toc-page { white-space: nowrap; }

/* 脚注 */
.docx-render sup[data-footnote-id] { color: #e67e22; cursor: pointer; }
.docx-render section[data-footnotes] { border-top: 1px solid #ccc; margin-top: 24px; padding-top: 12px; }
.docx-render section[data-footnotes] > div { font-size: 12px; color: #555; margin-bottom: 4px; }

/* 批注高亮（#ffe58f + ◆ 标记） */
.docx-render mark[data-comment-id] { background: #ffe58f; }
.docx-render mark[data-comment-id]::after {
  content: "◆"; font-size: 9px; vertical-align: super; color: #e67e22; margin-left: 1px;
}
.docx-render mark[data-comment-id].jump-flash {
  background: #ffb300;
  box-shadow: 0 0 0 3px rgba(255, 179, 0, 0.55);
  animation: commentJumpPulse 0.9s ease 2;
  border-radius: 2px;
}
@keyframes commentJumpPulse {
  0%, 100% { background: #ffb300; }
  50% { background: #ffe58f; }
}
.docx-render mark[data-comment-id].comment-active {
  background: #ff8a80;
  box-shadow: 0 0 0 2px #e64a19, 0 0 8px rgba(230, 74, 25, 0.45);
  border-radius: 2px;
}
.docx-render mark[data-comment-id].comment-active::after { color: #fff; }

/* 公式载体：MathML 原样渲染，行内不拆行 */
.docx-render span.math {
  display: inline-block;
  white-space: nowrap;
  unicode-bidi: isolate;
  vertical-align: middle;
  line-height: normal;
  cursor: default;
}
.docx-render span.math math { font-size: 1em; }

/* ===== A4 纸张外观（外部消费方如 ReVal 的报告预览/文件预览共用）=====
   纸张由每个 <section data-section> 自己充当：契约 HTML 给每节内联了
   padding(=页边距 mm) 与 width/min-height(=纸张尺寸 mm，横向节 297×210)，
   这里补上纸面/阴影/居中。.docx-paper 退为纯容器——固定成 210mm 竖版会把
   横向节的内容塞进竖版纸里显示（"横向 A4 显示成竖版"）。
   box-sizing:border-box 让内联 width 含内边距，否则 210mm + 左右页边距会溢出。 */
.docx-render section[data-section] {
  width: 210mm;
  min-height: 297mm;
  box-sizing: border-box;
  background: #fff;
  margin: 0 auto;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
  /* Each page is its own containing block AND stacking context. The containing
     block anchors page-referenced floats to their own sheet (not the top of the
     editor's page stack). The stacking context keeps a behind-text photo
     (z-index:-1) above THIS page's white background but below its text — without
     it the negative layer painted behind the section background and the cover
     image vanished. */
  position: relative;
  z-index: 0;
}
.docx-paper {
  width: auto;
  min-height: 0;
  margin: 0 auto;
  background: transparent;
  padding: 0;
  box-shadow: none;
}
/* 纸面阴影已落在每节上，打印时同样要去掉（消费方的 @media print 只覆盖 .docx-paper）。 */
@media print {
  .docx-render section[data-section] { box-shadow: none; }
}
