/* Supervisor check-in surface (MEA-11): the roster rows sit on white
   .dashboard-panel cards over the dark navy hero. The card never sets
   color, so its body text inherits --t-bg-text (white) and disappears.
   Rebinding the dark ink is what supervisor-booking.css does for bookings;
   the list layout below also makes the roster read as labeled rows. */

@layer design {
  /* Card body text = the dark ink, not the inherited hero white. Without
     this the checked-in participant name/task/location are in the DOM but
     invisible (white-on-white), so the supervisor cannot see whom to close. */
  .supervisor-checkins .dashboard-panel { color: var(--t-text); }

  /* Roster rows: one row per checked-in / ready-to-credit session, the
     participant label left and the action button right, instead of the
     default bulleted list the bare classes would otherwise produce. */
  .supervisor-checkins .dashboard-panel__list {
    list-style: none;
    display: grid;
    gap: var(--mea-space-3);
    margin: var(--mea-space-4) 0;
    padding: 0;
  }
  .supervisor-checkins .dashboard-panel__list-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--mea-space-3);
    padding: var(--mea-space-3);
    border: 1px solid var(--t-card-border);
    border-radius: var(--mea-radius-md);
  }
  /* Keep the action button compact rather than full-width — the row form's
     grid would otherwise stretch it across the whole list item. */
  .supervisor-checkins .dashboard-panel__list-item .form {
    display: inline-flex;
    width: auto;
  }
}