/* Tag — Figma: Tasarım sistemi › Etiket (2:95)
   Variant: neutral · brand · accent · success · error · inverse */

.tag {
  display: inline-flex;
  align-items: center;
  padding: var(--space-4) var(--space-10);
  border-radius: var(--radius-pill);
  font-size: 12px;
  line-height: 1.4;
  font-weight: 500;
  white-space: nowrap;
}

.tag--neutral { background: var(--color-surface-canvas);        color: var(--color-text-secondary); }
.tag--brand   { background: var(--color-brand-tint);            color: var(--color-text-link); }
.tag--accent  { background: var(--color-accent-tint);           color: var(--color-accent-recommended); }
.tag--success { background: var(--color-feedback-success-tint); color: var(--color-feedback-success); }
.tag--error   { background: var(--color-feedback-error-tint);   color: var(--color-feedback-error); }
.tag--inverse { background: var(--color-surface-inverse);       color: var(--color-text-inverse); }