/* ============================================================
   reference-audit.css — Reference Health Report deltas
   Layout primitives come from citation-checker.css; status
   colors for retraction notices from retraction-checker.css.
   ============================================================ */

/* ── Grade colors on result cards ────────────────────────── */
.cc-result[data-status="good"]     { border-left-color: var(--color-success); }
.cc-result[data-status="caution"]  { border-left-color: var(--color-gold); }
.cc-result[data-status="critical"] { border-left-color: var(--color-error); }
.cc-result[data-status="error"]    { border-left-color: var(--color-text-faint); }

.cc-result[data-status="good"] .cc-status-badge {
  background: color-mix(in oklab, var(--color-success) 12%, transparent);
  color: var(--color-success);
  border: 1px solid color-mix(in oklab, var(--color-success) 22%, transparent);
}
.cc-result[data-status="caution"] .cc-status-badge {
  background: color-mix(in oklab, var(--color-gold) 14%, transparent);
  color: var(--color-gold);
  border: 1px solid color-mix(in oklab, var(--color-gold) 24%, transparent);
}
.cc-result[data-status="critical"] .cc-status-badge {
  background: color-mix(in oklab, var(--color-error) 12%, transparent);
  color: var(--color-error);
  border: 1px solid color-mix(in oklab, var(--color-error) 28%, transparent);
}
.cc-result[data-status="error"] .cc-status-badge {
  background: color-mix(in oklab, var(--color-text-faint) 12%, transparent);
  color: var(--color-text-muted);
  border: 1px solid color-mix(in oklab, var(--color-text-faint) 20%, transparent);
}

/* ── Dimension badges row ────────────────────────────────── */
.ra-dims {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}

.ra-dims .cc-source-tag.ra-dim-ok {
  background: color-mix(in oklab, var(--color-success) 10%, transparent);
  color: var(--color-success);
  border: 1px solid color-mix(in oklab, var(--color-success) 22%, transparent);
}

.ra-dims .cc-source-tag.ra-dim-warn {
  background: color-mix(in oklab, var(--color-gold) 14%, transparent);
  color: var(--color-gold);
  border: 1px solid color-mix(in oklab, var(--color-gold) 24%, transparent);
}

.ra-dims .cc-source-tag.ra-dim-bad {
  background: color-mix(in oklab, var(--color-error) 10%, transparent);
  color: var(--color-error);
  border: 1px solid color-mix(in oklab, var(--color-error) 26%, transparent);
}

.ra-dims .cc-source-tag.ra-dim-neutral {
  background: color-mix(in oklab, var(--color-text-faint) 12%, transparent);
  color: var(--color-text-muted);
  border: 1px solid color-mix(in oklab, var(--color-text-faint) 18%, transparent);
}