/* =====================================================================
   lia.css — Legislative Impact Assessment two-track scorecard component
   Spec: docs/legislative-impact-rendering-spec.md  (checkpoint D1)
   Charter: docs/legislative-impact-methodology.md

   NON-NEGOTIABLE: no composite score anywhere; color = track identity,
   never a good/bad valence; every knob visible; access != right.
   Scoped under .pu-lia and under the EKB v2 article body.
   ===================================================================== */

.pu-lia {
  --lia-q: var(--pu-navy, #1c2b4a);
  --lia-r: var(--pu-gold, #b8860b);
  --lia-flag: var(--pu-gold, #b8860b);
  --lia-line: var(--pu-gray-200, #e2e2e2);
  --lia-chip-bg: var(--pu-gray-100, #f1f1f1);
  --lia-chip-fg: var(--pu-gray-600, #555);
  --lia-ink: var(--pu-ink, #1a1a1a);
  --lia-muted: var(--pu-gray-600, #555);
  font-family: var(--pu-font-body, system-ui, sans-serif);
  color: var(--lia-ink);
  border: 1px solid var(--lia-line);
  border-radius: var(--pu-radius-lg, 12px);
  background: var(--pu-parchment, #fbfaf6);
  padding: clamp(1rem, 3vw, 1.75rem);
  margin: 2rem 0;
  max-width: 100%;
}

/* ---- header ---- */
.pu-lia__title { margin: 0 0 .25rem; font-size: 1.35rem; letter-spacing: .01em; }
.pu-lia__meta { display: flex; flex-wrap: wrap; gap: .25rem 1rem; margin: 0 0 .75rem;
  font-size: .82rem; color: var(--lia-muted); }
.pu-lia__meta b { color: var(--lia-ink); font-weight: 600; }
.pu-lia__nocombine {
  margin: 0 0 1.25rem; padding: .6rem .8rem; font-size: .9rem; font-weight: 600;
  border-left: 3px solid var(--lia-flag);
  background: color-mix(in srgb, var(--lia-flag) 8%, transparent);
  border-radius: 0 var(--pu-radius, 8px) var(--pu-radius, 8px) 0;
}

/* ---- the two co-equal tracks ---- */
.pu-lia__tracks {
  display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem;
  position: relative;
}
.pu-lia-track { min-width: 0; padding: 0 0 0 .9rem; border-left: 4px solid var(--lia-line); }
.pu-lia-track--q { border-left-color: var(--lia-q); }
.pu-lia-track--r { border-left-color: var(--lia-r); }
.pu-lia-track__label {
  margin: 0 0 .75rem; font-size: .78rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .08em;
}
.pu-lia-track--q .pu-lia-track__label { color: var(--lia-q); }
.pu-lia-track--r .pu-lia-track__label { color: var(--lia-r); }

.pu-lia-layer { margin: 0 0 1rem; }
.pu-lia-layer__name { margin: 0 0 .2rem; font-size: .95rem; font-weight: 700; }
.pu-lia-layer__finding, .pu-lia-finding, .pu-lia-doctrine { margin: .1rem 0; font-size: .9rem; line-height: 1.5; }
.pu-lia-doctrine { color: var(--lia-muted); font-size: .82rem; }
.pu-lia-attrib { margin: .2rem 0; font-size: .8rem; color: var(--lia-muted); }
.pu-lia-src { font-weight: 600; color: var(--lia-ink); }
.pu-lia-src::after {
  content: " " attr(data-orientation); font-variant: small-caps; font-weight: 400;
  font-size: .82em; color: var(--lia-muted); letter-spacing: .02em;
}

/* ---- knob chips ---- */
.pu-lia-knobs { list-style: none; display: flex; flex-wrap: wrap; gap: .3rem; margin: .4rem 0 0; padding: 0; }
.pu-lia-knob {
  font-family: var(--pu-font-mono, ui-monospace, monospace);
  font-size: .68rem; line-height: 1.4; padding: .12rem .45rem;
  background: var(--lia-chip-bg); color: var(--lia-chip-fg);
  border-radius: var(--pu-radius-pill, 999px); border: 1px solid transparent;
}
/* not_disclosed / ignored chilling = credibility FLAG, never hidden */
.pu-lia-knob--flag {
  background: color-mix(in srgb, var(--lia-flag) 12%, transparent);
  color: color-mix(in srgb, var(--lia-flag) 60%, var(--lia-ink));
  border-color: var(--lia-flag); font-weight: 600;
}

/* ---- R-track: direction (NEVER red/green), exposure, badge, chilling, severity ---- */
.pu-lia-dir { font-weight: 700; color: var(--lia-ink); }         /* glyph carries meaning */
.pu-lia-badge {
  display: inline-block; font-size: .64rem; font-weight: 700; letter-spacing: .06em;
  text-transform: uppercase; padding: .1rem .4rem; border-radius: var(--pu-radius, 6px);
  border: 1px solid var(--lia-muted); color: var(--lia-muted); margin-left: .35rem;
}
.pu-lia-badge--access { border-style: dashed; }                  /* access != constitutional right */
.pu-lia-exposure { margin: .15rem 0; font-size: .82rem; }
.pu-lia-exposure[data-exposure="contested"] { font-weight: 600; }
.pu-lia-exposure[data-exposure="likely-unconstitutional"] { font-weight: 600; text-decoration: underline; }
.pu-lia-cohorts { margin: .3rem 0 0; padding-left: 1.1rem; font-size: .82rem; line-height: 1.5; }
.pu-lia-chill { margin: .4rem 0 0; font-size: .82rem; }
.pu-lia-chill--acknowledged { font-style: italic; }
.pu-lia-chill--ignored, .pu-lia-chill--flag {
  font-weight: 600; padding: .12rem .45rem; border-radius: var(--pu-radius-pill, 999px);
  border: 1px solid var(--lia-flag); color: color-mix(in srgb, var(--lia-flag) 60%, var(--lia-ink));
  background: color-mix(in srgb, var(--lia-flag) 12%, transparent);
}
.pu-lia-chill--ignored::after, .pu-lia-chill--flag::after { content: " \2691"; } /* ⚑ */

/* severity: ordinal 5-segment bar in ONE neutral hue (no valence) */
.pu-lia-sev { margin: .3rem 0 0; font-size: .82rem; display: flex; align-items: center; gap: .5rem; }
.pu-lia-sevbar { display: inline-grid; grid-template-columns: repeat(5, 1fr); gap: 2px; width: 90px; }
.pu-lia-sevbar i { height: 8px; background: var(--lia-chip-bg); border-radius: 2px; }
.pu-lia-sevbar i[data-on] { background: var(--lia-muted); }

/* ---- divergence (collapsible) ---- */
.pu-lia-diverge { margin-top: 1.25rem; border-top: 1px solid var(--lia-line); padding-top: 1rem; }
.pu-lia-diverge > h3 { margin: 0 0 .6rem; font-size: 1rem; }
.pu-lia-diverge__item { border: 1px solid var(--lia-line); border-radius: var(--pu-radius, 8px);
  margin: 0 0 .6rem; padding: .5rem .7rem; background: #fff; }
.pu-lia-diverge__item > summary { cursor: pointer; font-size: .9rem; font-weight: 600; }
.pu-lia-diverge__item > summary b { color: var(--lia-flag); }
.pu-lia-diverge__pair { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; margin: .6rem 0; }
.pu-lia-est { font-size: .82rem; padding: .5rem .6rem; border-radius: var(--pu-radius, 6px);
  background: var(--lia-chip-bg); overflow-x: auto; }
.pu-lia-est[data-orientation="left-of-center"]  { border-left: 3px solid var(--lia-q); }
.pu-lia-est[data-orientation="right-of-center"]  { border-left: 3px solid var(--lia-r); }
.pu-lia-est[data-orientation="official"]         { border-left: 3px solid var(--lia-muted); }
.pu-lia-diverge__lit { margin: .3rem 0 0; font-size: .8rem; color: var(--lia-muted); line-height: 1.5; }

/* ---- disclosure ---- */
.pu-lia__disclosure { margin-top: 1.25rem; padding-top: .8rem; border-top: 1px solid var(--lia-line);
  font-size: .78rem; color: var(--lia-muted); line-height: 1.5; }

/* ---- responsive: stack, never merge ---- */
@media (max-width: 720px) {
  .pu-lia__tracks { grid-template-columns: 1fr; }
  .pu-lia-diverge__pair { grid-template-columns: 1fr; }
}

/* ---- dark theme (token-driven; flag stays legible) ---- */
@media (prefers-color-scheme: dark) {
  .pu-lia { background: color-mix(in srgb, var(--pu-navy-dark, #0f1830) 92%, #000); color: #f2f0e9; }
  .pu-lia-diverge__item { background: color-mix(in srgb, var(--pu-navy-dark, #0f1830) 80%, #000); }
  .pu-lia-est { background: color-mix(in srgb, #fff 8%, transparent); }
}
:root[data-theme="dark"] .pu-lia { background: color-mix(in srgb, var(--pu-navy-dark, #0f1830) 92%, #000); color: #f2f0e9; }
:root[data-theme="light"] .pu-lia { background: var(--pu-parchment, #fbfaf6); color: var(--pu-ink, #1a1a1a); }

/* ---- EKB v2 article-body scoping (per theme CLAUDE.md: target v2 selectors) ---- */
#eckb-article-page-container-v2 #eckb-article-content-body .pu-lia { margin: 2rem 0; }
