@use "sass:color";

$wpblue: #2271b1;

//== Status
$success: #39b54a;
$error: #be1e2d;
$alert: #eed202;

//== Brand Colours
$primary: #337ab7;
$secondary: #5bc0de;
$tertiary: color.invert($primary);
$quaternary: color.invert($secondary);

//== Shades
$white:               #FFFFFF;
$grey:                #808080;
$black:               #000000;

//== Primary Tints
$primary-darkest: color.adjust($primary, $lightness: -45%);
$primary-darker: color.adjust($primary, $lightness: -30%);
$primary-dark: color.adjust($primary, $lightness: -15%);
$primary-light: color.adjust($primary, $lightness: 15%);
$primary-lighter: color.adjust($primary, $lightness: 30%);
$primary-lightest: color.adjust($primary, $lightness: 45%);

//== Secondary Tints
$secondary-darkest: color.adjust($secondary, $lightness: -45%);
$secondary-darker: color.adjust($secondary, $lightness: -30%);
$secondary-dark: color.adjust($secondary, $lightness: -15%);
$secondary-light: color.adjust($secondary, $lightness: 15%);
$secondary-lighter: color.adjust($secondary, $lightness: 30%);
$secondary-lightest: color.adjust($secondary, $lightness: 45%);

//== Tertiary Tints
$tertiary-darkest: color.adjust($tertiary, $lightness: -45%);
$tertiary-darker: color.adjust($tertiary, $lightness: -30%);
$tertiary-dark: color.adjust($tertiary, $lightness: -15%);
$tertiary-light: color.adjust($tertiary, $lightness: 15%);
$tertiary-lighter: color.adjust($tertiary, $lightness: 30%);
$tertiary-lightest: color.adjust($tertiary, $lightness: 45%);

//== quaternary Tints
$quaternary-darkest: color.adjust($quaternary, $lightness: -45%);
$quaternary-darker: color.adjust($quaternary, $lightness: -30%);
$quaternary-dark: color.adjust($quaternary, $lightness: -15%);
$quaternary-light: color.adjust($quaternary, $lightness: 15%);
$quaternary-lighter: color.adjust($quaternary, $lightness: 30%);
$quaternary-lightest: color.adjust($quaternary, $lightness: 45%);

//== six shades of grey
$grey-darkest:        color.adjust(grey, $lightness: -40%);
$grey-darker:         color.adjust(grey, $lightness: -25%);
$grey-dark:           color.adjust(grey, $lightness: -10%);
$grey-light:          color.adjust(grey, $lightness: 10%);
$grey-lighter:        color.adjust(grey, $lightness: 25%);
$grey-lightest:       color.adjust(grey, $lightness: 40%);

//## Colour Array (used in generating colour classes).
$colors: (
  // shades
  "black":     $black,
  "grey-darkest": $grey-darkest,
  "grey-darker": $grey-darker,
  "grey-dark": $grey-dark,
  "grey-light": $grey-light,
  "grey-lighter": $grey-lighter,
  "grey-lightest": $grey-lightest,
  "white":     $white,
  // status
  "error":      $error,
  "success":    $success,
  "alert":      $alert,
  // brand
  "primary":    $primary,
  "secondary":  $secondary,
  "tertiary":   $tertiary,
  "quaternary":   $quaternary,
  // primary tints
  "primary-darkest":  $primary-darkest,
  "primary-darker":   $primary-darker,
  "primary-dark":     $primary-dark,
  "primary-light":    $primary-light,
  "primary-lighter":  $primary-lighter,
  "primary-lightest": $primary-lightest,
  // secondary tints
  "secondary-darkest":  $secondary-darkest,
  "secondary-darker":   $secondary-darker,
  "secondary-dark":     $secondary-dark,
  "secondary-light":    $secondary-light,
  "secondary-lighter":  $secondary-lighter,
  "secondary-lightest": $secondary-lightest,
  // tertiary tints
  "tertiary-darkest":  $tertiary-darkest,
  "tertiary-darker":   $tertiary-darker,
  "tertiary-dark":     $tertiary-dark,
  "tertiary-light":    $tertiary-light,
  "tertiary-lighter":  $tertiary-lighter,
  "tertiary-lightest": $tertiary-lightest,
  // quaternary tints
  "quaternary-darkest":  $quaternary-darkest,
  "quaternary-darker":   $quaternary-darker,
  "quaternary-dark":     $quaternary-dark,
  "quaternary-light":    $quaternary-light,
  "quaternary-lighter":  $quaternary-lighter,
  "quaternary-lightest": $quaternary-lightest,
);