/* ==========================================================================
   Utility Classes
   ========================================================================== */
.text-muted-token { color: var(--color-text-muted) !important; }
.text-secondary-token { color: var(--color-text-secondary) !important; }
.text-primary-token { color: var(--color-primary) !important; }

.bg-surface { background: var(--color-surface); }
.bg-app { background: var(--color-background); }

.radius-sm { border-radius: var(--border-radius-sm); }
.radius-md { border-radius: var(--border-radius-md); }
.radius-lg { border-radius: var(--border-radius-lg); }

.shadow-token-sm { box-shadow: var(--shadow-sm); }
.shadow-token-md { box-shadow: var(--shadow-md); }

.gap-token-1 { gap: var(--space-1); }
.gap-token-2 { gap: var(--space-2); }
.gap-token-3 { gap: var(--space-3); }

.cursor-pointer { cursor: pointer; }

.table-scroll-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.avatar-circle {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 0.85rem;
  color: var(--color-text-inverse);
  flex-shrink: 0;
}

.avatar-sm { width: 30px; height: 30px; font-size: 0.75rem; }
.avatar-lg { width: 48px; height: 48px; font-size: 1rem; }

.hstack-between {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.no-decoration { text-decoration: none; }