:root {
  /* Fonts */
  --ui-font-family-sans-serif: 'Frutiger Neue', 'Arial', sans-serif;
  --ui-font-family-handwriting: 'Ego', 'Frutiger Neue', 'Arial', sans-serif;
  --ui-font-weight-normal: 400;
  --ui-font-weight-bold: 600;
  --ui-font-size-base: 16;
  --ui-font-line-height-base: 24;

  /* Colors */
  --ui-color-blue-100: #ecf0f9;
  --ui-color-blue-200: #e0e9f3;
  --ui-color-blue-300: #c8d5e7;
  --ui-color-blue-400: #99abd0;
  --ui-color-blue-500: #466daf;
  --ui-color-blue-600: #00358e;
  --ui-color-blue-700: #132c64;
  --ui-color-blue-750: #0b2351;
  --ui-color-blue-800: #051530;
  --ui-color-green-100: #b6dfaa;
  --ui-color-green-200: #8ed082;
  --ui-color-green-300: #6cc254;
  --ui-color-green-400: #2d9d00;
  --ui-color-green-500: #429332;
  --ui-color-green-600: #316f24;
  --ui-color-green-700: #215725;
  --ui-color-green-800: #19411b;
  --ui-color-grey-100: #f6f6f6;
  --ui-color-grey-200: #e9e9e9;
  --ui-color-grey-300: #dadada;
  --ui-color-grey-400: #c3c3c3;
  --ui-color-grey-500: #aeaeae;
  --ui-color-grey-600: #888;
  --ui-color-grey-700: #6b6b6b;
  --ui-color-grey-800: #515151;
  --ui-color-turquoise-100: #bde0e0;
  --ui-color-turquoise-200: #a0d2d1;
  --ui-color-turquoise-300: #72b8bc;
  --ui-color-turquoise-400: #3ca4a4;
  --ui-color-turquoise-500: #008d92;
  --ui-color-turquoise-600: #236e6d;
  --ui-color-turquoise-700: #215d5c;
  --ui-color-turquoise-800: #194547;
  --ui-color-yellow-100: #ffeaa5;
  --ui-color-yellow-200: #ffe07a;
  --ui-color-yellow-300: #fed210;
  --ui-color-yellow-400: #e9be33;
  --ui-color-yellow-500: #d6ad31;
  --ui-color-yellow-600: #c89712;
  --ui-color-yellow-700: #ab812e;
  --ui-color-yellow-800: #8d6927;
  --ui-color-light-blue-100: #c7e6f8;
  --ui-color-light-blue-200: #a2d7f6;
  --ui-color-light-blue-300: #73c3f0;
  --ui-color-light-blue-400: #42aeec;
  --ui-color-light-blue-500: #1386dd;
  --ui-color-light-blue-600: #1a6cac;
  --ui-color-light-blue-700: #1e5c8d;
  --ui-color-light-blue-800: #21486d;
  --ui-color-violet-100: #f0eafb;
  --ui-color-violet-200: #e1d5f6;
  --ui-color-violet-300: #ccb6f1;
  --ui-color-violet-400: #b48ee7;
  --ui-color-violet-500: #9768de;
  --ui-color-violet-600: #873fd5;
  --ui-color-violet-700: #62359b;
  --ui-color-violet-800: #421e6c;
  --ui-color-lime-100: #e9eec1;
  --ui-color-lime-200: #d4e08d;
  --ui-color-lime-300: #bad71c;
  --ui-color-lime-400: #9fb638;
  --ui-color-lime-500: #8aa33d;
  --ui-color-lime-600: #74903e;
  --ui-color-lime-700: #597540;
  --ui-color-lime-800: #445d3a;
  --ui-color-highlight-yellow: #fed210;
  --ui-color-highlight-red: #e42444;
  --ui-color-traffic-light-green: #43b02a;
  --ui-color-traffic-light-yellow: #fed210;
  --ui-color-traffic-light-red: #e42444;
  --ui-color-risk-low: #017dc3;
  --ui-color-risk-moderate: #00a57d;
  --ui-color-risk-medium: #fff000;
  --ui-color-risk-high: #fa9b1e;
  --ui-color-risk-very-high: #f00;
  --ui-color-financial-group-blue: #0066b3;
  --ui-color-financial-group-orange: #f60;
  --ui-color-dark: #181818;
  /* stylelint-disable-next-line color-hex-length */
  --ui-color-white: #ffffff;

  /* Animation */
  --ui-animation-bezier: cubic-bezier(0.4, 0.03, 0.4, 0.97);

  /* Assignments */
  --ui-blue: var(--ui-color-blue-600);
  --ui-green: var(--ui-color-green-400);
  --ui-grey: var(--ui-color-grey-400);
  --ui-turquoise: var(--ui-color-turquoise-500);
  --ui-yellow: var(--ui-color-yellow-300);
  --ui-lightblue: var(--ui-color-light-blue-500);
  --ui-violet: var(--ui-color-violet-600);
  --ui-lime: var(--ui-color-lime-300);

  /* skin variables */
  --skin-color-primary: var(--ui-blue);
  --skin-color-primary-light: var(--ui-color-blue-500);
  --skin-color-primary-lighter: var(--ui-color-blue-100);
  --skin-color-primary-shade: var(--ui-color-blue-800);
  --skin-color-primary-inverted: var(--ui-color-white);
  --skin-color-primary-light-inverted: var(--ui-color-white);
  --skin-color-primary-shade-inverted: var(--ui-color-blue-400);
  --skin-color-accent: var(--ui-green);
  --skin-color-accent-light: var(--ui-color-green-300);
  --skin-color-accent-shade: var(--ui-color-green-500);
  --skin-color-accent-inverted: var(--ui-color-white);
  --skin-color-text: var(--ui-color-dark);
  --skin-color-text-inverted: var(--ui-color-white);
  --skin-color-white: var(--ui-color-white);
  --skin-color-secondary: var(--ui-grey);
  --skin-color-secondary-light: var(--ui-color-grey-200);
  --skin-color-secondary-lighter: var(--ui-color-grey-100);
  --skin-font-family-primary: var(--ui-font-family-sans-serif);
  --skin-font-family-accent: var(--ui-font-family-handwriting);
  --skin-font-size-base: var(--ui-font-size-base);
  --component-pill-color: var(--ui-color-blue-600);
  --component-pill-border-color: var(--ui-color-blue-600);
  --component-pill-outline-color: var(--ui-color-blue-600);
  --component-pill-color-active: var(--ui-color-blue-750);
  --component-pill-background-color-active: var(--ui-color-blue-750);

  /* current variables */
  --current-color-primary: var(--skin-color-primary);
  --current-color-primary-inverted: var(--skin-color-primary-inverted);
  --current-color-primary-light: var(--skin-color-primary-light);
  --current-color-primary-light-inverted: var(
    --skin-color-primary-light-inverted
  );
  --current-color-primary-shade: var(--skin-color-primary-shade);
  --current-color-primary-shade-inverted: var(
    --skin-color-primary-shade-inverted
  );
  --current-color-accent: var(--skin-color-accent);
  --current-color-text: var(--skin-color-text);
  --current-color-inverted: var(--skin-color-text-inverted);
}