/* The ledger table, its scroll wrapper, status chips and the folio column.
 *
 * ★ D1 — .tablewrap{position:relative}.
 *
 * Measured cause (design/DESIGN_DECISION.md §2 D1): the star fills are
 * position:absolute. With no positioned ancestor their containing block
 * resolved past the scroll container to the initial containing block, so their
 * right edges landed at up to 969px and dragged the document with them —
 * /institutions overflowed by +594px at 390px wide. One declaration drops every
 * pane to the same residual. It is NOT the table escaping the wrapper, and it
 * must not be papered over with min-width or a media query.
 *
 * D0: the wrapper has no max-width. A roster uses the full available column.
 */
.tablewrap{
  position:relative;      /* ★ D1 — load-bearing. Do not remove. */
  overflow-x:auto;
  border:var(--bw-1) solid var(--rule);
  background:var(--paper-2);
}

.ledger{font-size:var(--fs-2)}
.ledger thead th{
  background:var(--paper-3);
  text-align:left;vertical-align:bottom;
  font-size:var(--fs-00);letter-spacing:var(--track-caps);text-transform:uppercase;font-weight:var(--fw-bold);
  color:var(--ink-2);
  padding:var(--sp-3) var(--sp-4);
  border-bottom:var(--bw-2) solid var(--rule-ink);
  white-space:nowrap;
}
.ledger tbody td{padding:var(--sp-3) var(--sp-4);border-bottom:var(--bw-1) solid var(--rule);vertical-align:top}
.ledger tbody tr:hover{background:var(--paper-hi)}
.ledger tbody tr:last-child td{border-bottom:0}
.ledger .folio{
  width:var(--w-folio);
  font-family:var(--font-mono);font-size:var(--fs-0);color:var(--ink-3);
  text-align:right;padding-right:var(--sp-3);
}
.ledger td.n,.ledger th.n{
  text-align:right;
  font-family:var(--font-num);font-variant-numeric:tabular-nums lining-nums;font-size:var(--fs-3);
}
.ledger .primary{font-weight:var(--fw-med);color:var(--ink)}
.ledger .sub{display:block;color:var(--ink-3);font-size:var(--fs-1);line-height:var(--lh-snug)}
.ledger tr.is-self,.ledger tr.is-self:hover{background:var(--accent-tint)}
.ledger tr.inactive td{color:var(--ink-3)}

.rowlink{border:0;color:inherit;font-weight:var(--fw-med)}
.rowlink:hover{color:var(--accent);border-bottom:var(--bw-1) solid var(--accent)}

.you-pill{
  display:inline-block;margin-left:var(--sp-2);padding:var(--sp-0) var(--sp-2);
  font-size:var(--fs-00);letter-spacing:var(--track-caps);text-transform:uppercase;font-weight:var(--fw-bold);
  color:var(--accent);border:var(--bw-1) solid var(--accent-rule);background:var(--paper-2);
}

/* Expandable row: the instructor's inline rating form (§3.6b) and the inline
   edit rows on the directory and the training-type catalog. */
.expand-row > td{background:var(--paper-3);padding:var(--sp-0)}
.expand-in{padding:var(--sp-5);border-left:var(--bw-3) solid var(--accent)}

/* D8 — a duplicate name is reported inline in the row it was typed into,
   never in an expanded panel below the table (UX_SPEC.md §3 page 7). */
.rowerr{
  display:flex;gap:var(--sp-2);align-items:center;
  font-size:var(--fs-1);color:var(--color-danger);font-weight:var(--fw-med);
  margin-top:var(--sp-2);
}
.rowerr svg{width:var(--sz-icon);height:var(--sz-icon);flex:0 0 auto}
.ledger tr.has-error td{background:var(--color-danger-tint)}

/* ——— Status chips ———————————————————————————————————————— */
.chip{
  display:inline-flex;align-items:center;gap:var(--sp-2);
  padding:var(--sp-0) var(--sp-3);
  font-size:var(--fs-00);letter-spacing:var(--track-caps);text-transform:uppercase;font-weight:var(--fw-bold);
  border:var(--bw-1) solid;border-radius:var(--r-pill);white-space:nowrap;
}
.chip-planned,.chip-enrolled{background:var(--chip-sched-bg);color:var(--chip-sched-ink);border-color:var(--chip-sched-rule)}
.chip-ongoing{background:var(--chip-ongo-bg);color:var(--chip-ongo-ink);border-color:var(--chip-ongo-rule)}
.chip-completed{background:var(--chip-done-bg);color:var(--chip-done-ink);border-color:var(--chip-done-rule)}
.chip-cancelled,.chip-withdrawn,.chip-inactive{background:var(--chip-off-bg);color:var(--chip-off-ink);border-color:var(--chip-off-rule)}
.chip-video{background:var(--paper-3);color:var(--ink-2);border-color:var(--rule-strong);border-radius:var(--r-1)}
.chip-video svg{width:var(--sz-star-s);height:var(--sz-star-s)}

/* ——— The roster status cell, when the viewer may change it ———————————
   UI-5. The chip stays a chip — it is the RECORD — and the verb sits beside
   it rather than replacing it, so the current state is still readable at a
   glance while the action is being offered. Wraps rather than widening the
   column: on a depot PC at 1280px the roster already carries seven columns. */
.statuscell{display:flex;gap:var(--sp-2);align-items:center;flex-wrap:wrap}