/* ================================================================== PEOPLE
 * The roster of people, and the only place in the OS that can write it.
 *
 * Every rule is os-team__*. Nothing here redefines an .asgt-* class: the
 * design-system panel, table, badge, dialog and field components are used
 * exactly as they are and only POSITIONED from here. Colours, sizes, radii
 * and spacing are --asgt-* tokens, never literals.
 *
 * Its own file rather than a block in tokens-v2.css, which is being deleted
 * screen by screen; a new screen must not tie its life to that sheet.
 *
 * Logical properties throughout, so dir="rtl" is the whole Arabic change.
 */

.os-team {
  block-size: 100%;
  overflow-y: auto;
  padding-block: var(--asgt-s-6);
  padding-inline: var(--asgt-s-6);
  background: var(--asgt-canvas);
  color: var(--asgt-text);
  font-family: var(--asgt-font-ui);
}

.os-team__inner {
  max-inline-size: var(--asgt-content-max);
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  gap: var(--asgt-s-5);
}

/* The page title block. Not .asgt-pagehead: that component carries its own
   top padding for a full page, and this screen is already inset by the
   workspace body. */
.os-team__head {
  display: flex;
  align-items: flex-start;
  gap: var(--asgt-s-4);
  flex-wrap: wrap;
}
.os-team__title {
  margin: 0;
  font-size: var(--asgt-t-xl);
  line-height: var(--asgt-lh-tight);
  font-weight: 800;
}
.os-team__sub {
  margin: var(--asgt-s-1) 0 0;
  font-size: var(--asgt-t-sm);
  color: var(--asgt-text-muted);
  max-inline-size: 68ch;
}
.os-team__head-end { margin-inline-start: auto; }

/* A note that is neither an error nor a success: it states a limit of the
   screen. --info, never the brand magenta, which is reserved for actions. */
.os-team__note {
  font-size: var(--asgt-t-sm);
  color: var(--asgt-info);
  background: var(--asgt-info-bg);
  border-radius: var(--asgt-r-sm);
  padding-block: var(--asgt-s-3);
  padding-inline: var(--asgt-s-4);
  margin: 0;
}

/* The login cell. An address is data, so it sinks: mono, muted, tabular. */
.os-team__login { font-family: var(--asgt-font-data); font-size: var(--asgt-t-2xs); }

/* Row actions sit at the trailing edge and do not reserve width when idle;
   .asgt-table__actions already handles the hover reveal. */
.os-team__row-end { text-align: end; white-space: nowrap; }

/* The toast slot, bottom-trailing, above the table. */
.os-team__toast {
  position: fixed;
  inset-block-end: var(--asgt-s-6);
  inset-inline-end: var(--asgt-s-6);
  z-index: 60;
}

@media (max-width: 720px) {
  .os-team { padding-inline: var(--asgt-s-4); }
  .os-team__head-end { margin-inline-start: 0; inline-size: 100%; }
}