:root {
    --wpe-font-family: Lato, sans-serif;
}

@font-face {
    font-family: Lato;
    src: url("https://fonts.locaware.one/Lato/light.ttf");
    font-weight: 300;
    font-style: normal;
    ascent-override: 100%;
}

@font-face {
    font-family: Lato;
    src: url("https://fonts.locaware.one/Lato/regular.ttf");
    font-weight: normal;
    font-style: normal;
    ascent-override: 100%;
}

@font-face {
    font-family: Lato;
    src: url("https://fonts.locaware.one/Lato/medium.ttf");
    font-weight: 500;
    font-style: normal;
    ascent-override: 100%;
}

@font-face {
    font-family: Lato;
    src: url("https://fonts.locaware.one/Lato/bold.ttf");
    font-weight: bold;
    font-style: normal;
    ascent-override: 100%;
}

:root {
    --env-label-background-color: rgba(255, 255, 255, 1);
    --env-label-border-color: rgba(255, 162, 0, 1);
    --loading-background-color: rgba(255, 255, 255, 1);
    --loading-text-color: rgba(42, 42, 42, 1);
    --loading-font: Lato, sans-serif;
    --loading-text-size: 18px;
    --loading-line-height: 24px;
    --loading-info-size: 10px;
    --loading-info-color: rgba(113, 113, 113, 1);
}
 
 /* Variables  */
 :root {
  --color-black-black-100: rgba(0, 0, 0, 1);
  --color-black-black-5: rgba(0, 0, 0, 0.05);
  --color-black-black-4: rgba(0, 0, 0, 0.04);
  --color-black-black-10: rgba(0, 0, 0, 0.1);
  --color-black-black-15: rgba(0, 0, 0, 0.15);
  --color-black-black-20: rgba(0, 0, 0, 0.2);
  --color-black-black-25: rgba(0, 0, 0, 0.25);
  --color-black-black-35: rgba(0, 0, 0, 0.35);
  --color-black-black-50: rgba(0, 0, 0, 0.5);
  --color-black-black-60: rgba(0, 0, 0, 0.6);
  --color-white-white-100: rgba(255, 255, 255, 1);
  --color-white-white-5: rgba(255, 255, 255, 0.05);
  --color-white-white-15: rgba(255, 255, 255, 0.15);
  --color-white-white-25: rgba(255, 255, 255, 0.25);
  --color-white-white-35: rgba(255, 255, 255, 0.35);
  --color-white-white-50: rgba(255, 255, 255, 0.5);
  --color-white-white-75: rgba(255, 255, 255, 0.75);
  --color-white-white-85: rgba(255, 255, 255, 0.85);
  --color-white-white-90: rgba(255, 255, 255, 0.9);
  --color-signal-colors-red-signal-100: rgba(224, 0, 0, 1);
  --color-signal-colors-red-signal-10: rgba(224, 0, 0, 0.1);
  --color-signal-colors-red-signal-15: rgba(224, 0, 0, 0.15);
  --color-signal-colors-red-signal-20: rgba(224, 0, 0, 0.2);
  --color-signal-colors-red-signal-25: rgba(224, 0, 0, 0.25);
  --color-signal-colors-red-signal-50: rgba(224, 0, 0, 0.5);
  --color-signal-colors-green-signal-100: rgba(0, 163, 33, 1);
  --color-signal-colors-green-signal-5: rgba(0, 163, 33, 0.05);
  --color-signal-colors-green-signal-10: rgba(0, 163, 33, 0.1);
  --color-signal-colors-green-signal-15: rgba(0, 163, 33, 0.15);
  --color-signal-colors-green-signal-25: rgba(0, 163, 33, 0.25);
  --color-signal-colors-green-signal-35: rgba(0, 163, 33, 0.35);
  --color-signal-colors-green-signal-50: rgba(0, 163, 33, 0.5);
  --color-signal-colors-yellow-signal-10: rgba(255, 162, 0, 0.1);
  --color-signal-colors-yellow-signal-100: rgba(255, 162, 0, 1);
  --color-blue-active-focus-500: rgba(0, 102, 204, 1);
  --color-blue-active-focus-800: rgba(170, 204, 238, 1);
  --color-blue-active-focus-700: rgba(113, 170, 226, 1);
  --color-blue-active-focus-600: rgba(56, 136, 215, 1);
  --color-blue-active-focus-250: rgba(0, 45, 90, 1);
  --color-signal-colors-red-signal-3: rgba(224, 0, 0, 0.03);
  --color-black-black-75: rgba(0, 0, 0, 0.75);
  --color-white-white-10: rgba(255, 255, 255, 0.1);
  --color-white-white-20: rgba(255, 255, 255, 0.2);
  --color-signal-colors-red-signal-on-dark: rgba(243, 153, 153, 1);
  --font-size-text-xxs: 10px;
  --font-size-text-xs: 11px;
  --font-size-text-s: 12px;
  --font-size-text-m: 14px;
  --font-size-text-l: 16px;
  --font-size-text-xl: 18px;
  --font-size-title-s: 20px;
  --font-size-title-m: 22px;
  --font-size-title-l: 24px;
  --font-size-title-xl: 32px;
  --font-size-title-xxl: 40px;
  --font-line-height-text-xxs: 12px;
  --font-line-height-text-xs: 16px;
  --font-line-height-text-s: 16px;
  --font-line-height-text-m: 20px;
  --font-line-height-text-l: 24px;
  --font-line-height-text-xl: 24px;
  --font-line-height-title-s: 24px;
  --font-line-height-title-m: 28px;
  --font-line-height-title-l: 32px;
  --font-line-height-title-xl: 40px;
  --font-line-height-title-xxl: 48px;
  --color-black-black-85: rgba(0, 0, 0, 0.85);
  --radius-button-pill: 28px;
  --radius-button-rectangle: 0px;
  --radius-button-rectangle-plus4px: 4px;
  --color-white-white-65: rgba(255, 255, 255, 0.65);
  --color-white-white-0: rgb(255, 255, 255);
  --color-greys-grey-950: rgba(250, 250, 250, 1);
  --color-greys-grey-900: rgba(240, 240, 240, 1);
  --color-greys-grey-850: rgba(226, 226, 226, 1);
  --color-greys-grey-800: rgba(212, 212, 212, 1);
  --color-greys-grey-750: rgba(198, 198, 198, 1);
  --color-greys-grey-700: rgba(184, 184, 184, 1);
  --color-greys-grey-650: rgba(170, 170, 170, 1);
  --color-greys-grey-600: rgba(156, 156, 156, 1);
  --color-greys-grey-550: rgba(142, 142, 142, 1);
  --color-greys-grey-500: rgba(128, 128, 128, 1);
  --color-greys-grey-450: rgba(113, 113, 113, 1);
  --color-greys-grey-400: rgba(99, 99, 99, 1);
  --color-greys-grey-350: rgba(85, 85, 85, 1);
  --color-greys-grey-300: rgba(71, 71, 71, 1);
  --color-greys-grey-250: rgba(56, 56, 56, 1);
  --color-greys-grey-200: rgba(42, 42, 42, 1);
  --color-greys-grey-150: rgba(28, 28, 28, 1);
  --color-greys-grey-100: rgba(14, 14, 14, 1);
  --color-greys-grey-50: rgba(7, 7, 7, 1);
  --color-primitives-brand-950: rgba(250, 250, 250, 1);
  --color-primitives-brand-900: rgba(240, 240, 240, 1);
  --color-primitives-brand-850: rgba(226, 226, 226, 1);
  --color-primitives-brand-800: rgba(212, 212, 212, 1);
  --color-primitives-brand-750: rgba(198, 198, 198, 1);
  --color-primitives-brand-700: rgba(184, 184, 184, 1);
  --color-primitives-brand-650: rgba(170, 170, 170, 1);
  --color-primitives-brand-600: rgba(156, 156, 156, 1);
  --color-primitives-brand-550: rgba(142, 142, 142, 1);
  --color-primitives-brand-500: rgba(128, 128, 128, 1);
  --color-primitives-brand-450: rgba(113, 113, 113, 1);
  --color-primitives-brand-400: rgba(99, 99, 99, 1);
  --color-primitives-brand-350: rgba(85, 85, 85, 1);
  --color-primitives-brand-300: rgba(71, 71, 71, 1);
  --color-primitives-brand-250: rgba(56, 56, 56, 1);
  --color-primitives-brand-200: rgba(42, 42, 42, 1);
  --color-primitives-brand-150: rgba(28, 28, 28, 1);
  --color-primitives-brand-100: rgba(14, 14, 14, 1);
  --color-primitives-brand-50: rgba(7, 7, 7, 1);
  --spacing-spacing-vertical-adj-text-top: 0px;
  --color-category-colors-category-purple: rgba(112, 0, 198, 1);
  --color-category-colors-category-grey: rgba(149, 149, 149, 1);
  --color-category-colors-category-green: rgba(0, 161, 45, 1);
  --color-category-colors-category-purple-light: rgba(191, 107, 255, 1);
  --color-category-colors-category-grey-light: rgba(202, 202, 202, 1);
  --color-category-colors-category-green-light: rgba(128, 208, 150, 1);
  --color-category-colors-category-blue: rgba(21, 109, 241, 1);
  --color-category-colors-category-blue-light: rgba(122, 169, 239, 1);
  --color-greys-grey-925: rgba(245, 245, 245, 1);
  --spacing-spacing-vertical-adj-text-bot: 0px;
  --color-primitives-brand-975: rgba(250, 251, 254, 1);
  --color-primitives-brand-925: rgba(227, 233, 249, 1);
  --color-signal-colors-signal-green-350: rgba(0, 108, 22, 1);
  --color-primitives-transparent-brand-500-50: rgba(11, 65, 205, 0.5);
  --color-primitives-transparent-brand-500-65: rgba(11, 65, 205, 0.65);
  --color-primitives-transparent-brand-500-85: rgba(11, 65, 205, 0.85);
  --color-primitives-transparent-brand-950-65: rgba(241, 244, 252, 0.65);
  --color-primitives-transparent-brand-800-65: rgba(241, 244, 252, 0.65);
  --color-primitives-transparent-brand-900-65: rgba(241, 244, 252, 0.65);
  --color-primitives-brand-250-2: rgba(4, 28, 91, 1);
  --color-primitives-transparent-brand-250-75: rgba(4, 28, 91, 0.75);
  --spacing-spacing-test-vertical-adj-text-bot: 5px;
  --color-blue-active-focus-900: rgba(212, 229, 246, 1);
  --color-primitives-transparent-brand-500-5: rgba(11, 65, 205, 0.05);
  --color-signal-colors-yellow-signal-25: rgba(255, 162, 0, 0.25);
  --color-primitives-transparent-brand-500-10: rgba(11, 65, 205, 0.1);
  --color-primitives-transparent-brand-800-25: rgba(241, 244, 252, 0.25);
  --color-primitives-brand-300-2: rgba(6, 36, 113, 1);
  --color-primitives-transparent-brand-300-50: rgba(6, 36, 113, 0.5);
  --color-blue-active-focus-400: rgba(0, 79, 158, 1);
  --color-blue-active-focus-300: rgba(0, 56, 113, 1);
  --color-blue-active-focus-200: rgba(0, 34, 68, 1);
  --color-blue-active-focus-850: rgba(198, 221, 243, 1);
  --color-blue-active-focus-825: rgba(184, 212, 240, 1);
  --color-blue-active-focus-750: rgba(141, 187, 232, 1);
  --color-signal-colors-red-signal-40: rgba(224, 0, 0, 0.4);
  --color-signal-colors-green-signal-40: rgba(0, 163, 33, 0.4);
  --color-signal-colors-yellow-signal-40: rgba(255, 162, 0, 0.4);
  --color-signal-colors-yellow-signal-15: rgba(255, 162, 0, 0.15);
}

 /* Aliases  */
 :root {
  --color-semantic-background-disabled: var(--color-greys-grey-850);
  --color-semantic-icon-disabled: var(--color-greys-grey-750);
  --color-semantic-text-disabled: var(--color-greys-grey-600);
  --color-semantic-background-active: var(--color-primitives-brand-900);
  --color-semantic-stroke-disabled: var(--color-greys-grey-850);
  --color-semantic-stroke-default: var(--color-greys-grey-850);
  --color-semantic-background-default: var(--color-white-white-100);
  --color-semantic-text-dark: var(--color-greys-grey-200);
  --color-semantic-stroke-hover: var(--color-greys-grey-600);
  --color-semantic-stroke-pressed: var(--color-greys-grey-300);
  --color-semantic-stroke-active: var(--color-primitives-brand-350);
  --color-semantic-stroke-error: var(--color-signal-colors-red-signal-100);
  --color-semantic-icon-brand-dark: var(--color-primitives-brand-250);
  --color-semantic-text-light: var(--color-greys-grey-450);
  --color-semantic-stroke-selectable: var(--color-greys-grey-700);
  --color-semantic-text-brand-dark: var(--color-primitives-brand-350);
  --color-semantic-background-brand-light: var(--color-primitives-brand-950);
  --color-semantic-text-medium: var(--color-greys-grey-300);
  --color-semantic-text-brand-light: var(--color-primitives-brand-900);
  --color-semantic-icon-brand-light: var(--color-primitives-brand-850);
  --color-semantic-background-brand-dark: var(--color-primitives-brand-350);
  --color-semantic-stroke-brand-default: var(--color-primitives-brand-500);
  --color-semantic-stroke-brand-dark: var(--color-primitives-brand-350);
  --color-semantic-icon-brand-default: var(--color-primitives-brand-500);
  --color-semantic-background-light-grey: var(--color-greys-grey-925);
  --color-semantic-stroke-light: var(--color-greys-grey-900);
  --color-semantic-background-lighter-grey: var(--color-greys-grey-950);
  --color-semantic-stroke-dark: var(--color-greys-grey-800);
  --color-semantic-background-brand-lighter: var(--color-primitives-brand-975);
  --color-semantic-text-signalgreen-dark: var(--color-signal-colors-signal-green-350);
  --color-semantic-background-brand-default: var(--color-primitives-brand-500);
  --color-semantic-stroke-brand-light: var(--color-primitives-brand-800);
  --color-semantic-text-light-dark-mode: var(--color-greys-grey-450);
  --color-semantic-text-medium-dark-mode: var(--color-greys-grey-300);
  --color-semantic-text-dark-dark-mode: var(--color-greys-grey-200);
  --color-semantic-text-white: var(--color-white-white-100);
  --color-semantic-icon-white: var(--color-white-white-100);
  --color-semantic-background-brand-darker: var(--color-primitives-brand-250);
  --color-semantic-stroke-brand-darker: var(--color-primitives-brand-350);
  --color-semantic-stroke-brand-lighter: var(--color-primitives-brand-850);
  --color-semantic-text-black: var(--color-black-black-100);
  --color-semantic-icon-black: var(--color-black-black-100);
  --color-semantic-background-medium-grey: var(--color-greys-grey-900);
}