/* ==========================================================================
   Componente: Badges de categoria
   ========================================================================== */

.badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 10px;
  border-radius: var(--radius-pill);
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  white-space: nowrap;
}

.badge--olive {
  background: var(--color-olive-100);
  color: var(--color-olive-900);
}

.badge--red {
  background: var(--color-red-100);
  color: var(--color-red-800);
}

.badge--gold {
  background: var(--color-gold-100);
  color: var(--color-gold-700);
}

.badge--neutral {
  background: var(--color-gray-100);
  color: var(--color-gray-800);
}

.badge--outline {
  background: transparent;
  border: 1px solid currentColor;
}

.badge--example {
  background: var(--color-gray-800);
  color: var(--color-white);
}