/* Material Symbols (Outlined) - app-level icon font.
   Registered from includes/ui/fontawesome.php, so every theme that uses
   the FA emitter gets it, not just the 3axid cabinet.

   SELF-HOSTED. Nothing here talks to fonts.googleapis.com or
   fonts.gstatic.com - the font ships in this directory. See README.md for
   provenance, SHA-256 and how to re-fetch it. Keep it that way: the
   mobile-app webview and any locked-down network then render icons
   without depending on Google's CDN being reachable, and there is no
   third-party request on every page load. */

@font-face {
    font-family: 'Material Symbols Outlined';
    font-style: normal;
    font-weight: 400;
    /* "block" matters here: these icons resolve by LIGATURE, so a swap
       period would paint the raw ligature name ("local_shipping") as
       text before the font arrives. "block" renders nothing instead. */
    font-display: block;
    src: url(material-symbols-outlined.woff2) format('woff2');
}

/* The vendored file is a PINNED STATIC INSTANCE at opsz 24, wght 400,
   FILL 0, GRAD 0 - the only combination this app uses - which is 312 KB
   against 3,868 KB for the full variable font. So there is deliberately
   no "font-variation-settings" rule below: it would be a no-op, and
   leaving it in would imply the axes are adjustable. They are not; to
   change weight or fill you have to re-fetch the font (see README.md).

   The compound ".fa.material-symbols-outlined" selector is also
   deliberate: font-awesome.css sets font-family on a bare ".fa", which is
   the same specificity as the bare ".material-symbols-outlined" below, so
   whichever file happened to load last would win. The two-class selector
   settles it regardless of registration order. */
.fa.material-symbols-outlined,
.material-symbols-outlined {
    font-family: 'Material Symbols Outlined';
    font-weight: normal;
    font-style: normal;
    font-variant: normal;
    /* Google's own stylesheet pins 24px here, far too big for an icon
       sitting inline in a sentence or a list. "inherit" makes the glyph
       track its surrounding text; themes then size it deliberately. */
    font-size: inherit;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    vertical-align: -0.125em;
    -webkit-font-feature-settings: 'liga';
    font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
}

/* no FontAwesome codepoint on top of the ligature: these icons keep their
   original "fa fa-<name>" classes (a lot of theme CSS hooks on them), so
   font-awesome.css would otherwise inject its own glyph through ::before
   and render two icons in one box */
.material-symbols-outlined:before {
    content: none;
}
