/* The admin Users screen (Admin::UsersController). Tokens only; the table,
   pills and form come from dashboard.css, pill.css and form.css. */

/* Fixed layout like the other tables, so the address -- the column anyone
   scans -- keeps its room and long lists of applications wrap in theirs. */
.dashboard__table--users { min-width: 880px; }

.dashboard__table--users .col-user      { width: 28%; }
.dashboard__table--users .col-role      { width: 10%; }
.dashboard__table--users .col-apps      { width: 28%; }
.dashboard__table--users .col-status    { width: 13%; }
.dashboard__table--users .col-signed-in { width: 15%; }
.dashboard__table--users .col-edit      { width: 6%; }

.dashboard__table--users .users__email {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dashboard__table--users .users__apps {
  white-space: normal;
  color: var(--text-secondary);
}

/* The read-only address on Edit user, where Add user has an input. */
.users__identity {
  font-size: var(--text-body-sm);
  font-weight: 600;
  color: var(--text-primary);
}

/* Invitation and activation sit under the form as a second card, with the
   same width cap and the gap Glacier puts between sections. */
.users__account {
  margin-top: var(--space-8);
}

.users__account .form__actions {
  margin-top: var(--space-3);
}

/* Invitation, then activation: two separate decisions, a rule between them. */
.users__action-group + .users__action-group {
  margin-top: var(--space-5);
  padding-top: var(--space-5);
  border-top: 1px solid var(--border-primary);
}

/* button_to wraps each button in its own form; keep them in one row. */
.users__account .form__actions form {
  display: inline-flex;
}