/* ============================================================
 * NextGen MIS — Icon modernisation (Font Awesome 4 → Phosphor)
 * ------------------------------------------------------------
 * Templates keep their `fa fa-*` classes untouched. We remap the
 * ~32 icons actually used to Phosphor (friendly, MIT, SVG) via
 * CSS mask-image. Each icon:
 *   - inherits text colour (background-color: currentColor)
 *   - scales with font-size (1em box)
 *   - is a crisp SVG, not a font glyph
 *
 * Phosphor SVGs live in /img/icons/phosphor/ (regular weight).
 * Any fa-* class NOT listed here still renders via the FA font,
 * so this swap is graceful — no missing icons.
 *
 * To add an icon later: download the Phosphor SVG into that
 * folder, add the selector to the shared block, add a --ph line.
 * ============================================================ */

/* Shared box treatment for every remapped icon */
.fa-users::before,
.fa-user::before,
.fa-user-plus::before,
.fa-money::before,
.fa-pencil-square-o::before,
.fa-pencil::before,
.fa-files-o::before,
.fa-file-o::before,
.fa-file-text::before,
.fa-exchange::before,
.fa-history::before,
.fa-refresh::before,
.fa-cogs::before,
.fa-calendar::before,
.fa-plus::before,
.fa-trash::before,
.fa-check::before,
.fa-check-circle::before,
.fa-check-square::before,
.fa-search::before,
.fa-eye::before,
.fa-eye-slash::before,
.fa-upload::before,
.fa-download::before,
.fa-lock::before,
.fa-unlock-alt::before,
.fa-warning::before,
.fa-spinner::before,
.fa-paperclip::before,
.fa-comments::before,
.fa-info-circle::before,
.fa-angle-right::before,
.fa-angle-left::before,
.fa-angle-down::before,
.fa-sign-out::before,
.fa-save::before,
.fa-circle::before,
.fa-briefcase::before,
.fa-list::before,
.fa-bars::before,
.fa-times::before,
.fa-close::before,
.fa-dashboard::before,
.fa-university::before,
.fa-bell::before {
  content: "" !important;            /* drop the FA font glyph */
  display: inline-block;
  width: 1em;
  height: 1em;
  background-color: currentColor;    /* icon takes surrounding text colour */
  -webkit-mask: var(--ph) center / contain no-repeat;
          mask: var(--ph) center / contain no-repeat;
  vertical-align: -0.125em;
}

/* Per-icon mask source (FA semantic → Phosphor glyph) */
.fa-users           { --ph: url(/img/icons/phosphor/users.svg); }
.fa-user            { --ph: url(/img/icons/phosphor/user.svg); }
.fa-user-plus       { --ph: url(/img/icons/phosphor/user-plus.svg); }
.fa-money           { --ph: url(/img/icons/phosphor/wallet.svg); }
.fa-pencil-square-o { --ph: url(/img/icons/phosphor/note-pencil.svg); }
.fa-pencil          { --ph: url(/img/icons/phosphor/pencil-simple.svg); }
.fa-files-o         { --ph: url(/img/icons/phosphor/copy.svg); }
.fa-file-o          { --ph: url(/img/icons/phosphor/file.svg); }
.fa-file-text       { --ph: url(/img/icons/phosphor/file-text.svg); }
.fa-exchange        { --ph: url(/img/icons/phosphor/arrows-left-right.svg); }
.fa-history         { --ph: url(/img/icons/phosphor/arrow-counter-clockwise.svg); }
.fa-refresh         { --ph: url(/img/icons/phosphor/arrow-clockwise.svg); }
.fa-cogs            { --ph: url(/img/icons/phosphor/gear-six.svg); }
.fa-university      { --ph: url(/img/icons/phosphor/bank.svg); }   /* Bank Tools — classical bank building */
.fa-calendar        { --ph: url(/img/icons/phosphor/calendar-blank.svg); }
.fa-plus            { --ph: url(/img/icons/phosphor/plus.svg); }
.fa-trash           { --ph: url(/img/icons/phosphor/trash.svg); }
.fa-check           { --ph: url(/img/icons/phosphor/check.svg); }
.fa-check-circle    { --ph: url(/img/icons/phosphor/check-circle.svg); }
.fa-check-square    { --ph: url(/img/icons/phosphor/check-square.svg); }
.fa-search          { --ph: url(/img/icons/phosphor/magnifying-glass.svg); }
.fa-eye             { --ph: url(/img/icons/phosphor/eye.svg); }
.fa-eye-slash       { --ph: url(/img/icons/phosphor/eye-slash.svg); }   /* password reveal "hide" state (PR #540) — keep it Phosphor, not the heavy FA fallback */
.fa-upload          { --ph: url(/img/icons/phosphor/upload-simple.svg); }
.fa-download        { --ph: url(/img/icons/phosphor/download-simple.svg); }
.fa-lock            { --ph: url(/img/icons/phosphor/lock.svg); }
.fa-unlock-alt      { --ph: url(/img/icons/phosphor/lock-open.svg); }
.fa-warning         { --ph: url(/img/icons/phosphor/warning.svg); }
.fa-spinner         { --ph: url(/img/icons/phosphor/circle-notch.svg); }
.fa-paperclip       { --ph: url(/img/icons/phosphor/paperclip.svg); }
.fa-comments        { --ph: url(/img/icons/phosphor/chat-circle.svg); }
.fa-info-circle     { --ph: url(/img/icons/phosphor/info.svg); }
.fa-angle-right     { --ph: url(/img/icons/phosphor/caret-right.svg); }
.fa-angle-left      { --ph: url(/img/icons/phosphor/caret-left.svg); }
.fa-angle-down      { --ph: url(/img/icons/phosphor/caret-down.svg); }
.fa-sign-out        { --ph: url(/img/icons/phosphor/sign-out.svg); }
.fa-save            { --ph: url(/img/icons/phosphor/floppy-disk.svg); }
.fa-circle          { --ph: url(/img/icons/phosphor/circle.svg); }
.fa-briefcase       { --ph: url(/img/icons/phosphor/briefcase.svg); }
.fa-list            { --ph: url(/img/icons/phosphor/list.svg); }
.fa-bars            { --ph: url(/img/icons/phosphor/list.svg); }
.fa-times           { --ph: url(/img/icons/phosphor/x.svg); }
.fa-close           { --ph: url(/img/icons/phosphor/x.svg); }
.fa-dashboard       { --ph: url(/img/icons/phosphor/squares-four.svg); }
.fa-bell            { --ph: url(/img/icons/phosphor/bell.svg); }

/* Spinner keeps FA's .fa-spin rotation on the element; the masked box
   rotates with it. Give it a continuous spin if .fa-spin is present. */
.fa-spinner.fa-spin::before {
  animation: none; /* the parent .fa-spin handles rotation */
}

/* ---------- Standalone icon tokens ----------
   Phosphor glyphs not bound to an .fa-* class, exposed as masks for
   components to consume via var(). Same /img/icons/phosphor/ source as
   the remaps above. Used by the search/filter toolbar in _filters.css. */
:root {
  --ng-icon-sliders: url(/img/icons/phosphor/sliders-horizontal.svg);
}
