/* Team management: readable identities and comfortable local-demo controls. */
.workspace-users { min-width: 0; color: #34445e; }
.workspace-users .toolbar { align-items: center; gap: 16px; }
.workspace-users .toolbar > .muted { color: #52617a; font-size: 14px; line-height: 1.6; }
.workspace-users .search-field { min-width: 0; max-width: 390px; border-color: #c6cfdf; }
.workspace-users .search-field .icon { color: #61708a; width: 18px; height: 18px; flex-shrink: 0; }
.workspace-users .search-field input { min-height: 46px; font-size: 15px; color: #293a55; }
.workspace-users .search-field input::placeholder { color: #65728a; opacity: 1; }
.workspace-users .search-field:focus-within { border-color: #7545ff; box-shadow: 0 0 0 3px #7545ff14; }
.workspace-users .table-wrap { max-width: 100%; margin-top: 0; }
.workspace-users .table-wrap table { width: 100%; white-space: normal; }
.workspace-users .table-wrap th { color: #52617a; font-size: 11px; line-height: 1.6; }
.workspace-users .table-wrap td { color: #42516b; font-size: 14px; line-height: 1.6; }
.workspace-users .table-wrap td:first-child { width: 42%; min-width: 210px; }
.workspace-users .project-name,
.workspace-users .workspace-user-identity { display: flex; align-items: center; gap: 12px; min-width: 0; }
.workspace-users .project-name > :not(.user-avatar),
.workspace-users .workspace-user-identity > :not(.user-avatar) { min-width: 0; }
.workspace-users .user-avatar { width: 38px; height: 38px; flex: 0 0 38px; color: #674c8e; background: #efe8fa; font-size: 13px; }
.workspace-users .cell-title { color: #293a55; font-size: 15px; font-weight: 600; line-height: 1.55; white-space: normal; overflow-wrap: anywhere; }
.workspace-users .cell-subtitle { display: block; color: #5a6880; font-size: 13px; line-height: 1.6; white-space: normal; overflow-wrap: anywhere; margin-top: 3px; }
.workspace-users .badge { max-width: 100%; padding: 5px 9px; font-size: 12px; font-weight: 600; line-height: 1.5; white-space: normal; overflow-wrap: anywhere; }
.workspace-users .badge.purple { color: #633e92; background: #f0e9fa; }
.workspace-users .badge.green { color: #236846; background: #e7f5ed; }
.workspace-users .badge.gray { color: #52617a; background: #edf0f6; }
.workspace-users .inline-actions,
.workspace-users .workspace-user-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; min-width: 0; }
.workspace-users .button,
.workspace-users .inline-actions .button,
.workspace-users .workspace-user-actions .button {
  min-height: 44px;
  max-width: 100%;
  padding: 10px 13px;
  font-size: 14px;
  line-height: 1.45;
  white-space: normal;
}
.workspace-users .button.ghost { color: #6332bd; }
.workspace-users .button.secondary { color: #4c356e; border-color: #d0c0e8; }
.workspace-users [data-action="toggle-user"] { border-color: #e1e5ee; }
.workspace-users .button:disabled { color: #778399; border-color: #dfe4ed; background: #f1f3f7; opacity: 1; cursor: not-allowed; }
.workspace-users .empty-state { width: auto; padding: 28px 22px; font-size: 15px; line-height: 1.7; color: #52617a; }
.workspace-users > .form-help { color: #596780; font-size: 13px; line-height: 1.75; }
.workspace-account-note {
  color: #5a4674;
  font-size: 13px;
  line-height: 1.7;
  overflow-wrap: anywhere;
}
.workspace-users .workspace-account-note { display: block; margin: 8px 0 0; max-width: 250px; font-size: 12px; }
.workspace-users #workspace-users-error {
  margin: 0 0 18px;
  padding: 12px 15px;
  border: 1px solid #e9c5ce;
  border-radius: 7px;
  background: #fff4f6;
  color: #9d3046;
  font-size: 15px;
  line-height: 1.65;
  overflow-wrap: anywhere;
}
.workspace-users #workspace-users-error:empty { display: none; }
.workspace-user-form .workspace-account-note {
  padding: 13px 15px;
  margin: 0 0 20px;
  border: 1px solid #dfd3f0;
  border-radius: 7px;
  background: #f7f3fd;
}
.modal #user-form.workspace-user-form .field { min-width: 0; color: #41516b; font-size: 14px; line-height: 1.6; }
.modal #user-form.workspace-user-form .field :is(input, select, textarea) {
  max-width: 100%;
  min-width: 0;
  min-height: 46px;
  border-color: #bac5d7;
  color: #293a55;
  background: #fff;
  font-size: 16px;
  line-height: 1.6;
}
.modal #user-form.workspace-user-form .field :is(input, textarea)::placeholder { color: #65728a; opacity: 1; }
.modal #user-form.workspace-user-form .field :is(input, select, textarea):disabled,
.modal #user-form.workspace-user-form .field input[readonly] {
  color: #465670;
  -webkit-text-fill-color: #465670;
  background: #f0f3f8;
  border-color: #d4dce8;
  opacity: 1;
  cursor: default;
}
.modal #user-form.workspace-user-form :is(.form-help, .workspace-role-help) { color: #596780; font-size: 13px; line-height: 1.7; }
.modal #user-form.workspace-user-form .checkbox-label { min-height: 44px; gap: 9px; color: #41516b; font-size: 15px; line-height: 1.6; }
.modal #user-form.workspace-user-form .checkbox-label input { width: 18px; height: 18px; min-height: 18px; flex-shrink: 0; }
.modal #user-form.workspace-user-form .form-error {
  padding: 11px 13px;
  margin: 15px 0 0;
  border: 1px solid #e9c5ce;
  border-radius: 6px;
  background: #fff4f6;
  color: #9d3046;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.65;
  overflow-wrap: anywhere;
}
.modal #user-form.workspace-user-form .form-error:empty { display: none; }
.modal #user-form.workspace-user-form .button { min-height: 44px; font-size: 14px; line-height: 1.5; white-space: normal; }
.workspace-users button:focus-visible,
.workspace-user-form :is(input, select, textarea, button):focus-visible { outline: 3px solid #7545ff; outline-offset: 3px; }

@media (max-width: 1000px) {
  .workspace-users .table-wrap td,
  .workspace-users .table-wrap th { padding-left: 15px; padding-right: 15px; }
  .workspace-users .table-wrap td:first-child { min-width: 190px; width: 38%; }
}
@media (max-width: 760px) {
  .workspace-users .toolbar { align-items: stretch; }
  .workspace-users .toolbar > .muted { font-size: 15px; }
  .workspace-users .search-field { max-width: none; }
  .workspace-users .search-field input { min-height: 48px; font-size: 16px; }
  .workspace-users .cell-title { font-size: 16px; }
  .workspace-users .cell-subtitle { font-size: 13px; }
  .workspace-users .table-wrap td { font-size: 15px; }
  .workspace-users .badge { font-size: 13px; }
  .workspace-users .button,
  .workspace-users .inline-actions .button,
  .workspace-users .workspace-user-actions .button { min-height: 44px; font-size: 15px; }
  .workspace-users .workspace-account-note { font-size: 13px; max-width: none; }
  .workspace-users > .form-help { font-size: 13px; }
  .modal #user-form.workspace-user-form .workspace-account-note { font-size: 15px; }
  .modal #user-form.workspace-user-form .field { font-size: 15px; }
  .modal #user-form.workspace-user-form .field :is(input, select, textarea) { min-height: 48px; font-size: 16px; }
  .modal #user-form.workspace-user-form .form-error { font-size: 15px; }
  .modal #user-form.workspace-user-form .form-footer { flex-wrap: wrap; gap: 9px; }
  .modal #user-form.workspace-user-form .form-footer .button { flex: 1 1 120px; min-height: 44px; font-size: 15px; }
  .workspace-users .stat-top { color: #52617a; font-size: 13px; line-height: 1.6; }
  .workspace-users .stat-foot,
  .workspace-users .stat-foot .muted { color: #596780; font-size: 13px; line-height: 1.6; }
}
@media (max-width: 680px) {
  .workspace-users .table-wrap { overflow: visible; padding: 14px; }
  .workspace-users .table-wrap :is(table, tbody, tr, td) { display: block; width: 100%; min-width: 0; max-width: none; }
  .workspace-users .table-wrap thead { display: none; }
  .workspace-users .table-wrap tr { border: 1px solid #dfe5ef; border-radius: 9px; background: #fff; margin-bottom: 14px; overflow: hidden; }
  .workspace-users .table-wrap tr:last-child { margin-bottom: 0; }
  .workspace-users .table-wrap td { padding: 12px 14px; border-bottom: 1px solid #e9edf3; }
  .workspace-users .table-wrap td:first-child { min-width: 0; width: 100%; padding-top: 16px; padding-bottom: 16px; }
  .workspace-users .table-wrap td:last-child { border-bottom: 0; }
  .workspace-users .table-wrap td[data-label]::before { content: attr(data-label); display: block; color: #596780; font-size: 13px; font-weight: 600; line-height: 1.5; margin-bottom: 7px; }
  .workspace-users .project-name,
  .workspace-users .workspace-user-identity { align-items: flex-start; gap: 10px; }
  .workspace-users .user-avatar { width: 34px; height: 34px; flex-basis: 34px; font-size: 12px; }
  .workspace-users .inline-actions,
  .workspace-users .workspace-user-actions { gap: 8px; }
  .workspace-users .inline-actions .button,
  .workspace-users .workspace-user-actions .button { flex: 1 1 96px; }
  .workspace-users .table-wrap .empty-state { padding: 25px 16px; font-size: 15px; }
}
@media (max-width: 380px) {
  .workspace-users .table-wrap { padding: 10px; }
  .workspace-users .table-wrap td { padding: 12px; }
  .workspace-users .stats-grid { gap: 10px; }
  .workspace-users .stat-card { padding: 13px; }
  .workspace-users .stat-top { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) {
  .workspace-users *,
  .workspace-user-form * { transition: none; scroll-behavior: auto; }
}