$app-version: "3.1.6" !default;

//--------------global tokens--------------

//COLOURS//

//Blue
$blue-300: #00b1eb;
$blue-400: #008ecf;
$blue-600: #007faa;
$blue-700: #00506b;

// Pink
$pink-300: #ff0380;
$pink-400: #ea157f;
$pink-600: #d11372;
$pink-700: #ab0f5d;

// Purple
$purple-300: #e596fb;
$purple-400: #d34bf9;
$purple-600: #c200f8;
$purple-700: #9400bd;

// Orange
$orange-300: #ff752b;
$orange-400: #f37029;
$orange-600: #cb4f0b;
$orange-700: #993b09;

// Yellow
$yellow-300: #fbcb7d;
$yellow-400: #f9ac31;
$yellow-600: #a76905;
$yellow-700: #7d4f04;

// Green
$green-300: #a0c940;
$green-400: #95bc3d;
$green-600: #657f29;
$green-700: #4c5f1f;

// Grey
$grey-300: #f5f5f5;
$grey-400: #848083;
$grey-600: #4a4a4a;
$grey-700: #333333;

$white: #ffffff;

//--------------alias tokens----------

// COLLOURS //

//Clickable
$color-clickable-300: $blue-300;
$color-clickable-400: $blue-400;
$color-clickable-600: $blue-600;
$color-clickable-700: $blue-700;

// Highlight
$color-highlight-300: $pink-300;
$color-highlight-400: $pink-400;
$color-highlight-600: $pink-600;
$color-highlight-700: $pink-700;

// Data
$color-data-300: $purple-300;
$color-data-400: $purple-400;
$color-data-600: $purple-600;
$color-data-700: $purple-700;

// Alert
$color-alert-300: $orange-300;
$color-alert-400: $orange-400;
$color-alert-600: $orange-600;
$color-alert-700: $orange-700;

// Value
$color-value-300: $yellow-300;
$color-value-400: $yellow-400;
$color-value-600: $yellow-600;
$color-value-700: $yellow-700;

// Success
$color-success-300: $green-300;
$color-success-400: $green-400;
$color-success-600: $green-600;
$color-success-700: $green-700;

// Neutral
$color-neutral-300: $grey-300;
$color-neutral-400: $grey-400;
$color-neutral-600: $grey-600;
$color-neutral-700: $grey-700;

$color-white: $white;

// ------- font colors ------

// Default
$color-font-default: $color-neutral-700 !default;
$color-font-link-default: $color-clickable-600 !default;
$color-font-link-default--focus: $color-clickable-700;

// ------- button colors ----

// Primary //
// Default
$color-background-button-primary: $color-clickable-600;
$color-text-button-primary: $color-neutral-300;
$color-border-button-primary: $color-clickable-600;

// Focus && Hover
$color-background-button-primary--focus-hover: $color-clickable-700;
$color-text-button-primary--focus-hover: $color-neutral-300;
$color-border-button-primary--focus-hover: $color-clickable-700;

// Disabled
$color-background-button-secondary--disabled: $color-neutral-300;
$color-text-button-secondary--disabled: $color-clickable-600;
$color-border-button-secondary--disabled: $color-clickable-600;

// Secondary //
// Default
$color-background-button-secondary: $color-white;
$color-text-button-secondary: $color-clickable-600;
$color-border-button-secondary: $color-clickable-600;

// Focus && Hover
$color-background-button-secondary--focus-hover: $color-clickable-600;
$color-text-button-secondary--focus-hover: $color-neutral-300;
$color-border-button-secondary--focus-hover: $color-clickable-600;

// Disabled
$color-background-button-secondary--disabled: $color-neutral-300;
$color-text-button-secondary--disabled: $color-clickable-600;
$color-border-button-secondary--disabled: $color-clickable-600;
