/* ==========================================================
   Chip Component — Pillar labels, tags
   ========================================================== */

.chip {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  padding: var(--space-xs) var(--space-md);
  font-size: var(--font-sm);
  font-weight: var(--weight-medium);
  color: var(--tg-theme-hint-color);
  background: var(--tg-theme-secondary-bg-color);
  border-radius: var(--radius-full);
  transition: background var(--transition-fast), color var(--transition-fast);
  min-height: 32px;
}

.chip-active {
  background: var(--tg-theme-button-color);
  color: var(--tg-theme-button-text-color);
}