/* ================================================================
   ALBAR7AHPEDIA — Diff view CSS (Wikipedia-style)
   ================================================================ */

.diff-legend {
  font-size: 12px;
  color: var(--text-muted);
  margin-bottom: 12px;
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}
.diff-legend-add { background: var(--diff-add); padding: 2px 8px; border: 1px solid var(--border); font-size: 12px; }
.diff-legend-del { background: var(--diff-del); padding: 2px 8px; border: 1px solid var(--border); font-size: 12px; }

.diff-table {
  width: 100%;
  border-collapse: collapse;
  font-family: 'Courier New', Courier, monospace;
  font-size: 12.5px;
  line-height: 1.5;
  table-layout: fixed;
}

/* Column widths: lineno | content | lineno | content */
.diff-table colgroup col:nth-child(1),
.diff-table colgroup col:nth-child(3) { width: 38px; }
.diff-table colgroup col:nth-child(2),
.diff-table colgroup col:nth-child(4) { width: calc(50% - 38px); }

/* Marker column for add/del symbol */
.diff-table.unified colgroup col:nth-child(1) { width: 28px; }
.diff-table.unified colgroup col:nth-child(2) { width: 38px; }
.diff-table.unified colgroup col:nth-child(3) { width: 38px; }

.diff-header {
  font-family: -apple-system, Arial, sans-serif;
  font-weight: bold;
  font-size: 13px;
  padding: 6px 10px;
  background: #eaecf0;
  border: 1px solid var(--border);
  text-align: center;
}

.diff-lineno {
  text-align: right;
  padding: 1px 6px;
  color: var(--text-muted);
  background: var(--bg-page);
  border: 1px solid #d0d5da;
  vertical-align: top;
  user-select: none;
  font-size: 11px;
  min-width: 32px;
}

.diff-marker {
  text-align: center;
  vertical-align: top;
  border: 1px solid var(--border);
  padding: 1px 3px;
  font-weight: bold;
  width: 24px;
  font-size: 13px;
}

.diff-content {
  padding: 1px 8px;
  border: 1px solid var(--border);
  vertical-align: top;
  white-space: pre-wrap;
  word-break: break-word;
  overflow-wrap: anywhere;
}

/* Context (unchanged) line */
tr.diff-context td { background: var(--bg-content); }
tr.diff-context .diff-marker { color: #999; }

/* Deleted line */
tr.diff-del td.diff-content  { background: var(--diff-del); }
tr.diff-del td.diff-marker   { background: var(--diff-del-strong); color: #721c24; }
tr.diff-del td.diff-lineno   { background: #fde8e8; }
tr.diff-del td.diff-empty    { background: #eaecf0; }

/* Added line */
tr.diff-add td.diff-content  { background: var(--diff-add); }
tr.diff-add td.diff-marker   { background: var(--diff-add-strong); color: #155724; }
tr.diff-add td.diff-lineno   { background: #e6f4ea; }
tr.diff-add td.diff-empty    { background: #eaecf0; }

/* Empty placeholder cell */
.diff-empty { background: #eaecf0 !important; border: 1px solid #d0d5da !important; }

/* Skipped lines indicator */
tr.diff-skipped td {
  background: #eaecf0;
  text-align: center;
  font-style: italic;
  color: var(--text-muted);
  padding: 4px;
  font-size: 12px;
  font-family: -apple-system, Arial, sans-serif;
  border: 1px solid var(--border);
}

/* Word-level highlight within a changed line */
.diff-word-del { background: var(--diff-del-strong); text-decoration: line-through; padding: 0 1px; }
.diff-word-add { background: var(--diff-add-strong); padding: 0 1px; }

/* Diff meta info */
.diff-meta {
  font-size: 13px;
  color: var(--text-muted);
  margin-bottom: 16px;
  padding: 10px 14px;
  background: var(--bg-page);
  border: 1px solid var(--border);
}
.diff-meta table { border-collapse: collapse; width: 100%; }
.diff-meta td { padding: 3px 8px; }
.diff-meta td:first-child { font-weight: bold; width: 120px; }
