/* Fenek design tokens. Import once, globally. Sora is self-hosted from ./fonts (SIL OFL, fonts/OFL.txt). */

@font-face {
  font-family: "Sora";
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url("./fonts/sora-latin-400-normal.woff2") format("woff2");
  unicode-range:
    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Sora";
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url("./fonts/sora-latin-ext-400-normal.woff2") format("woff2");
  unicode-range:
    U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: "Sora";
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url("./fonts/sora-latin-700-normal.woff2") format("woff2");
  unicode-range:
    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Sora";
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url("./fonts/sora-latin-ext-700-normal.woff2") format("woff2");
  unicode-range:
    U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  color-scheme: light;
  --fk-brand: #b3261e;
  --fk-brand-hover: #96201a;
  --fk-brand-soft: #fbe6e3;
  --fk-brand-on-soft: #8a1c16;
  --fk-on-brand: #ffffff;
  --fk-brand-text: #b3261e;
  --fk-cream: #fbf3ea;
  --fk-bg: #fbf6f1;
  --fk-surface: #ffffff;
  --fk-surface-muted: #f4eee7;
  --fk-ink: #1e1f22;
  --fk-muted: #5a5a60;
  --fk-line: #e6e1da;
  --fk-success: #1e7a4c;
  --fk-success-soft: #e2f3ea;
  --fk-waiting: #7a4f00;
  --fk-waiting-soft: #fff1d6;
  --fk-info: #1f5fa8;
  --fk-info-soft: #e3edf9;
  --fk-danger: #d92d20;
  --fk-danger-soft: #fee4e2;
  --fk-focus: #1f5fa8;
  --fk-switch-on: var(--fk-success);
  --fk-switch-on-knob: var(--fk-surface);
  --fk-radius-sm: 6px;
  --fk-radius-md: 10px;
  --fk-radius-lg: 14px;
  --fk-radius-xl: 20px;
  --fk-radius-full: 999px;
  --fk-space-0: 0px;
  --fk-space-1: 4px;
  --fk-space-2: 8px;
  --fk-space-3: 12px;
  --fk-space-4: 16px;
  --fk-space-5: 20px;
  --fk-space-6: 24px;
  --fk-space-8: 32px;
  --fk-space-10: 40px;
  --fk-space-12: 48px;
  --fk-space-16: 64px;
  --fk-font-sans: "Sora", "Helvetica Neue", Arial, sans-serif;
  --fk-text-xs: 12px;
  --fk-text-sm: 14px;
  --fk-text-md: 15px;
  --fk-text-lg: 18px;
  --fk-text-xl: 22px;
  --fk-text-2xl: 28px;
  --fk-text-3xl: 36px;
  --fk-text-4xl: 48px;
  --fk-leading-tight: 1.15;
  --fk-leading-normal: 1.5;
  --fk-shadow-sm: 0 1px 2px rgba(30, 31, 34, 0.06);
  --fk-shadow-md: 0 4px 16px rgba(30, 31, 34, 0.08);
}

/*
 * theme.js sets data-theme from the choice saved on this device or the system setting; without it the page is light.
 * Inside .fk-night (the landing page's header and hero) the dark values apply whatever the theme.
 */
:root[data-theme="dark"],
.fk-night {
  color-scheme: dark;
  --fk-brand: #b3261e;
  --fk-brand-hover: #c7362d;
  --fk-brand-soft: #3a1d1b;
  --fk-brand-on-soft: #f5b5ae;
  --fk-on-brand: #ffffff;
  --fk-brand-text: #f08378;
  --fk-cream: #fbf3ea;
  --fk-bg: #17181b;
  --fk-surface: #202226;
  --fk-surface-muted: #2a2c31;
  --fk-ink: #f3eee8;
  --fk-muted: #a9a6a2;
  --fk-line: #34363c;
  --fk-success: #5fd39a;
  --fk-success-soft: #143324;
  --fk-waiting: #f5c565;
  --fk-waiting-soft: #3a2c0e;
  --fk-info: #8ab8f0;
  --fk-info-soft: #152a45;
  --fk-danger: #ff8a80;
  --fk-danger-soft: #43191a;
  --fk-focus: #8ab8f0;
  --fk-switch-on: var(--fk-ink);
  --fk-switch-on-knob: var(--fk-bg);
}