/* t_staff_html, root .tst-wrap. The root rule stays bare, every other
   selector is scoped :where(.tst-wrap), which adds zero specificity. No
   element that takes the hidden class at the end has another display rule,
   so it needs no compound. */

/* Greenwood × PX T-STAFF — thin wrapper.
   Mounts the embedded T-LEARNER for admin-view-other-staff
   (per training_ux.md §F-T07c). All learner chrome (banner,
   header card, stat strip, leaderboard CTAs, Required /
   Optional / Trend / History / Recent activity) is rendered
   by the embedded learner_home_html below. The "+ Assign
   optional test" CTA lives inside the embedded T-LEARNER's
   Optional accordion (per §F-T08b).

   Scoped under .tst-wrap; Greenwood chrome stays at the
   training root (no page ::before here). */

.tst-wrap {
  padding: var(--ch-space-lg);
  font-family: var(--gw-font);
  color: var(--gw-ink);
}

:where(.tst-wrap) .tst-page-header {
  display: flex; align-items: center; gap: var(--ch-space-md);
  margin-bottom: var(--ch-space-md); flex-wrap: wrap;
}
:where(.tst-wrap) .tst-back-btn {
  background: transparent; border: 1px solid var(--gw-bd);
  color: var(--gw-ink-2); border-radius: var(--gw-r-sm);
  padding: 6px 14px; font-size: 13px; cursor: pointer;
  font-family: var(--gw-font); font-weight: 600;
}
:where(.tst-wrap) .tst-back-btn:hover {
  color: var(--gw-brand-d); border-color: var(--gw-bd-2);
  background: var(--gw-paper-2);
}

:where(.tst-wrap) .tst-loading, :where(.tst-wrap) .tst-error {
  text-align: center; padding: 48px var(--ch-space-lg);
  color: var(--gw-mute); font-size: 14px;
  background: var(--gw-paper); border: 1px dashed var(--gw-bd);
  border-radius: var(--gw-r-lg);
}
:where(.tst-wrap) .tst-error { color: var(--gw-danger); border-color: var(--gw-danger); }
:where(.tst-wrap) .tst-spinner {
  width: 32px; height: 32px;
  border: 3px solid var(--gw-bd); border-top-color: var(--gw-brand);
  border-radius: 50%; animation: tst-spin 1s linear infinite;
  margin: 0 auto var(--ch-space-md);
}
@keyframes tst-spin { to { transform: rotate(360deg); } }
:where(.tst-wrap) .tst-hidden { display: none; }