// Project file — not part of the Font Awesome distribution.
//
// The app uses the thin (100), light (300) and regular (400) styles of
// "Font Awesome 6 Pro". The Pro webfonts are proprietary and are never part of
// this repository: licensed builds copy them to $fa-font-path after the build.
// When they are absent, the font stack below falls back to the bundled
// Font Awesome Free solid face (declared in base/_fonts.scss),
// and src/composables/icon.ts detects the missing Pro faces to remap dynamic
// icons to their Free equivalents.
@use "variables" as fa-variables;

@font-face {
  font-family: "Font Awesome 6 Pro";
  font-style: normal;
  font-weight: 100;
  font-display: fa-variables.$fa-font-display;
  src:
    url("#{fa-variables.$fa-font-path}/fa-thin-100.woff2") format("woff2"),
    url("#{fa-variables.$fa-font-path}/fa-thin-100.ttf") format("truetype");
}

@font-face {
  font-family: "Font Awesome 6 Pro";
  font-style: normal;
  font-weight: 300;
  font-display: fa-variables.$fa-font-display;
  src:
    url("#{fa-variables.$fa-font-path}/fa-light-300.woff2") format("woff2"),
    url("#{fa-variables.$fa-font-path}/fa-light-300.ttf") format("truetype");
}

@font-face {
  font-family: "Font Awesome 6 Pro";
  font-style: normal;
  font-weight: 400;
  font-display: fa-variables.$fa-font-display;
  src:
    url("#{fa-variables.$fa-font-path}/fa-regular-400.woff2") format("woff2"),
    url("#{fa-variables.$fa-font-path}/fa-regular-400.ttf") format("truetype");
}

// The Free edition core only styles the solid/regular/brands classes. Give the
// thin and light classes the same base icon properties, and put the Pro family
// first in the stack so it wins whenever the Pro faces loaded.
.fa-thin,
.fat,
.fa-light,
.fal,
.fa-regular,
.far {
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  display: var(--fa-display, #{fa-variables.$fa-display});
  font-style: normal;
  font-variant: normal;
  line-height: 1;
  text-rendering: auto;
  font-family: "Font Awesome 6 Pro", "Font Awesome 6 Free";
}

.fa-thin::before,
.fat::before,
.fa-light::before,
.fal::before,
.fa-regular::before,
.far::before {
  content: var(#{fa-variables.$fa-icon-property});
}

.fa-thin,
.fat {
  font-weight: 100;
}

.fa-light,
.fal {
  font-weight: 300;
}

.fa-regular,
.far {
  font-weight: 400;
}