/* 原文照合カードの「どのファイルが根拠か」ボタン。
   .eye-pdf-btn は 32x32 のアイコン枠なので、ファイル名を入れると溢れる。
   長い名前は省略し、全体は title 属性で見せる。 */
.src-origin-btn {
  display: inline-flex; align-items: center; gap: 4px;
  max-width: 220px; height: 24px; padding: 0 10px; flex-shrink: 1; min-width: 0;
  border: 1px solid var(--ref-src-border); border-radius: 9999px;
  background: var(--ref-src-bg); color: var(--ref-src-fg);
  font-size: 11px; font-weight: 600; cursor: pointer;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  transition: all .15s;
}
.src-origin-btn:hover { background: var(--ref-src-bg-hover); border-color: var(--ref-src-fg); }

.eye-pdf-btn {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  border: 1px solid var(--ref-src-border);
  background: var(--ref-src-bg);
  color: var(--ref-src-fg);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all .15s;
}
.eye-pdf-btn:hover {
  background: var(--ref-src-bg-hover);
  border-color: var(--ref-src-fg);
}

/* ------------------------------------------------------------------
   OCR の要否を聞くダイアログ

   `.source-modal` の見た目を流用する（幅とアクションだけ上書き）。
   **テーマ変数は `body` にある**ので、`:root` で var() を組まないこと
   （無音で無効になる）。
   ------------------------------------------------------------------ */
/* **原文モーダルより上に出す。**
   `#ocrAskModal` と `#sourceModal` はどちらも `.source-overlay`（z-index:100）で、
   z-index が同値だと**同じ重ね合わせ文脈では DOM で後ろにある方が上に描かれる**。
   `#ocrAskModal`（index.html:445）は `#sourceModal`（:466）より前にあるので、
   指定しないと必ず原文モーダルの裏に回り、**開いたのに操作できない**。
   局ナレッジ管理モーダル（1000・`station_knowledge.js` のインライン style）からも
   開かれるので、**1000 より上**である必要がある。
   `#eyeDocModal`（1200）より下に置く —— 資料ビューアは常に最前面でよい。 */
#ocrAskModal { z-index: 1100; }

.ocr-ask-modal { width: 620px; max-width: 94vw; }

.ocr-ask-lead {
  margin: 0 0 10px;
  font-size: 13px;
  line-height: 1.7;
  color: var(--text);
}

/* テキストレイヤが0字のファイル。**OCR しないと本文が取れない**ので、
   聞く側（画像あり）と見分けが付くようにする。 */
.ocr-ask-must {
  padding: 8px 10px;
  border-radius: 8px;
  background: var(--chip-bg);
  border-left: 3px solid var(--text-secondary);
}

.ocr-ask-list {
  margin: 0 0 14px;
  padding-left: 18px;
  font-size: 13px;
  line-height: 1.9;
  color: var(--text);
}

/* ページ数・文字数・画像数。**規模が判断材料**なので必ず出す。 */
.ocr-ask-meta {
  font-size: 12px;
  color: var(--text-secondary);
}

/* 「269ページのうち10ページだけ読み取ります」（#693）。
   **警告ではない**ので `--warn` を使わない —— 読み込む側を後押しする案内で、
   下の `.ocr-ask-degraded`（注意）と同じ色にすると読み分けられなくなる。 */
.ocr-ask-plan {
  margin: 4px 0 6px;
  padding: 6px 9px;
  border-radius: 8px;
  font-size: 12px;
  line-height: 1.7;
  color: var(--text);
  background: color-mix(in srgb, var(--ok) 8%, transparent);
  border-left: 3px solid var(--ok);
}

/* 文字データの構造が壊れている可能性（#686）。
   **たたまない。** #673 のプレビューは人が開かないと気づけず、それが唯一の
   歯止めになっていた。こちらは機械が測った数字なので、開かずに見える位置に出す。 */
.ocr-ask-degraded {
  margin: 4px 0 6px;
  padding: 6px 9px;
  border-radius: 8px;
  font-size: 12px;
  line-height: 1.7;
  color: var(--text);
  background: color-mix(in srgb, var(--warn) 8%, transparent);
  border-left: 3px solid var(--warn);
}

.ocr-ask-skip {
  margin: 0 0 14px;
  font-size: 12px;
  color: var(--text-secondary);
}
.ocr-ask-skip summary { cursor: pointer; }

/* 今すでに取れている文字。**これが最大の判断材料**なので出す。
   たたんであるのは、複数ファイルを入れたときに一覧が埋もれないため。 */
.ocr-ask-preview {
  margin: 2px 0 6px;
  font-size: 12px;
  color: var(--text-secondary);
}
.ocr-ask-preview summary { cursor: pointer; }
.ocr-ask-preview-text {
  margin: 6px 0 0;
  padding: 8px 10px;
  max-height: 220px;
  overflow: auto;
  border-radius: 8px;
  background: var(--input-bg);
  border: 1px solid var(--stroke);
  font-size: 12px;
  line-height: 1.7;
  color: var(--text);
  white-space: pre-wrap;
  word-break: break-word;
}

/* プレビューを開くと縦に伸びるので、**本文側で丸ごとスクロール**させる。
   付けないとボタンが画面外に出て「読み込む/読み込まない」を押せなくなる。 */
.ocr-ask-modal .src-modal-body { max-height: 70vh; overflow: auto; }

.ocr-ask-note {
  margin: 0;
  padding-top: 10px;
  border-top: 1px solid var(--stroke);
  font-size: 12px;
  line-height: 1.8;
  color: var(--text-secondary);
}