/*
 * Self-hosted SF Pro (Display + Text) — ship với theme.
 * Source: wp-content/themes/flatsome-child/assets/fonts/sf-pro-display/sf-pro/
 *
 * Apply site-wide via the body rule at bottom — overrides Flatsome's
 * "Default Browser Font-Family" Customizer setting. Editor muốn dùng font
 * khác → set Customizer → override cascade.
 */

/* ---------- SF Pro Display ---------- */

@font-face {
  font-family: "SF Pro Display";
  src: url("../fonts/sf-pro-display/sf-pro/SF-Pro-Display/sf-pro-display_thin.woff2") format("woff2");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../fonts/sf-pro-display/sf-pro/SF-Pro-Display/sf-pro-display_ultralight.woff2") format("woff2");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../fonts/sf-pro-display/sf-pro/SF-Pro-Display/sf-pro-display_light.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../fonts/sf-pro-display/sf-pro/SF-Pro-Display/sf-pro-display_regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../fonts/sf-pro-display/sf-pro/SF-Pro-Display/sf-pro-display_medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../fonts/sf-pro-display/sf-pro/SF-Pro-Display/sf-pro-display_semibold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Display";
  src: url("../fonts/sf-pro-display/sf-pro/SF-Pro-Display/sf-pro-display_bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* ---------- SF Pro Text ---------- */

@font-face {
  font-family: "SF Pro Text";
  src: url("../fonts/sf-pro-display/sf-pro/SF-Pro-Text/sf-pro-text_thin.woff2") format("woff2");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Text";
  src: url("../fonts/sf-pro-display/sf-pro/SF-Pro-Text/sf-pro-text_regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Text";
  src: url("../fonts/sf-pro-display/sf-pro/SF-Pro-Text/sf-pro-text_regular-italic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Text";
  src: url("../fonts/sf-pro-display/sf-pro/SF-Pro-Text/sf-pro-text_semibold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF Pro Text";
  src: url("../fonts/sf-pro-display/sf-pro/SF-Pro-Text/sf-pro-text_bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* ---------- Apply site-wide ----------
   High specificity (html body) to beat Flatsome's body rule; !important
   not used because body rule in flatsome.css is also 1-selector specificity. */

html body {
  font-family: "SF Pro Display", "SF Pro Text", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}