/* Moved from websites/templates/websites/_internal_links_styles.html (redesign checklist: local CSS out of the
   templates). Loaded only by the pages that include that partial. */

/* Internal linking report — its own prefix (.il-*), on top of the shared
   .gk-* section furniture it borrows from the URL structures report.
   Every width and height in these figures is computed in Python. */
/* The lead line of a section: its score, then what it says. The reading
   help is a post-it note beside it (.hn-pair), the caveat a caution note. */
.il-lead { margin: 0; font-size: 14px; color: var(--color-neutral-700); }
.il-lead b { display: block; font-family: var(--font-heading); font-weight: 800;
  font-size: 30px; line-height: 1.05; letter-spacing: -0.02em;
  color: var(--color-text); font-variant-numeric: tabular-nums; }
/* The condition badge (§4.19) beside a section's score and the standing. */
.il-lead b .badge, .gk-concl-side dd .badge { vertical-align: middle;
  margin-left: var(--space-2); letter-spacing: 0; }
.hn-pair + .il-figure, .hn-pair + .gk-plan-progress, .hn-pair + .gk-sec-stamp,
.hn-pair + .gk-checks, .hn-pair + .il-table-head { margin-top: var(--space-4); }

/* Form C — count histogram, columns optionally links to a drill-down. */
.il-hist { display: flex; align-items: flex-end; gap: 6px; height: 150px;
  margin: var(--space-2) 0 0; }
.il-hist-col { flex: 1 1 0; display: flex; flex-direction: column;
  align-items: center; justify-content: flex-end; height: 100%;
  text-decoration: none; color: inherit; min-width: 0; }
.il-hist-col b { font-size: 12px; margin-bottom: 3px; }
.il-hist-col i { display: block; width: 100%; background: var(--slate);
  border-radius: 3px 3px 0 0; min-height: 2px; print-color-adjust: exact; }
.il-hist-col.accent i { background: var(--coral); }
a.il-hist-col:hover i { filter: brightness(0.85); }
.il-hist-key { display: flex; gap: 6px; margin-top: 4px; }
.il-hist-key span { flex: 1 1 0; text-align: center; font-size: 12px;
  color: var(--color-muted, var(--slate)); min-width: 0; }
/* Form D — the overlaid pair: own filled, other outlined, same baseline. */
.il-hist-col .il-pair { display: flex; align-items: flex-end; gap: 2px;
  width: 100%; height: 100%; }
.il-hist-col .il-pair i { flex: 1 1 0; }
.il-hist-col .il-pair i.other { background: transparent;
  border: 1.5px solid var(--slate); border-bottom: 0; }
.il-hist-col .il-pair i.own { background: var(--blue-deep); }
.il-legend { display: flex; gap: var(--space-3); font-size: 12px;
  color: var(--color-muted, var(--slate)); margin-top: var(--space-1); }
.il-legend i { display: inline-block; width: 12px; height: 10px;
  margin-right: 4px; vertical-align: middle; border-radius: 2px; }
.il-legend i.own { background: var(--blue-deep); }
.il-legend i.other { border: 1.5px solid var(--slate); }

/* Form B — one bar cut into parts that sum to the whole. */
.il-stack { display: flex; height: 22px; border-radius: 4px; overflow: hidden;
  margin: var(--space-2) 0 var(--space-1); print-color-adjust: exact; }
.il-stack i { display: block; min-width: 2px; }
.il-stack i.linked, .il-stack i.contextual, .il-stack i.descriptive { background: var(--mint); }
.il-stack i.probable, .il-stack i.naked { background: var(--amber); }
.il-stack i.confirmed, .il-stack i.boilerplate, .il-stack i.generic { background: var(--coral); }
.il-stack i.unknown { background: #c9d0d8; }
.il-stack-key { display: flex; flex-wrap: wrap; gap: var(--space-3);
  font-size: 12px; color: var(--color-muted, var(--slate)); }
.il-stack-key i { display: inline-block; width: 10px; height: 10px;
  margin-right: 4px; border-radius: 2px; vertical-align: middle; }

/* Form A — ranked bars with a note beside each count. */
.il-rank { margin: var(--space-2) 0 0; }
.il-rank-row { display: grid; grid-template-columns: minmax(120px, 2fr) 3fr auto;
  gap: var(--space-2); align-items: center; font-size: 13px;
  padding: 3px 0; }
.il-rank-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.il-rank-bar { height: 12px; background: var(--color-neutral-100, var(--row-tint));
  border-radius: 3px; overflow: hidden; }
.il-rank-bar i { display: block; height: 100%; background: var(--blue-deep);
  print-color-adjust: exact; }
.il-rank-row.is-waste .il-rank-bar i { background: var(--coral); }
.il-rank-n { white-space: nowrap; font-variant-numeric: tabular-nums; }
.il-rank-note { color: var(--color-muted, var(--slate)); font-size: 12px; }
.il-rank-tail { font-size: 12px; color: var(--color-muted, var(--slate));
  margin: var(--space-1) 0 0; }

/* Section evidence blocks. */
.il-figure { margin: 0 0 var(--space-3); }
.il-figure-title { font-weight: 600; margin: 0 0 var(--space-1); }
.il-figure-note { font-size: 12px; color: var(--color-muted, var(--slate));
  margin: var(--space-1) 0 0; }
.il-table-head { display: flex; align-items: baseline; gap: var(--space-2);
  margin: var(--space-3) 0 var(--space-1); }
.il-table-head h3 { margin: 0; font-size: 15px; }
.il-table-head .btn { margin-left: auto; }
.il-tpl td.num, .il-tpl th.num { text-align: right; white-space: nowrap; }
.il-meter { display: inline-block; width: 60px; height: 6px; margin-left: 6px;
  background: var(--color-neutral-100, var(--row-tint)); border-radius: 3px;
  vertical-align: middle; overflow: hidden; }
.il-meter i { display: block; height: 100%; background: var(--blue-deep); }
.il-chip { display: inline-block; font-size: 11px; padding: 1px 6px;
  border-radius: 10px; background: var(--color-neutral-100, var(--row-tint));
  color: var(--color-neutral-800, #374151); margin-right: 4px; }
@media print {
  .il-hist-col i, .il-stack i, .il-rank-bar i { print-color-adjust: exact; }
  .il-figure { break-inside: avoid; }
}
