:root {
  --farg-bakgrund: #ffffff;
  --farg-yta: #f5f5f5;
  --farg-text: #1a1a1a;
  --farg-text-diskret: #595959;
  --farg-accent: #1f4e79;
  --farg-accent-text: #ffffff;
  --farg-kant: #767676;
  --farg-fel: #b00020;
  --farg-text-diskret-yta: #595959;
  --farg-accent-yta: #1f4e79;
  --farg-primar: #1f4e79;
  --farg-primar-text: #ffffff;
  --farg-knapp-yta: #f5f5f5;
  --farg-knapp-text: #1a1a1a;
  --farg-knapp-kant: #1a1a1a;
  --farg-sidomeny: #f5f5f5;
  --farg-sidomeny-text: #1a1a1a;
  --farg-sidomeny-diskret: #595959;
  --farg-sidomeny-aktiv: #1f4e79;
  --farg-sidomeny-aktiv-text: #ffffff;
  --farg-sidomeny-markor: #1f4e79;
  --farg-sidomeny-kant: #767676;
  --farg-sidomeny-vald: #1f4e79;
  --farg-sidomeny-vald-text: #ffffff;
  --farg-sidomeny-vald-ikon: #ffffff;
  --farg-citat: #ffffff;
  --farg-bricka: #ffffff;
  --farg-bricka-djup: #ffffff;
  --farg-ikon-yta: #1a1a1a;
  --farg-ikon-yta-text: #ffffff;
  --farg-status-klar: #1a1a1a;
  --farg-status-klar-text: #ffffff;
  --farg-status-lyckad: #ffffff;
  --farg-status-lyckad-text: #1a1a1a;
  --farg-status-neutral: #ffffff;
  --farg-status-neutral-text: #1a1a1a;
  --farg-status-vantar: #ffffff;
  --farg-status-vantar-text: #1a1a1a;
  --farg-status-fel: #ffffff;
  --farg-status-fel-text: #b00020;
  --farg-falt: #ffffff;
  --farg-falt-kant: #767676;
  --farg-avatar: #1f4e79;
  --farg-avatar-text: #ffffff;
  --farg-stapel-tom: #767676;
  --farg-vantar-yta: #1a1a1a;
  --rundning: 6px;
  --typsnitt: system-ui, sans-serif;
  --typsnitt-rubrik: system-ui, sans-serif;
  --typsnitt-kod: monospace;
}
@media (prefers-color-scheme: dark) {
  :root {
    --farg-bakgrund: #121212;
    --farg-yta: #1e1e1e;
    --farg-text: #f2f2f2;
    --farg-text-diskret: #b3b3b3;
    --farg-accent: #8ab4f8;
    --farg-accent-text: #0b0b0b;
    --farg-kant: #8a8a8a;
    --farg-fel: #ff8a80;
    --farg-text-diskret-yta: #b3b3b3;
    --farg-accent-yta: #8ab4f8;
    --farg-primar: #8ab4f8;
    --farg-primar-text: #0b0b0b;
    --farg-knapp-yta: #1e1e1e;
    --farg-knapp-text: #f2f2f2;
    --farg-knapp-kant: #f2f2f2;
    --farg-sidomeny: #1e1e1e;
    --farg-sidomeny-text: #f2f2f2;
    --farg-sidomeny-diskret: #b3b3b3;
    --farg-sidomeny-aktiv: #8ab4f8;
    --farg-sidomeny-aktiv-text: #0b0b0b;
    --farg-sidomeny-markor: #8ab4f8;
    --farg-sidomeny-kant: #8a8a8a;
    --farg-sidomeny-vald: #8ab4f8;
    --farg-sidomeny-vald-text: #0b0b0b;
    --farg-sidomeny-vald-ikon: #0b0b0b;
    --farg-citat: #121212;
    --farg-bricka: #121212;
    --farg-bricka-djup: #121212;
    --farg-ikon-yta: #f2f2f2;
    --farg-ikon-yta-text: #121212;
    --farg-status-klar: #f2f2f2;
    --farg-status-klar-text: #121212;
    --farg-status-lyckad: #121212;
    --farg-status-lyckad-text: #f2f2f2;
    --farg-status-neutral: #121212;
    --farg-status-neutral-text: #f2f2f2;
    --farg-status-vantar: #121212;
    --farg-status-vantar-text: #f2f2f2;
    --farg-status-fel: #121212;
    --farg-status-fel-text: #ff8a80;
    --farg-falt: #121212;
    --farg-falt-kant: #8a8a8a;
    --farg-avatar: #8ab4f8;
    --farg-avatar-text: #0b0b0b;
    --farg-stapel-tom: #8a8a8a;
    --farg-vantar-yta: #f2f2f2;
    --ikon-filter: invert(1);
  }
}