// ONE COLORS -> for wayf module
$cyan: #46afe6 !default;
$green: #6fbe2e !default;
$yellow: #eac403 !default;
$orange: #ff8d2e !default;
$red: #ff3a55 !default;
$pink: #ff61c0 !default;
$purple: #a348c0 !default;
$indigo: #4f2691 !default;

// COLOR PALETTE : GREY
$white: #ffffff !default;
$lightest-grey: #f0f2f4 !default;
$light-grey: #e9ebef !default;
$neutral-grey: #d6d9e0 !default;
$medium-grey: #c9ced5 !default;
$solid-grey: #b1b6bf !default;
$grey: #8c939e !default;
$dark-grey: #5b6472 !default;
$darkest-grey: #3f454f !default;
$black: #000000 !default;

// COLOR PALETTE : SHADOW
$shadow-light: rgba(0, 0, 0, 0.1) !default;
$shadow: rgba(0, 0, 0, 0.26) !default;
$shadow-dark: rgba(0, 0, 0, 0.4) !default;
$shadow-darker: rgba(0, 0, 0, 0.6) !default;

// COLOR PALETTE : CSS-LIB
$primary: blueviolet !default;
$primary-darkest: saturate(darken($primary, 40%), 10%) !default;
$primary-dark: saturate(darken($primary, 9%), 3%) !default;
$primary-light: saturate(lighten($primary, 17%), 85%) !default;
$primary-lighter: desaturate(lighten($primary-light, 15%), 10%) !default;

$accent: aqua !default;
$hover: $accent !default;
$dark-accent: darken($accent, 20%) !default;

$warning-color: $red;
$warning-color-hover: darken($warning-color, 35%);
$forewarn-color: $orange;
$valid-color: #6FBE2E;

$text-light: $grey !default;
$text-lightest: $white !default;
$text-color: $black !default;

$background: darken($white, 2.5%) !default; //#F9F9F9
$disabled-color: $grey !default;
$block-disabled-color: $primary-lighter !default;

$colorz: $cyan, $green, $yellow, $orange, $pink, $purple, $indigo;

// MESSAGE FLASH
$flash-red: #c74848;
$flash-orange: #ff9057;
$flash-green: #3cb371;
$flash-blue: #2a9cc8;
$flash-grey: #5b6472;

// SIZES
$icon-list-size: 117px !default;
$icon-list-padding: 7px !default;

$header-height: 150px !default;
$mobile-header-height: 150px !default;

$font-size: 12px !default;

//datePicker
$btnPrimaryBackground: $medium-grey !default;

$fonts-path: "fonts" !default;

// Color Exercizer
$grey-black: hsl(0, 0%, 29%);
$grey-graphite: hsl(0, 0%, 56%);
$grey-stone: hsl(0, 0%, 69%);
$grey-grey: hsl(0, 0%, 78%);
$grey-cloudy: hsl(0, 0%, 89%);
$grey-pearl: hsl(0, 0%, 95%);
$grey-fog: hsl(0, 0%, 98%);
$pale-cyan: hsl(204, 100%, 95%);
$pale-red: hsl(355, 100%, 95%);
$pale-orange: hsl(26, 100%, 95%);
$pale-blue: hsl(219, 89%, 93%);

/* Generic Icons */

@font-face {
  font-family: "generic-icons";
  font-display: swap;
  font-style: normal;
  font-weight: normal;
  src: url(#{$fonts-path}/generic-icons/generic-icons.woff);
}