/* Single local icon file for SMMPAW
   - Solid icons use local webfont: css/webfonts/fa-solid-900.woff2
   - Brand icons use local image assets already inside the theme
*/

@font-face {
  font-family: "FA5SolidLocal";
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("webfonts/fa-solid-900.woff2") format("woff2");
}

/* base */
.fa,
.fas,
.far,
.fab,
.fa-solid,
.fa-brands {
  display: inline-block;
  line-height: 1;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.fa::before,
.fas::before,
.far::before,
.fab::before,
.fa-solid::before,
.fa-brands::before {
  display: inline-block;
}

/* solid / regular fallback to solid so old markup keeps working */
.fa:not(.fab):not(.fa-brands)::before,
.fas::before,
.far::before,
.fa-solid::before {
  font-family: "FA5SolidLocal" !important;
  font-weight: 900;
  background: none !important;
  width: auto;
  height: auto;
}

/* useful helpers */
.fa-spin,
.fas.fa-spin,
.far.fa-spin,
.fab.fa-spin,
.fa-solid.fa-spin,
.fa-brands.fa-spin {
  animation: fa-spin 2s linear infinite;
}

@keyframes fa-spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.fa-fw { width: 1.25em; text-align: center; }
.fa-lg { font-size: 1.3333333em; line-height: .75em; vertical-align: -.0667em; }
.fa-sm { font-size: .875em; }
.fa-xs { font-size: .75em; }

/* solid icons used by the theme */
.fa-check::before { content: "\f00c"; }
.fa-times::before { content: "\f00d"; }
.fa-search::before { content: "\f002"; }
.fa-envelope::before { content: "\f0e0"; }
.fa-user::before { content: "\f007"; }
.fa-star::before { content: "\f005"; }
.fa-arrow-left::before { content: "\f060"; }
.fa-arrow-right::before { content: "\f061"; }
.fa-lock::before { content: "\f023"; }
.fa-copy::before { content: "\f0c5"; }
.fa-tachometer-alt::before { content: "\f3fd"; }
.fa-bell::before { content: "\f0f3"; }
.fa-sign-out-alt::before { content: "\f2f5"; }
.fa-clone::before { content: "\f24d"; }
.fa-map-marker-alt::before { content: "\f3c5"; }
.fa-mars::before { content: "\f222"; }
.fa-venus::before { content: "\f221"; }
.fa-filter::before { content: "\f0b0"; }
.fa-chevron-down::before { content: "\f078"; }
.fa-list::before { content: "\f03a"; }
.fa-exclamation-circle::before { content: "\f06a"; }
.fa-mobile::before { content: "\f10b"; }
.fa-user-plus::before { content: "\f234"; }
.fa-bars::before { content: "\f0c9"; }
.fa-globe::before { content: "\f0ac"; }
.fa-spinner::before { content: "\f110"; }

/* brand icons use local image assets from the theme */
.fab::before,
.fa-brands::before {
  content: "";
  width: 1em;
  height: 1em;
  vertical-align: -.125em;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}

.fab.fa-instagram::before,
.fa-brands.fa-instagram::before {
  background-image: url("neworder/Instagram_nhzqby_yx2cpy.webp");
}

.fab.fa-tiktok::before,
.fa-brands.fa-tiktok::before {
  background-image: url("neworder/Tiktok_rsbi2j_lyhhaw.webp");
}

.fab.fa-youtube::before,
.fa-brands.fa-youtube::before {
  background-image: url("neworder/Youtube_khw49k_urj6dl.webp");
}

.fab.fa-facebook::before,
.fa-brands.fa-facebook::before,
.fab.fa-facebook-f::before,
.fa-brands.fa-facebook-f::before {
  background-image: url("neworder/Facebook_vbvkka_slwhii.webp");
}

.fab.fa-telegram::before,
.fa-brands.fa-telegram::before,
.fab.fa-telegram-plane::before,
.fa-brands.fa-telegram-plane::before {
  background-image: url("neworder/Telegram_auenof_okyvcv.webp");
}

/* theme has no local X logo asset, so use the existing twitter asset */
.fab.fa-x-twitter::before,
.fa-brands.fa-x-twitter::before,
.fab.fa-twitter::before,
.fa-brands.fa-twitter::before {
  background-image: url("neworder/Twitter_hkxnu1_nqrybn.webp");
}

.fab.fa-whatsapp::before,
.fa-brands.fa-whatsapp::before {
  background-image: url("neworder/whatsapp_26x26.webp");
}

/* make sure icon-only elements don't collapse */
.fa:not(.fa-spin),
.fas:not(.fa-spin),
.far:not(.fa-spin),
.fab:not(.fa-spin),
.fa-solid:not(.fa-spin),
.fa-brands:not(.fa-spin) {
  min-width: 1em;
  text-align: center;
}
