/* WORK-548 evidence explorer, reversal graph, and drilldown affordances.
   All styling lives here — `style=` attributes are CSP-banned in static/js
   (style-src-attr 'none'; see static_assets_csp.rs). */

.ev-section-title {
  margin: 0 0 12px;
  font-size: var(--wa-font-size-l);
}

.ev-mt-24 {
  margin-top: 24px;
}

.ev-muted {
  color: var(--wa-color-neutral-60);
}

.ev-grid {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 6px 16px;
}

.ev-grid dt {
  font-weight: var(--wa-font-weight-semibold);
}

.ev-grid dd {
  margin: 0;
  word-break: break-all;
}

.ev-id {
  font-family: var(--wa-font-family-code);
  font-size: var(--wa-font-size-s);
  word-break: break-all;
}

/* Money must render as the exact server Decimal string. Tabular figures keep
   columns aligned without reformatting the value. */
.ev-amount {
  font-variant-numeric: tabular-nums;
  text-align: right;
  white-space: nowrap;
}

.ev-scroll {
  overflow-x: auto;
}

/* --- Current observation ------------------------------------------------
   The backend separates as-of facts from mutable current state. Rendering
   them alike would undo that, so this region is visually distinct and always
   carries its own label. */
.ev-current-observation {
  border-left: 4px solid var(--wa-color-warning-50);
  background: var(--wa-color-warning-95);
  padding: 12px 16px;
  border-radius: var(--wa-border-radius-m);
}

.ev-current-observation .ev-observation-note {
  margin: 0 0 12px;
  font-style: italic;
}

/* --- Lineage graph ------------------------------------------------------ */
.ev-graph-wrap {
  overflow-x: auto;
  padding: 8px 0;
}

.ev-graph {
  display: block;
  min-width: 320px;
}

.ev-graph-node rect {
  fill: var(--wa-color-neutral-95);
  stroke: var(--wa-color-neutral-50);
  stroke-width: 1.5;
  rx: 6;
}

.ev-graph-node.ev-graph-root rect {
  fill: var(--wa-color-brand-95);
  stroke: var(--wa-color-brand-50);
  stroke-width: 2.5;
}

.ev-graph-node text {
  font-size: 11px;
  fill: var(--wa-color-neutral-10);
}

.ev-graph-node .ev-graph-node-id {
  font-family: var(--wa-font-family-code);
  font-size: 9px;
  fill: var(--wa-color-neutral-50);
}

.ev-graph-edge {
  stroke: var(--wa-color-neutral-50);
  stroke-width: 1.5;
  fill: none;
}

.ev-graph-edge-label {
  font-size: 9px;
  fill: var(--wa-color-neutral-60);
}

/* The SVG is decorative-with-content: sighted users get the layout, everyone
   else gets the same edges as a table. Never hide the table with
   `display:none` — that removes it from the accessibility tree too. */
.ev-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* --- Unknown registry kinds --------------------------------------------
   A build that meets a kind it does not know must say so rather than drop
   the row. */
.ev-unknown-kind {
  color: var(--wa-color-danger-40);
  font-weight: var(--wa-font-weight-semibold);
}

/* --- Timeline ----------------------------------------------------------- */
.ev-timeline-table {
  width: 100%;
  border-collapse: collapse;
}

.ev-timeline-table th,
.ev-timeline-table td {
  text-align: left;
  padding: 6px 10px;
  border-bottom: 1px solid var(--wa-color-neutral-90);
  vertical-align: top;
}

.ev-timeline-occurred {
  color: var(--wa-color-neutral-60);
  white-space: nowrap;
}

/* --- Integrity proof ---------------------------------------------------- */
.ev-proof-streams {
  width: 100%;
  border-collapse: collapse;
  margin-top: 12px;
}

.ev-proof-streams th,
.ev-proof-streams td {
  text-align: left;
  padding: 6px 10px;
  border-bottom: 1px solid var(--wa-color-neutral-90);
}

.ev-proof-hash {
  font-family: var(--wa-font-family-code);
  font-size: var(--wa-font-size-xs);
  word-break: break-all;
}

.ev-proof-scope {
  margin-top: 12px;
}

/* The auditor is meant to copy this out of the page, so keep it selectable and
   fully visible rather than truncated. */
.ev-proof-pem {
  font-family: var(--wa-font-family-code);
  font-size: var(--wa-font-size-xs);
  white-space: pre-wrap;
  word-break: break-all;
  margin: 0;
  padding: 8px;
  background: var(--wa-color-neutral-95);
  border-radius: var(--wa-border-radius-s);
  overflow-x: auto;
}

.ev-stale-notice {
  margin-top: 8px;
}

.ev-verify-steps {
  margin: 8px 0 0;
  padding-left: 20px;
  line-height: 1.6;
}

.ev-verify-steps code {
  font-family: var(--wa-font-family-code);
  font-size: var(--wa-font-size-xs);
  word-break: break-all;
}
