/**
 * Font Optimization CSS
 * Improves font loading performance and reduces layout shifts
 */

/* Bootstrap Icons - Override font-display to swap */
@font-face {
  font-family: 'bootstrap-icons';
  font-display: swap;
  /* Font URLs will be inherited from bootstrap-icons.min.css */
}

/* Reserve space for Bootstrap Icons to prevent layout shift */
.bi::before,
[class*=" bi-"]::before,
[class^="bi-"]::before {
  /* Reserve inline-block space for icons */
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -0.125em;
}

/* FontAwesome fallback - Add font metrics for swap */
@font-face {
  font-family: 'Font Awesome 6 Free';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  /* Define ascent/descent to minimize layout shift during font swap */
  ascent-override: 100%;
  descent-override: 20%;
  line-gap-override: normal;
}

/* Fallback for icons using system fonts during font loading */
.fa-solid,
.fas {
  font-display: swap;
}

/* Reserve space for common icon sizes */
.fa-solid::before,
.fas::before {
  display: inline-block;
  min-width: 1em;
  text-align: center;
}
