.badge {
  @apply inline-flex items-center px-3 py-1 text-sm font-medium rounded-full gap-x-1;
}

.badge-sm {
  @apply px-2 py-1 text-xs;
}

.badge-primary {
  @apply bg-primary-600 text-primary-50;
}

.badge-secondary-light {
  @apply bg-pink-50 text-secondary-600;
}

.badge-secondary {
  @apply bg-secondary-500 text-pink-50;
}

.badge-success {
  @apply text-green-800 bg-green-100;
}

.badge-danger {
  @apply text-red-800 bg-red-100;
}

.badge-warning {
  @apply text-yellow-900 bg-yellow-100;
}

.badge-info {
  @apply bg-gray-100 border text-grayscale-700;
}

.badge-blank {
  @apply text-gray-800 bg-white border;
}

.badge-light {
  @apply text-gray-800 bg-gray-100;
}