/* Figma: List items / admin data table pattern */

.ui-data-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--color-border-default);
  border-radius: var(--radius-control-lg);
  background: var(--color-background-surface);
}

.ui-data-table {
  width: 100%;
  min-width: 960px;
  border-collapse: collapse;
}

.ui-data-table thead th {
  height: 44px;
  padding: 0 var(--spacing-5);
  border-bottom: 1px solid var(--color-divider-default);
  background: var(--color-background-surface-muted);
  font-family: var(--font-family-primary);
  font-size: var(--font-size-body-md);
  font-weight: var(--font-weight-body-md);
  line-height: var(--line-height-body-md);
  color: var(--color-text-muted);
  text-align: left;
  white-space: nowrap;
}

.ui-data-table tbody td {
  height: 56px;
  padding: 0 var(--spacing-5);
  border-bottom: 1px solid var(--color-border-subtle);
  font-family: var(--font-family-primary);
  font-size: var(--font-size-body-md);
  font-weight: var(--font-weight-body-md);
  line-height: var(--line-height-body-md);
  color: var(--color-text-primary);
  vertical-align: middle;
}

.ui-data-table tbody tr {
  cursor: pointer;
  transition: background 0.12s ease;
}

.ui-data-table tbody tr:hover {
  background: var(--color-background-surface-muted);
}

.ui-data-table tbody tr:last-child td {
  border-bottom: none;
}

.ui-data-table__id {
  font-weight: var(--font-weight-heading-xs);
  font-variant-numeric: tabular-nums;
  color: var(--color-text-primary);
}

.ui-data-table__link {
  border: none;
  background: none;
  padding: 0;
  font-family: var(--font-family-primary);
  font-size: var(--font-size-body-md);
  color: var(--color-text-link);
  cursor: pointer;
}

.ui-data-table__link:hover {
  text-decoration: underline;
}

.ui-data-table__muted {
  color: var(--color-text-secondary);
}