/* ---------------------------------------------------------------------------------------
   FontAwesome 6 compatibility shims for this app.

   NOTE ON DEPLOYMENT: css/ is listed in .dockerignore, so this file does NOT ship in the
   container image - it is served from the SMB content mount that container-start.ps1
   junctions in. After editing it, copy it to the file server
   (\\10.20.2.63\webdata -> content_static\css\) or production will keep serving the old
   copy. Bump the ?v= on the 28 <link> tags whenever its contents change.

   DO NOT PIN FONTAWESOME BACK TO 6.5.0. In 6.5.0 the file-pdf glyph (U+F1C1, which every
   legacy fa-file-pdf-o resolves to via v4-shims) is drawn with the letters "PNG" instead of
   "PDF" - an upstream drawing bug. Verified from the shipped SVGs: 6.5.0's three letterform
   subpaths are P, N (two stems + a diagonal) and G (rounded C with an inner bar), while
   6.6.0 and 6.7.2 correctly draw P, D (stem + right bowl) and F (stem + two bars). The app
   is on 6.7.2 for this reason.

   REMOVED 2026-09: a :where(.fa, .fas, ...) { font-size: 0.875em } rule used to live here.
   FA4 drew its glyphs on a 14px baseline grid and FA5/FA6 use 16px, so FA6 icons render
   about 16/14 larger at the same font-size, and 0.875em (= 14/16) was meant to restore the
   old visual size. In practice it made the icons look too small against this app's type, so
   it was dropped and FA6's natural size is used. Do not reintroduce it - if a specific
   screen needs smaller icons, size them there rather than globally.
   --------------------------------------------------------------------------------------- */

/* ---------------------------------------------------------------------------------------
   Bootstrap 3 input-group compatibility. KEEP THIS - it is a layout fix, not sizing.

   Bootstrap builds input-groups as display:table and requires its children to stay
   display:table-cell (bootstrap.min.css: ".input-group-addon,.input-group-btn,
   .input-group .form-control{display:table-cell}"). Pages put the icon straight on the
   addon - <span class="input-group-addon fa fa-phone"> - so the two stylesheets fight over
   the same element twice:

     font-weight  bootstrap .input-group-addon{font-weight:normal} vs FA6 .fa{font-weight:900}
     display      bootstrap .input-group-addon{display:table-cell} vs FA6 .fa{display:...}

   Both pairs are single-class selectors, so load order alone decides and there is no order
   that satisfies both: with FA6 first, addon icons drop to the regular face and every
   solid-only icon (graduation-cap, phone, lock, group) renders as tofu; with FA6 last, the
   weight is right but the addon leaves the table row and stacks above its input.

   So FA6 loads last (fixing the weight) and the display is handed back through FA6's own
   custom property - its base rule is display:var(--fa-display,inline-block), so setting
   --fa-display here wins without any specificity battle.
   --------------------------------------------------------------------------------------- */
.input-group-addon,
.input-group-btn {
    --fa-display: table-cell;
}