/* ==========================================================================
   Badge color modifiers (including Bootstrap-4-style names).
   Owning feature: shared / components
   Load order is defined in Views/Shared/_CssIncludes.cshtml — do not reorder.
   ========================================================================== */

/* --- Badges -------------------------------------------------------------
   Bootstrap 5 dropped the Bootstrap-4-style `.badge-*` color modifiers in
   favor of `.text-bg-*`, but several views still use the old class names
   (e.g. `badge-success`, `badge-danger`) — define them so those badges
   render instead of falling back to the plain grey `.badge`. */
.badge {
  border-radius: var(--fh-radius-sm);
  font-weight: var(--fh-weight-semibold);
  letter-spacing: var(--fh-tracking-wide);
}
.badge-primary, .badge-info { background-color: var(--fh-primary); color: #fff; }
.badge-secondary { background-color: var(--fh-secondary); color: #fff; }
.badge-success { background-color: var(--fh-success); color: #fff; }
.badge-danger { background-color: var(--fh-danger); color: #fff; }
.badge-warning { background-color: var(--fh-warning); color: #fff; }
.badge-light { background-color: var(--fh-soft); color: var(--fh-text); }
.badge-dark { background-color: var(--fh-text); color: #fff; }