/* ============================================================== BADGES
   THE STATUS PALETTE FOR THE WHOLE APP, IN ITS OWN FILE.

   It lived in core/static/core/responsive-tables.css until Codex found the
   reason it cannot: that is a TABLE stylesheet, and three Bootstrap-loading
   base templates that render badges never load it.

     clinic_portal/templates/clinic_portal/base.html   Bootstrap 5.3.3
     personnel/.../careers/_base.html                  Bootstrap 5.3.0
     accounts/templates/registration/login.html        Bootstrap 5.3.0

   The clinic portal is the one that bit. Its dashboard and report detail
   render `badge bg-{{ status_color }}`, and `TestRequest.status_color` had its
   `text-dark` removed on the reasoning that the ink was now owned by the
   stylesheet — true everywhere the stylesheet is loaded, and false there. In
   Bootstrap 5 `.badge` sets `color: #fff` itself, so PENDING and AUTHORIZING
   rendered white on #ffc107 at **1.63:1** and the four SPECIMEN/RESULTING
   states white on cyan at about 2:1. A lab's clients read their own results on
   that page.

   The login page is the pre-existing case the same move fixes: it renders
   `badge badge-secondary` on Bootstrap 5, where `.badge-*` does not exist at
   all, so those badges had no ground whatsoever.

   THE RULE THIS FILE EXISTS TO ENFORCE: a page that loads Bootstrap and can
   show a badge loads THIS. `core.test_badge_contrast` asserts it for every
   template linking a Bootstrap stylesheet, so the next portal cannot be added
   without it.

   A badge states BOTH halves of its colour pair here — ground and ink — so the
   contrast is a property of this file rather than of whichever Bootstrap the
   page happened to load. That independence is the whole point, and it is only
   real if the file is actually linked.

   THAT LAST PART IS NOT THEORETICAL. This stylesheet is loaded by BOTH
   generic.html (Bootstrap 4.5.2) and generic_public.html / generic_2.html /
   generic_paste.html (Bootstrap 5.3.3), and the two frameworks do not agree on
   what `.bg-success` means: #28a745 in 4.5.2, #198754 in 5.3.3. An earlier
   version of this block set only the ink, chosen against the Bootstrap 4
   ground — which measured 4.92:1 there and **3.40:1 on the Bootstrap 5 public
   pages**, including the patient-facing prescription and lab-result screens.
   It made those worse, not better. Codex caught it.

   There is no single ink that rescues that: on success, white is 3.13:1 on the
   BS4 green and 4.53:1 on the BS5 one, while dark ink is 4.92:1 and 3.40:1.
   The ONLY fix that holds across both is to stop depending on the ground and
   state it. So every variant below pins both halves, and the ratio beside it
   is what renders on every page in the app.

   The pinned grounds are Bootstrap 4.5.2's, because that is what the
   overwhelming majority of screens already show — those pages are unchanged to
   the byte. The three Bootstrap 5 base templates shift to match them, which
   also stops public pages rendering a different green from the rest of the app.

   WHY THE INK IS NOT SIMPLY BOOTSTRAP'S. Its own `.badge-*` pairing fails AA
   for two variants — success at 3.13:1 and info at 3.04:1 — so the ink here is
   chosen per ground, not copied. Both class spellings are declared together
   because both are in the templates (~184 `bg-*`, ~424 `badge-*`) and
   Bootstrap 5 dropped `.badge-*` entirely; without this they render
   differently, or in BS5's case not at all.

   `!important` on the background matches `.bg-*`'s own declaration in both
   frameworks, which would otherwise win. Deliberately NOT dark-gated: these
   grounds are semantic and keep their colour, so the ink that belongs on them
   is the same in both themes. templates/partials/_theme.html excludes `.badge`
   from its `.bg-*` ink rule for exactly that reason, and still overrides
   `light` — the one variant that is chrome rather than meaning. */
.badge.bg-primary,
.badge-primary   { color: #fff;     background-color: #0062cc !important; }  /* 5.80:1 */
.badge.bg-secondary,
.badge-secondary { color: #fff;     background-color: #6c757d !important; }  /* 4.69:1 */
.badge.bg-success,
.badge-success   { color: #212529;  background-color: #28a745 !important; }  /* 4.92:1 */
.badge.bg-danger,
.badge-danger    { color: #fff;     background-color: #dc3545 !important; }  /* 4.53:1 */
.badge.bg-warning,
.badge-warning   { color: #212529;  background-color: #ffc107 !important; }  /* 9.46:1 */
.badge.bg-info,
.badge-info      { color: #212529;  background-color: #17a2b8 !important; }  /* 5.07:1 */
.badge.bg-dark,
.badge-dark      { color: #fff;     background-color: #343a40 !important; }  /* 11.51:1 */
.badge.bg-light,
.badge-light     { color: #212529;  background-color: #f8f9fa !important; }  /* 14.63:1 */
