/**
 * @file
 * Visual styles for Groovy+'s fa icons list.
 */
.list--fa-star,
.list--fa-caret-right,
.list--fa-plus,
.list--fa-square,
.list--fa-check,
.list--fa-check-circle,
.list--fa-custom {
  margin-bottom: 15px;
  padding-left: 0;
  list-style: none;
}
.list--fa-star li,
.list--fa-plus li,
.list--fa-square li,
.list--fa-caret-right li,
.list--fa-check li,
.list--fa-check-circle li {
  padding: 0 0 10px 35px;
  position: relative;
}
.list--fa-star li:before,
.list--fa-caret-right li:before,
.list--fa-plus li:before,
.list--fa-square li:before,
.list--fa-check li:before,
.list--fa-check-circle li:before {
  font-family: 'Font Awesome 5 Free', 'Font Awesome 5 Pro';
  font-weight: 900;
  position: absolute;
  left: 0;
  top: -3px;
  font-size: 20px;
}
.list--fa-star li:before {
  content: "\f005";
}
.list--fa-caret-right li:before {
  content: "\f0da";
  font-size: 20px;
  top: -3px;
}
.list--fa-plus li:before {
  content: "\f067";
}
.list--fa-square li:before {
  content: "\f0c8";
  font-size: 12px;
  top: 5px;
}
.list--fa-check li:before {
  content: "\f00c";
}
.list--fa-check-circle li:before {
  content: "\f058";
}
.list--fa-custom li {
  padding: 0 0 10px 0;
}
.list--fa-custom li .svg-inline--fa {
  margin-right: 20px;
  width: 20px;
  font-size: 20px;
}
/**
 * Font Awesome migration fix (D10 -> D11).
 *
 * The Font Awesome module's icon field (field--type-fontawesome-icon, e.g. the
 * Icon Features paragraph) stores the FA5-era style token "fas"/"far"/"fab".
 * The FA6-era formatter outputs it as "fa-" + style, producing the invalid
 * classes "fa-fas"/"fa-far"/"fa-fab". Those match neither FA5 (.fas) nor FA6
 * (.fa-solid), so the glyph's font-family is never applied and the browser
 * renders the raw codepoint box (f004, f007, ...).
 *
 * This maps the malformed classes back to a usable webfont. The font-family is
 * listed for both FA6 and FA5 so it works whichever version is loaded (the
 * browser uses whichever @font-face is present); the icon codepoints are stable
 * across 5 and 6 for these glyphs.
 */
.fa-fas,
.fa-far,
.fa-fab {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  line-height: 1;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.fa-fas {
  font-family: "Font Awesome 6 Free", "Font Awesome 5 Free";
  font-weight: 900;
}
.fa-far {
  font-family: "Font Awesome 6 Free", "Font Awesome 5 Free";
  font-weight: 400;
}
.fa-fab {
  font-family: "Font Awesome 6 Brands", "Font Awesome 5 Brands";
  font-weight: 400;
}