/**
 * Do not edit directly
 * Generated on Mon, 28 Oct 2024 14:24:14 GMT
 */

$color-brand-snohvit: #f9f9f9;
$color-brand-varde: #e0dbd4;
$color-brand-granitt: #1b1917;
$color-brand-hvit: #ffffff;
$color-brand-svart: #000000;
$color-brand-skifer: #313030;
$color-brand-fjellgra: #444141;
$color-brand-stein: #636060;
$color-brand-svaberg: #c8c5c3;
$color-brand-dis: #ece9e5;
$color-brand-sand: #f4f2ef;
$color-functional-info: #d3d3f6;
$color-functional-info-dark: #a9a9ca;
$color-functional-success: #acd3b5;
$color-functional-success-dark: #94b79b;
$color-functional-warning: #efdd9e;
$color-functional-warning-dark: #decc8d;
$color-functional-error: #f6b3b3;
$color-functional-error-dark: #de9e9e;
$spacing-0: 0;
$spacing-2: 0.125rem;
$spacing-4: 0.25rem;
$spacing-8: 0.5rem;
$spacing-12: 0.75rem;
$spacing-16: 1rem;
$spacing-24: 1.5rem;
$spacing-32: 2rem;
$spacing-40: 2.5rem;
$spacing-64: 4rem;
$spacing-104: 6.5rem;
$spacing-168: 10.5rem;
$icon-weight-normal: 300;
$icon-weight-bold: 500;
$typography-weight-normal: 400;
$typography-weight-bold: 700;
$typography-font-size-16: 1rem;
$typography-font-size-18: 1.125rem;
$typography-font-size-20: 1.25rem;
$typography-font-size-21: 1.3125rem;
$typography-font-size-23: 1.4375rem;
$typography-font-size-25: 1.5625rem;
$typography-font-size-26: 1.625rem;
$typography-font-size-28: 1.75rem;
$typography-font-size-30: 1.875rem;
$typography-font-size-36: 2.25rem;
$typography-font-size-44: 2.75rem;
$typography-font-size-56: 3.5rem;
$typography-line-height-24: 1.5rem;
$typography-line-height-28: 1.75rem;
$typography-line-height-32: 2rem;
$typography-line-height-36: 2.25rem;
$typography-line-height-40: 2.5rem;
$typography-line-height-44: 2.75rem;
$typography-line-height-52: 3.25rem;
$typography-line-height-64: 4rem;
$typography-title-small-font-size: 2.25rem;
$typography-title-small-line-height: 2.75rem;
$typography-title-small-font-weight: 400;
$typography-title-base-font-size: 3.5rem;
$typography-title-base-line-height: 4rem;
$typography-title-base-font-weight: 400;
$typography-title-small-small-font-size: 1.875rem;
$typography-title-small-small-line-height: 2.25rem;
$typography-title-small-small-font-weight: 400;
$typography-title-small-base-font-size: 2.75rem;
$typography-title-small-base-line-height: 3.25rem;
$typography-title-small-base-font-weight: 400;
$typography-heading-1-small-font-size: 1.625rem;
$typography-heading-1-small-line-height: 2rem;
$typography-heading-1-small-font-weight: 400;
$typography-heading-1-base-font-size: 2.25rem;
$typography-heading-1-base-line-height: 2.75rem;
$typography-heading-1-base-font-weight: 400;
$typography-heading-2-small-font-size: 1.4375rem;
$typography-heading-2-small-line-height: 2rem;
$typography-heading-2-small-font-weight: 400;
$typography-heading-2-base-font-size: 1.75rem;
$typography-heading-2-base-line-height: 2.5rem;
$typography-heading-2-base-font-weight: 400;
$typography-heading-3-small-font-size: 1.3125rem;
$typography-heading-3-small-line-height: 1.75rem;
$typography-heading-3-small-font-weight: 700;
$typography-heading-3-base-font-size: 1.5625rem;
$typography-heading-3-base-line-height: 2rem;
$typography-heading-3-base-font-weight: 700;
$typography-heading-4-small-font-size: 1.125rem;
$typography-heading-4-small-line-height: 1.5rem;
$typography-heading-4-small-font-weight: 700;
$typography-heading-4-base-font-size: 1.3125rem;
$typography-heading-4-base-line-height: 1.75rem;
$typography-heading-4-base-font-weight: 700;
$typography-heading-5-small-font-size: 1rem;
$typography-heading-5-small-line-height: 1.5rem;
$typography-heading-5-small-font-weight: 700;
$typography-heading-5-base-font-size: 1rem;
$typography-heading-5-base-line-height: 1.5rem;
$typography-heading-5-base-font-weight: 700;
$typography-body-small-font-size: 1.125rem;
$typography-body-small-line-height: 1.75rem;
$typography-body-small-font-weight: 400;
$typography-body-base-font-size: 1.25rem;
$typography-body-base-line-height: 2rem;
$typography-body-base-font-weight: 400;
$typography-small-small-font-size: 1rem;
$typography-small-small-line-height: 1.5rem;
$typography-small-small-font-weight: 400;
$typography-small-base-font-size: 1rem;
$typography-small-base-line-height: 1.5rem;
$typography-small-base-font-weight: 400;

// Dynamiske variabler for farge, via referanse til CSS-variabler
$color-background-page: var(--jkl-color-background-page);
$color-background-page-variant: var(--jkl-color-background-page-variant);
$color-background-container: var(--jkl-color-background-container);
$color-background-container-low: var(--jkl-color-background-container-low);
$color-background-container-high: var(--jkl-color-background-container-high);
$color-background-container-inverted: var(
    --jkl-color-background-container-inverted
);
$color-background-container-subdued: var(
    --jkl-color-background-container-subdued
);
$color-background-input-base: var(--jkl-color-background-input-base);
$color-background-input-focus: var(--jkl-color-background-input-focus);
$color-background-action: var(--jkl-color-background-action);
$color-background-interactive: var(--jkl-color-background-interactive);
$color-background-interactive-hover: var(
    --jkl-color-background-interactive-hover
);
$color-background-interactive-selected: var(
    --jkl-color-background-interactive-selected
);
$color-background-alert-neutral: var(--jkl-color-background-alert-neutral);
$color-background-alert-info: var(--jkl-color-background-alert-info);
$color-background-alert-success: var(--jkl-color-background-alert-success);
$color-background-alert-warning: var(--jkl-color-background-alert-warning);
$color-background-alert-error: var(--jkl-color-background-alert-error);
$color-text-default: var(--jkl-color-text-default);
$color-text-subdued: var(--jkl-color-text-subdued);
$color-text-inverted: var(--jkl-color-text-inverted);
$color-text-on-action: var(--jkl-color-text-on-action);
$color-text-interactive: var(--jkl-color-text-interactive);
$color-text-interactive-hover: var(--jkl-color-text-interactive-hover);
$color-text-on-alert: var(--jkl-color-text-on-alert);
$color-text-on-alert-subdued: var(--jkl-color-text-on-alert-subdued);
$color-border-action: var(--jkl-color-border-action);
$color-border-input: var(--jkl-color-border-input);
$color-border-input-focus: var(--jkl-color-border-input-focus);
$color-border-separator: var(--jkl-color-border-separator);
$color-border-separator-strong: var(--jkl-color-border-separator-strong);
$color-border-separator-hover: var(--jkl-color-border-separator-hover);
$color-border-subdued: var(--jkl-color-border-subdued);