/**
 * 文书渲染的通用样式（全局）。
 *
 * 为什么放全局而不是各组件 scoped：同一份「签署态文书」会在三个地方出现——
 * 文书库的签署预览、签署工作台的文书区、编辑器里的占位符胶囊。
 * 三处各写一份 :deep() 覆盖，改一次配色要改三处，且必然漂移。
 *
 * 类名口径与原型 V10.2 对齐：
 * - `.docfld`  = 填写项（占位符）。空值是虚线胶囊，渲染态加 `.filled` 后**保留一圈实线细框**
 *   （颜色按 kind 走：文本=品牌色、签名=橙、勾选=绿），只把底色转透明、字重转 normal。
 *   即「有框 = 这一处是系统管理的填写位」，空/满都保留框——2026-09-27 按原型改回，
 *   此前曾把框设成透明，那会让 HIS 带出的值与正文文字完全看不出区别；
 * - `.docopt`  = 一组选项里的单项，用 ☑ / ☐ 文本而不是 input。
 *
 * 约定：`.docfld` / `.docopt` 的配色只在原型基础上做**一处**改动——
 * 原型的 `#8aa4b0` 下划线、`#c07f00` 签名橙、`#0f9d6c` 勾选绿都原样保留，
 * 因为它们与项目主题变量（--brand / --warn / --ok）本来就是同一套色系。
 */

/* ============ 填写项：占位符胶囊 ============ */

.docfld {
  display: inline-block;
  padding: 1px 8px;
  margin: 0 2px;
  color: var(--brand-d);
  font-weight: 600;
  /* nowrap 是**编辑态胶囊**要的（原型 `.docfld` 原样）：胶囊里是一句标签，不该折行。
     渲染态在下面 `.filled` 里放开 —— 见那段注释，这是表格被挤坏的那个 bug 的根因。 */
  white-space: nowrap;
  background: var(--brand-l);
  border: 1px dashed var(--brand);
  border-radius: 5px;
}

/* 签名位：它决定签名落位，是文书里最不能漏的一项，用橙色单独区分 */
.docfld.k-signature {
  color: #9a5f00;
  background: #fff7e8;
  border-color: #c07f00;
}

/* 勾选 / 选择类：绿色；未填充时前面带一个 ☑ 提示这是可勾的 */
.docfld.k-checkbox,
.docfld.k-choice {
  color: #0b7a4b;
  background: #eafaf1;
  border-color: #0f9d6c;
}

.docfld.k-checkbox:not(.filled)::before,
.docfld.k-choice:not(.filled)::before {
  font-weight: 700;
  content: '\2611  ';
}

/* 渲染态：底色与加粗去掉（值直接读作正文），但**保留那圈实线细框** ——
   原型 `.docfld.filled` 只把 `border-style` 从 dashed 改成 solid，没有改 `border-color`，
   所以框的颜色仍由 kind 决定（文本=--brand、签名=橙、勾选=绿）。
   这圈框是文书上「这一处是系统管理的填写位」的唯一视觉标识：去掉它，
   HIS 带出的值（如「患者姓名 陈志强」）与正文文字就完全分不出来（2026-09-27 已踩）。
   空值同理保留框，框内是一条 `.docfld-blank` 下划线。

   **`white-space: normal` 是必须的**（2026-09-27 修 bug）：编辑态那句 nowrap 会把
   渲染态的**整块取值**也变成不可折行 —— 勾选/选择类里两个长选项（如「是（带离机构外使用、
   按单次门诊处方量管理）」）于是把表格的 min-content 撑到 508px。
   纸宽 820（版心 572）时刚好放得下，**窗口一窄纸被压到 708（版心 494）就溢出**：
   表宽超出版心、「药品名称」那一列被压成 28px 宽的竖排（用户在窄窗口/高缩放下截的图）。
   渲染态允许折行后 min-content 降到几十像素，纸再窄也放得下。 */
.docfld.filled {
  padding: 1px 2px;
  font-weight: 400;
  cursor: default;
  white-space: normal;
  background: transparent;
  border-style: solid;
}

/* 空值占位：一条下划线。原型是 inline style，这里落成类名，
   免得渲染端拼 HTML 时再手写一段样式字符串（也就没法统一调整） */
.docfld-blank {
  display: inline-block;
  min-width: 90px;
  border-bottom: 1px solid #8aa4b0;
}

/* 文本 / 日期填写项在签署页是可补录的，控件压成与 .docfld-blank 完全一致的外观：
   空着是一条下划线、填好了是正文。原型这类项只读（值全来自 HIS），
   本仓库还有必须现场手填的自定义文本项，所以保留输入能力但不上表单外观。 */
.docfld-input {
  min-width: 90px;
  padding: 0 2px;
  color: inherit;
  font: inherit;
  font-weight: inherit;
  text-align: center;
  background: transparent;
  border: 0;
  border-bottom: 1px solid #8aa4b0;
  border-radius: 0;
}

.docfld-input:focus {
  background: #f4fafc;
  border-bottom-color: var(--brand);
  outline: none;
}

/* 未填写的必填项：下划线转橙，让签署页一眼看出还有哪几处要填。
   原型没有这一档（它的空值只有一条淡线），是为签署页可用性补的——
   渲染态所有填写项都带同一圈品牌色细框，光靠框分不出「这处还没填」 */
.docfld.sign-field--missing .docfld-blank,
.docfld.sign-field--missing .docfld-input {
  border-bottom-color: #d9821f;
}

.docfld.sign-field--missing .docfld-input {
  background: #fffdf7;
}

/* 签名图：原型固定 46px 高、垂直居中 */
.docfld-signature {
  height: 46px;
  vertical-align: middle;
}

/* 未采集签名的提示文字 */
.docfld-empty {
  color: var(--mut);
  font-size: 11px;
}

/* 可点击采集签名的填写项：整块胶囊都是点击热区（子节点会冒泡到宿主），
   hover / 聚焦给出明确反馈，否则操作人员不知道这里能点 */
.docfld.sign-field--actionable {
  cursor: pointer;
  background: #fffaf0;
  border-color: #f0a21a;
}

.docfld.sign-field--actionable:hover {
  background: #fff3d8;
  border-color: #d98c05;
  box-shadow: 0 0 0 2px rgb(240 162 26 / 20%);
}

.docfld.sign-field--actionable:focus-visible {
  outline: 2px solid var(--brand);
  outline-offset: 1px;
}

/* 取值命中高危值（如「否」）：底色转红，签署端会额外在页脚汇总 */
.docfld.sign-field--abnormal {
  background: #fdf0f0;
  border-color: #efb9bb;
}

/* 「📲 Pad 签署」定位到签名位时的高亮（原型 .sig-locate）：
   虚线描边 + 三下脉冲，提示操作人「点这个签名框就能签」。
   类名与时长在 utils/signing-document.ts（SIGN_FIELD_LOCATE_CLASS / _MS），别在这里另写。 */
.docfld.sign-field--locate {
  outline: 2.5px dashed #2b7bd4;
  outline-offset: 4px;
  border-radius: 4px;
  animation: sig-pulse 1.1s ease-in-out 3;
}

@keyframes sig-pulse {
  0%,
  100% {
    box-shadow: 0 0 0 0 rgb(43 123 212 / 0%);
  }

  50% {
    box-shadow: 0 0 0 8px rgb(43 123 212 / 22%);
  }
}

/* ============ 选项：☑ / ☐ ============ */

.docopt {
  display: inline-block;
  padding: 1px 3px;
  margin-right: 12px;
  border-radius: 4px;
}

.docopt.tick {
  cursor: pointer;
  user-select: none;
}

.docopt.tick:hover {
  background: #f0f6f8;
}

.docopt.on {
  color: #0b7a4b;
  font-weight: 600;
}

/* 无名称的单个勾选框：正文里只剩一个 ☐（表格勾选列、无选项的勾选项），
   点击区域会从上百像素缩到二十来像素，签署时不好点。
   补一圈内边距把可点范围拉回来，外观上仍是"一个待勾的方框"。 */
.docopt.bare {
  padding: 1px 10px;
  text-align: center;
}

/* ============ 存量兼容：表格勾选列与行内方框 ============ */

.sign-doc-checkbox {
  width: 15px;
  height: 15px;
  accent-color: var(--brand);
  cursor: pointer;
}

.sign-doc-checkbox:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}

/* 正文行内选项（□否 □是）：用 label 包住方框与选项文字，点文字也能选中 */
.sign-doc-option {
  display: inline-flex;
  gap: 3px;
  align-items: center;
  margin-right: 14px;
  white-space: nowrap;
  cursor: pointer;
}

/* 存量「勾选表」：表头含「勾选」列 */
.sign-doc-table {
  width: 100%;
  border-collapse: collapse;
}

/* 这里曾有「系统页眉」（患者姓名 / 性别 / 年龄 / 住院号·门诊号 的一行）。
   2026-09-30 去掉：编辑器里没有这一条，编辑时看不到、签出来却多一行。
   患者信息要出现在文书上，就在正文里插对应的 HIS 占位符。 */