/* Sets global design tokens for those using this independently. `--k-font-family` is the shorthand `@kesko/tokens` also emits. */
:root {
  --k-font-family-sans: "SkattaSansUI", "SkattaSansUI-fallback", system-ui, sans-serif;
  --k-font-family: var(--k-font-family-sans);
}

/* Custom fallback font based on a local font
   See: https://arielsalminen.com/2025/optimizing-webfont-performance/ */
@font-face {
  font-family: SkattaSansUI-fallback;
  font-weight: 400;
  size-adjust: 101.17%;
  ascent-override: 84.01%;
  descent-override: 14.83%;
  line-gap-override: 43.09%;
  src: local("Arial");
}

@font-face {
  font-family: SkattaSansUI-fallback;
  font-weight: 500;
  size-adjust: 103.92%;
  ascent-override: 81.8%;
  descent-override: 14.43%;
  line-gap-override: 41.96%;
  src: local("Arial");
}

@font-face {
  font-family: SkattaSansUI-fallback;
  font-weight: 700;
  size-adjust: 98.12%;
  ascent-override: 86.63%;
  descent-override: 15.29%;
  line-gap-override: 44.44%;
  src: local("Arial Bold");
}

@font-face {
  font-family: SkattaSansUI-fallback;
  font-weight: 900;
  size-adjust: 101.09%;
  ascent-override: 84.08%;
  descent-override: 14.84%;
  line-gap-override: 43.13%;
  src: local("Arial Bold");
}

/* Rest of the imports */
@font-face {
  font-family: SkattaSansUI;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src:
    url("SkattaSansUI_TT-Regular.woff2") format("woff2"),
    url("SkattaSansUI_TT-Regular.woff") format("woff");
}

@font-face {
  font-family: SkattaSansUI;
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src:
    url("SkattaSansUI_TT-RegularItalic.woff2") format("woff2"),
    url("SkattaSansUI_TT-RegularItalic.woff") format("woff");
}

@font-face {
  font-family: SkattaSansUI;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src:
    url("SkattaSansUI_TT-Medium.woff2") format("woff2"),
    url("SkattaSansUI_TT-Medium.woff") format("woff");
}

@font-face {
  font-family: SkattaSansUI;
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src:
    url("SkattaSansUI_TT-MediumItalic.woff2") format("woff2"),
    url("SkattaSansUI_TT-MediumItalic.woff") format("woff");
}

@font-face {
  font-family: SkattaSansUI;
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src:
    url("SkattaSansUI_TT-Bold.woff2") format("woff2"),
    url("SkattaSansUI_TT-Bold.woff") format("woff");
}

@font-face {
  font-family: SkattaSansUI;
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src:
    url("SkattaSansUI_TT-Black.woff2") format("woff2"),
    url("SkattaSansUI_TT-Black.woff") format("woff");
}

@font-face {
  font-family: SkattaSansUI;
  font-style: normal;
  font-weight: 700;
  font-stretch: condensed;
  font-display: swap;
  src:
    url("SkattaSansUI_TT-BoldNarrow.woff2") format("woff2"),
    url("SkattaSansUI_TT-BoldNarrow.woff") format("woff");
}

@font-face {
  font-family: SkattaSansUI;
  font-style: normal;
  font-weight: 900;
  font-stretch: condensed;
  font-display: swap;
  src:
    url("SkattaSansUI_TT-BlackNarrow.woff2") format("woff2"),
    url("SkattaSansUI_TT-BlackNarrow.woff") format("woff");
}