/*
  When adding a color, please add it to the :export section at the end of this file.
  If you need to add a new section/type of color, you can add the section title to the :export by pre-prending it with an underscore.
*/
@import "mixins.scss";

/* Primary Colors */
$blue: #0E99FF;
$dark: #444444;
$green: #7ED221;
$red: #C12F3C;
$slate: #607997;
$white: #FFFFFF;

/* Secondary Colors */
$dark-bg: #333333;
$cool-grey-dark: #6F7D8E;
$grey: #C0C2D0;
$cool-light-grey: #E4E4EE;
$cool-blue: #5A8FD0;
$light-grey: #D7D7D7;
$heavy-grey: #9C9C9C;
$whitish: #F7F7F7;
$off-white: #F6F5F9;
$cloud: #E6F3FC;
$mint-chip: #D4FFCC;
$rose: #FFC7CC;
$tint-blue: #F4F9FB;

/* Gradients */
$gradient-blue-start: #538DC0;
$gradient-blue-end: #94CCE4;
$gradient-teal: linear-gradient(45deg, #4392D7 0%, #00E3C6 100%);
$gradient-alert: linear-gradient(90deg, #E5378F 0%, #F76B1C 100%);
$gradient-success: linear-gradient(45deg, #B4EC51 0%, #429321 100%);
$gradient-blue: linear-gradient(45deg, #538DC0 0%, #94CCE4 100%);
$gradient-dark: linear-gradient(31.89deg, #222222 0%, #444444 100%);

/* Transparencies */
$box-shadow-light: 0 0 24px rgba(0, 0, 0, 0.15);
$box-shadow-dark: 0 0 24px rgba(0, 0, 0, 0.25);
$blue-shade: #2E4C71E6;
$shade: #44444459;
$tint: #FFFFFF40;

/* stylelint-disable */
:export {
  _primary-colors: 0;
  blue: $blue;
  dark: $dark;
  green: $green;
  red: $red;
  slate: $slate;
  white: $white;
  _secondary-colors: 0;
  darkBg: $dark-bg;
  coolGreyDark: $cool-grey-dark;
  coolBlue: $cool-blue;
  grey: $grey;
  coolLightGrey: $cool-light-grey;
  lightGrey: $light-grey;
  offWhite: $off-white;
  cloud: $cloud;
  mintChip: $mint-chip;
  rose: $rose;
  tintBlue: $tint-blue;
  _gradients: 0;
  gradientBlueStart: $gradient-blue-start;
  gradientBlueEnd: $gradient-blue-end;
  gradientTeal: $gradient-teal;
  gradientAlert: $gradient-alert;
  gradientSuccess: $gradient-success;
  gradientBlue: $gradient-blue;
  gradientDark: $gradient-dark;
  _transparencies: 0;
  boxShadowLight: $box-shadow-light;
  boxShadowDark: $box-shadow-dark;
  blueShade: $blue-shade;
  shade: $shade;
  tint: $tint;
}
/* stylelint-enable */