/* gce-diff.css — THE ONE DIFF-RENDERING STANDARD (operator 2026-08-20: "audit
 * everywhere we display diffs to make sure everything is rendered the same way").
 *
 * Every light surface that shows a document/text diff — the in-document compare
 * overlay, the compare seat, the full-proof page, track-changes, the inline
 * editor redline, change-marks, vault + ide version compare — reads these
 * variables so removed/added/changed/moved look identical everywhere. Import
 * this FIRST (after sovren-standard.css) on any page that renders a diff.
 *
 * Decisions (operator 2026-08-20): moved = BLUE everywhere (distinct from
 * red/green/yellow); diff marks inherit the DOCUMENT's own font (not a forced
 * serif); the git-style full-proof page keeps its +/- line markers but on this
 * same palette; the chat-bar + markdown CODE diffs stay deliberately dark.
 *
 * DELETED  = red, struck.  ADDED = green.  CHANGED = yellow wash.  MOVED = blue.
 * Absent-side reference (ghost) = same colors, a dashed left border + a label.
 */
:root {
  /* block / sentence level */
  --diff-removed-bg:   #fee2e2;
  --diff-removed-text: #991b1b;
  --diff-removed-line: #f87171;   /* strike + border accent */
  --diff-added-bg:     #dcfce7;
  --diff-added-text:   #166534;
  --diff-added-line:   #4ade80;
  --diff-changed-bg:   rgba(250,204,21,.35);
  --diff-changed-line: #eab308;
  --diff-moved-bg:     rgba(147,197,253,.5);
  --diff-moved-text:   #1e3a8a;
  --diff-moved-line:   #2563eb;
  /* word level (inside a partially-changed sentence) — a touch stronger */
  --diff-word-removed-bg: #fecaca;
  --diff-word-added-bg:   #bbf7d0;
  --diff-word-moved-bg:   rgba(147,197,253,.5);
  /* git-style full-proof page (line diff) — same hues, its own tints */
  --diff-line-del-bg:  #ffebe9;
  --diff-line-add-bg:  #e6ffec;
  --diff-line-del-gut: #ffd7d5;
  --diff-line-add-gut: #ccffd8;
}

/* Canonical utility classes any surface may use directly. Marks inherit the
 * document's font by design (the diff lives in the real document). */
.gdiff-removed { background: var(--diff-removed-bg); color: var(--diff-removed-text);
  text-decoration: line-through; text-decoration-color: var(--diff-removed-line); border-radius: 3px; }
.gdiff-added   { background: var(--diff-added-bg); color: var(--diff-added-text); border-radius: 3px; }
.gdiff-changed { background: var(--diff-changed-bg); border-radius: 3px; }
.gdiff-moved   { background: var(--diff-moved-bg); color: var(--diff-moved-text);
  border-bottom: 2px solid var(--diff-moved-line); border-radius: 3px; }
.gdiff-word-removed { background: var(--diff-word-removed-bg);
  text-decoration: line-through; text-decoration-color: var(--diff-removed-line); border-radius: 2px; }
.gdiff-word-added   { background: var(--diff-word-added-bg); border-radius: 2px; }
.gdiff-word-moved   { background: var(--diff-word-moved-bg); border-bottom: 2px solid var(--diff-moved-line); border-radius: 2px; }

/* ── ⇄ Diff tab (gce-diff-tab.js) — the diff-history view on the conversation drawer ── */
.gce-difftab-strip { display: flex; gap: 4px; padding: 6px 8px 0; }
.gce-difftab-btn {
  flex: 1; padding: 5px 10px; border: 1px solid #d1d5db; border-bottom: none;
  border-radius: 8px 8px 0 0; background: #f3f4f6; color: #6b7280;
  font: 600 12px system-ui; cursor: pointer; white-space: nowrap; }
.gce-difftab-btn.is-active { background: #fff; color: #111827; border-color: #93c5fd; }
.gce-diff-panel { padding: 0; }
.gce-diff-hist-list { display: flex; flex-direction: column; }
.gce-diff-hist-row {
  display: flex; flex-direction: column; gap: 2px; padding: 9px 12px;
  border-bottom: 1px solid #f0f0f0; text-decoration: none; color: #111827; cursor: pointer; }
.gce-diff-hist-row:hover { background: #eff6ff; }
.gce-diff-hist-pair { font: 600 12px system-ui; }
.gce-diff-hist-meta { font: 11px system-ui; color: #6b7280; }

/* ── diffdoc frame renderer (registered on window.gceFrameRenderers for the `diffdoc` type) ── */
.gce-diffdoc-head { font: 700 15px system-ui; color: #111827; margin-bottom: 8px; }
.gce-diffdoc-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.gce-diffdoc-chip {
  padding: 2px 9px; border-radius: 999px; font: 600 12px system-ui;
  background: #f3f4f6; color: #374151; }
.gce-diffdoc-rows { display: flex; flex-direction: column; gap: 3px; }
.gce-diffdoc-row {
  display: grid; grid-template-columns: 34px 1fr 1fr; gap: 8px; align-items: start;
  padding: 5px 8px; border-radius: 4px; font: 13px/1.45 system-ui; }
.gce-diffdoc-n { color: #9ca3af; font: 600 11px system-ui; }

/* ── Compare entry points (gce-compare-picker.js) ── */
/* the always-visible top button — prominent accent so it's the obvious way to compare */
#gce-compare-docs-btn {
  margin-left: 8px; vertical-align: middle; cursor: pointer; white-space: nowrap;
  font: 600 11px system-ui; color: #fff; background: #2563eb; border: 1px solid #2563eb;
  border-radius: 10px; padding: 3px 11px; }
#gce-compare-docs-btn:hover { background: #1d4ed8; border-color: #1d4ed8; }
/* the per-frame button — styled like the paired ⇄ Compare so the title row reads as one family */
.gce-cmp-anydoc {
  cursor: pointer; font: 600 11px system-ui; color: #334155; background: #fff;
  border: 1px solid #cbd5e1; border-radius: 6px; padding: 1px 8px; margin-left: 8px;
  white-space: nowrap; vertical-align: middle; }
.gce-cmp-anydoc:hover { background: #eef2ff; color: #4338ca; border-color: #c7d2fe; }
@media print { #gce-compare-docs-btn, .gce-cmp-anydoc { display: none !important; } }

/* the picker modal */
#gce-cmp-picker .cmp-pick-veil { position: fixed; inset: 0; background: rgba(15,23,42,.35); z-index: 100010; }
#gce-cmp-picker .cmp-pick-card {
  position: fixed; z-index: 100011; top: 50%; left: 50%; transform: translate(-50%,-50%);
  width: min(440px, 92vw); background: #fff; border: 1px solid #d1d5db; border-radius: 12px;
  box-shadow: 0 12px 40px rgba(15,23,42,.25); padding: 18px 20px; }
#gce-cmp-picker .cmp-pick-title { font: 700 16px system-ui; color: #111827; }
#gce-cmp-picker .cmp-pick-sub { font: 12px/1.4 system-ui; color: #6b7280; margin: 4px 0 14px; }
#gce-cmp-picker .cmp-pick-row { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; min-width: 0; }
#gce-cmp-picker .cmp-pick-row > span { flex: 0 0 56px; width: 56px; font: 600 12px system-ui; color: #374151; }
#gce-cmp-picker .cmp-pick-row select {
  flex: 1 1 0; min-width: 0; max-width: 100%; padding: 6px 8px; border: 1px solid #d1d5db;
  border-radius: 8px; font: 13px system-ui; background: #fff; color: #111827;
  text-overflow: ellipsis; }   /* min-width:0 lets the select shrink below its longest option so a
                                  long title/path can't blow the card out (overflow bug 2026-08-24) */
#gce-cmp-picker .cmp-pick-actions { display: flex; gap: 8px; margin-top: 6px; }
#gce-cmp-picker .cmp-pick-go {
  flex: 1; padding: 8px; border: 1px solid #2563eb; background: #2563eb; color: #fff;
  border-radius: 8px; font: 600 13px system-ui; cursor: pointer; }
#gce-cmp-picker .cmp-pick-go:hover { background: #1d4ed8; }
#gce-cmp-picker .cmp-pick-cancel {
  padding: 8px 14px; border: 1px solid #d1d5db; background: #fff; color: #374151;
  border-radius: 8px; font: 600 13px system-ui; cursor: pointer; }
#gce-cmp-picker .cmp-pick-empty { font: 13px system-ui; color: #6b7280; margin: 8px 0 4px; }
#gce-cmp-picker .cmp-pick-publish {
  padding: 8px 12px; border: 1px solid #93c5fd; background: #eff6ff; color: #1d4ed8;
  border-radius: 8px; font: 600 13px system-ui; cursor: pointer; white-space: nowrap; }
#gce-cmp-picker .cmp-pick-publish:hover { background: #dbeafe; }

/* live diff document (published to the tray, doc_type='diffdoc') */
.gce-diffdoc-liveflag {
  font: 600 10px system-ui; color: #047857; background: #d1fae5; border-radius: 999px;
  padding: 1px 7px; margin-left: 6px; vertical-align: middle; }
.gce-diffdoc-identical { font: 13px system-ui; color: #047857; margin: 6px 0; }
.gce-diffdoc-loading { font: 13px system-ui; color: #6b7280; }
/* 3-way diff rows — four columns (№ + three docs) */
.gce-diffdoc-row.gce-diffdoc-tri { grid-template-columns: 34px 1fr 1fr 1fr; }
.gce-diffdoc-trihead { font: 700 11px system-ui; color: #6b7280; background: #f9fafb; }
.gce-diffdoc-trihead span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }