/**
 * Badge & Chip
 */

.v-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--v-space-1);
  min-height: 1.375rem;
  padding: 0 0.5rem;
  border-radius: var(--v-radius-sm);
  background: var(--v-color-forest);
  color: var(--v-color-on-primary);
  font-size: 0.6875rem;
  font-weight: var(--v-font-weight-semibold);
  letter-spacing: var(--v-letter-wide);
  text-transform: uppercase;
  line-height: 1;
  white-space: nowrap;
}

.v-badge--gold {
  background: var(--v-color-gold);
  color: var(--v-color-on-accent);
}

.v-badge--soft {
  background: var(--v-color-paper-warm);
  color: var(--v-color-ink);
}

.v-badge--sale {
  background: transparent;
  color: var(--v-color-danger);
  box-shadow: inset 0 0 0 1px var(--v-color-danger);
}

.v-badge--new {
  background: var(--v-color-ink);
  color: var(--v-color-paper);
}

.v-badge--sold-out {
  background: rgba(247, 245, 240, 0.94);
  color: var(--v-color-ink);
}

.v-badge--outline {
  background: transparent;
  color: var(--v-color-ink);
  box-shadow: inset 0 0 0 1px var(--v-color-border-strong);
}

.v-chip {
  display: inline-flex;
  align-items: center;
  gap: var(--v-space-2);
  min-height: 2rem;
  padding: 0 0.75rem;
  border: 1px solid var(--v-color-border);
  border-radius: var(--v-radius-pill);
  background: var(--v-color-surface);
  color: var(--v-color-ink);
  font-size: var(--v-text-sm);
  font-weight: var(--v-font-weight-medium);
  text-decoration: none;
  transition:
    background-color var(--v-duration-fast) var(--v-ease-standard),
    border-color var(--v-duration-fast) var(--v-ease-standard),
    color var(--v-duration-fast) var(--v-ease-standard);
}

.v-chip:hover {
  border-color: var(--v-color-ink);
  text-decoration: none;
}

.v-chip.is-active,
.v-chip[aria-pressed="true"] {
  background: var(--v-color-ink);
  border-color: var(--v-color-ink);
  color: var(--v-color-paper);
}

.v-chip__remove {
  display: inline-flex;
  margin-left: var(--v-space-1);
  opacity: 0.7;
}

.v-chip__remove:hover {
  opacity: 1;
}