/* ==========================================================================
   Badge  (.pf-badge)
   A small hairline-boxed uppercase label — for a single call-out tag or status.
   Distinct from .pf-tags (a whole meta row). Sharp by default; --pill rounds.
   ========================================================================== */

.pf-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--pf-space-1);
  font-family: var(--pf-font-display);
  font-weight: var(--pf-weight-display);
  font-size: var(--pf-text-small);
  letter-spacing: var(--pf-tracking-caps);
  text-transform: uppercase;
  line-height: 1;
  padding: var(--pf-space-1) var(--pf-space-2);
  border: var(--pf-border) solid var(--pf-hairline-strong);
  color: var(--pf-ink);
  border-radius: var(--pf-radius-none);
}

.pf-badge--pill {
  border-radius: var(--pf-radius-full);
}

/* Accent badge — ink text with a pink hairline (pink as a graphic border,
   never as the text). Use sparingly, e.g. one "Featured" marker. */
.pf-badge--accent {
  color: var(--pf-ink);
  border-color: var(--pf-accent);
}

/* Solid badge — filled ink block. */
.pf-badge--solid {
  background: var(--pf-ink);
  color: var(--pf-ink-inverse);
  border-color: var(--pf-ink);
}