//=====================================
// Base colors should not be documented.
// Only document color use.

// Colors -----------------------------
$royal:               #004DFF;
$blue:                #0082FF;
$purple:              #9E64E9;
$teal:                #00C4D7;
$red:                 #FF2229;
$yellow:              #F9BB00;
$green:               #00CA74;
$colors: (
  royal:              $royal,
  blue:               $blue,
  purple:             $purple,
  teal:               $teal,
  red:                $red,
  yellow:             $yellow,
  green:              $green
);

// Specialty Gradient -----------------
$gradient_start:      #0083FF;
$gradient_end:        #0B43D6;

// Interface colors -------------------
$white:               #FFFFFF;
$silver:              #F3F7FB;
$slate:               #C1CDD6;
$charcoal:            #242B42;
$interface_colors: (
  white:              $white,
  silver:             $silver,
  slate:              $slate,
  charcoal:           $charcoal,
);

// Main colors ------------------------
$primary:             $royal;
$secondary:           $blue;
$tertiary:            $yellow;
$main_colors: (
  primary:            $primary,
  secondary:          $secondary,
  tertiary:           $tertiary
);
//=====================================

// Background colors ------------------
$bg_light:            $silver;
$bg_dark:             $charcoal;
$background_colors: (
  bg_light:           $bg_light,
  bg_dark:            $bg_dark
);

// Card colors ------------------
$card_light:          $white;
$card_dark:           $charcoal;
$card_colors: (
  card_light:         $card_light,
  card_dark:          $card_dark
);

// Active colors ----------------------
$active_light:        #E5F2FF;
$active_dark:         #144075;
$active_colors: (
  active_light:       $active_light,
  active_dark:        $active_dark
);

// Hover colors -----------------------
$hover_light:         darken($silver, 5%);
$hover_dark:          lighten($charcoal, 5%);
$hover_colors: (
  hover_light:        $hover_light,
  hover_dark:         $hover_dark
);

// Border colors ----------------------
$border_light:        #E4E8F0;
$border_dark:         #363D5B;
$border_colors: (
  border_light:       $border_light,
  border_dark:        $border_dark
);

// Shadow colors ----------------------
$shadow_light:        rgba($blue, 0.1);
$shadow_dark:         rgba($slate, 0.1);
$shadow_colors: (
  shadow_light:       $shadow_light,
  shadow_dark:        $shadow_dark
);

// Text colors ------------------------
$text_lt_default:     $charcoal;
$text_lt_light:       #919EAB;
$text_lt_lighter:     $slate;
$text_dk_default:     $white;
$text_dk_light:       rgba($white, 0.6);
$text_dk_lighter:     rgba($white, 0.4);
$text_colors: (
  text_lt_default:    $text_lt_default,
  text_lt_light:      $text_lt_light,
  text_lt_lighter:    $text_lt_lighter,
  text_dk_default:    $text_dk_default,
  text_dk_light:      $text_dk_light,
  text_dk_lighter:    $text_dk_lighter
);

// Data colors ------------------------
$data_1:              $royal;
$data_2:              $blue;
$data_3:              $purple;
$data_4:              $teal;
$data_5:              $green;
$data_6:              $yellow;
$data_7:              $red;
$data_colors: (
  data_1:             $data_1,
  data_2:             $data_2,
  data_3:             $data_3,
  data_4:             $data_4,
  data_5:             $data_5,
  data_6:             $data_6,
  data_7:             $data_7
);

// Status colors ----------------------
$success:             $green;
$warning:             $yellow;
$error:               $red;
$info:                $teal;
$neutral:             $slate;
$status_colors: (
  success:            $success,
  warning:            $warning,
  error:              $error,
  info:               $info,
  neutral:            $neutral
);

// Link colors ------------------------
$primary_action:      $primary;
$primary_action_dk:   $blue;
$action_colors: (
  primary_action:     $primary_action,
  primary_action_dk:  $primary_action_dk
);

// Product colors ---------------------
$windows:             $royal;
$siding:              $yellow;
$doors:               $blue;
$solar:               $green;
$roofs:               $teal;
$gutters:             $purple;
$product_colors: (
  windows:            $windows,
  siding:             $siding,
  doors:              $doors,
  solar:              $solar,
  roofs:              $roofs,
  gutters:            $gutters
);





//=====================================
// DEPRECIATED COLORS
//=====================================

// POWER COLORS
$power_navy:        #004976;
$power_navy_darker: #1F2B52;
$power_gold:        #daaa00;
$power_blue:        #00a3e0;
$power_red:         #f9423a;
$power_royal:       #0072ce;
$power_green:       #00bf6f;

$power_colors: (
  power_navy: $power_navy,
  power_navy_darker: $power_navy_darker,
  power_gold: $power_gold,
  power_blue: $power_blue,
  power_red: $power_red,
  power_royal: $power_royal,
  power_green: $power_green
);


// GRAY COLORS
$white: #ffffff;
$gray_1: mix(#000, #ffffff, 5%);
$gray_2: mix(#000, #ffffff, 10%);
$gray_3: mix(#000, #ffffff, 20%);
$gray_4: mix(#000, #ffffff, 30%);
$gray_5: mix(#000, #ffffff, 40%);
$gray_6: mix(#000, #ffffff, 50%);
$gray_7: mix(#000, #ffffff, 60%);
$gray_8: mix(#000, #ffffff, 70%);
$gray_9: mix(#000, #ffffff, 80%);
$black: #1A1A1A;

$gray_colors: (
  white: $white,
  gray_1: $gray_1,
  gray_2: $gray_2,
  gray_3: $gray_3,
  gray_4: $gray_4,
  gray_5: $gray_5,
  gray_6: $gray_6,
  gray_7: $gray_7,
  gray_8: $gray_8,
  gray_9: $gray_9,
  black: $black
);


// INTERFACE COLORS
$sky_lighter:     #F9FAFB;
$sky_light:       #F4F6F8;
$sky:             #DFE3E8;
$sky_dark:        #C4CDD5;
$ink_lightest:    #919EAB;
$ink_lighter:     #637381;
$ink_light:       #454F5B;
$ink:             #273142;
$ink_dark:        #212B36;

$interface_colors: (
  sky_lighter:   $sky_lighter,
  sky_light:     $sky_light,
  sky:           $sky,
  sky_dark:      $sky_dark,
  ink_lightest:  $ink_lightest,
  ink_lighter:   $ink_lighter,
  ink_light:     $ink_light,
  ink:           $ink,
  ink_dark:      $ink_dark
);


// OPACITY COLOR VARIATIONS
$p_navy_opacity_1: rgba($power_navy, .1);
$p_navy_opacity_2: rgba($power_navy, .2);
$p_navy_opacity_3: rgba($power_navy, .3);
$p_navy_opacity_4: rgba($power_navy, .4);
$p_navy_opacity_5: rgba($power_navy, .5);
$p_navy_opacity_6: rgba($power_navy, .6);
$p_navy_opacity_7: rgba($power_navy, .7);
$p_navy_opacity_8: rgba($power_navy, .8);
$p_navy_opacity_9: rgba($power_navy, .9);

$p_gold_opacity_1: rgba($power_gold, .1);
$p_gold_opacity_2: rgba($power_gold, .2);
$p_gold_opacity_3: rgba($power_gold, .3);
$p_gold_opacity_4: rgba($power_gold, .4);
$p_gold_opacity_5: rgba($power_gold, .5);
$p_gold_opacity_6: rgba($power_gold, .6);
$p_gold_opacity_7: rgba($power_gold, .7);
$p_gold_opacity_8: rgba($power_gold, .8);
$p_gold_opacity_9: rgba($power_gold, .9);

$p_blue_opacity_1: rgba($power_blue, .1);
$p_blue_opacity_2: rgba($power_blue, .2);
$p_blue_opacity_3: rgba($power_blue, .3);
$p_blue_opacity_4: rgba($power_blue, .4);
$p_blue_opacity_5: rgba($power_blue, .5);
$p_blue_opacity_6: rgba($power_blue, .6);
$p_blue_opacity_7: rgba($power_blue, .7);
$p_blue_opacity_8: rgba($power_blue, .8);
$p_blue_opacity_9: rgba($power_blue, .9);

$p_red_opacity_1: rgba($power_red, .1);
$p_red_opacity_2: rgba($power_red, .2);
$p_red_opacity_3: rgba($power_red, .3);
$p_red_opacity_4: rgba($power_red, .4);
$p_red_opacity_5: rgba($power_red, .5);
$p_red_opacity_6: rgba($power_red, .6);
$p_red_opacity_7: rgba($power_red, .7);
$p_red_opacity_8: rgba($power_red, .8);
$p_red_opacity_9: rgba($power_red, .9);

$p_royal_opacity_1: rgba($power_royal, .1);
$p_royal_opacity_2: rgba($power_royal, .2);
$p_royal_opacity_3: rgba($power_royal, .3);
$p_royal_opacity_4: rgba($power_royal, .4);
$p_royal_opacity_5: rgba($power_royal, .5);
$p_royal_opacity_6: rgba($power_royal, .6);
$p_royal_opacity_7: rgba($power_royal, .7);
$p_royal_opacity_8: rgba($power_royal, .8);
$p_royal_opacity_9: rgba($power_royal, .9);

$p_green_opacity_1: rgba($power_green, .1);
$p_green_opacity_2: rgba($power_green, .2);
$p_green_opacity_3: rgba($power_green, .3);
$p_green_opacity_4: rgba($power_green, .4);
$p_green_opacity_5: rgba($power_green, .5);
$p_green_opacity_6: rgba($power_green, .6);
$p_green_opacity_7: rgba($power_green, .7);
$p_green_opacity_8: rgba($power_green, .8);
$p_green_opacity_9: rgba($power_green, .9);

$white_opacity_1: rgba($white, .1);
$white_opacity_2: rgba($white, .2);
$white_opacity_3: rgba($white, .3);
$white_opacity_4: rgba($white, .4);
$white_opacity_5: rgba($white, .5);
$white_opacity_6: rgba($white, .6);
$white_opacity_7: rgba($white, .7);
$white_opacity_8: rgba($white, .8);
$white_opacity_9: rgba($white, .9);

$black_opacity_1: rgba(#000, .1);
$black_opacity_2: rgba(#000, .2);
$black_opacity_3: rgba(#000, .3);
$black_opacity_4: rgba(#000, .4);
$black_opacity_5: rgba(#000, .5);
$black_opacity_6: rgba(#000, .6);
$black_opacity_7: rgba(#000, .7);
$black_opacity_8: rgba(#000, .8);
$black_opacity_9: rgba(#000, .9);

$opacity_colors: (
  p_navy_opacity_1: $p_navy_opacity_1,
  p_navy_opacity_2: $p_navy_opacity_2,
  p_navy_opacity_3: $p_navy_opacity_3,
  p_navy_opacity_4: $p_navy_opacity_4,
  p_navy_opacity_5: $p_navy_opacity_5,
  p_navy_opacity_6: $p_navy_opacity_6,
  p_navy_opacity_7: $p_navy_opacity_7,
  p_navy_opacity_8: $p_navy_opacity_8,
  p_navy_opacity_9: $p_navy_opacity_9,

  p_gold_opacity_1: $p_gold_opacity_1,
  p_gold_opacity_2: $p_gold_opacity_2,
  p_gold_opacity_3: $p_gold_opacity_3,
  p_gold_opacity_4: $p_gold_opacity_4,
  p_gold_opacity_5: $p_gold_opacity_5,
  p_gold_opacity_6: $p_gold_opacity_6,
  p_gold_opacity_7: $p_gold_opacity_7,
  p_gold_opacity_8: $p_gold_opacity_8,
  p_gold_opacity_9: $p_gold_opacity_9,

  p_blue_opacity_1: $p_blue_opacity_1,
  p_blue_opacity_2: $p_blue_opacity_2,
  p_blue_opacity_3: $p_blue_opacity_3,
  p_blue_opacity_4: $p_blue_opacity_4,
  p_blue_opacity_5: $p_blue_opacity_5,
  p_blue_opacity_6: $p_blue_opacity_6,
  p_blue_opacity_7: $p_blue_opacity_7,
  p_blue_opacity_8: $p_blue_opacity_8,
  p_blue_opacity_9: $p_blue_opacity_9,

  p_red_opacity_1: $p_red_opacity_1,
  p_red_opacity_2: $p_red_opacity_2,
  p_red_opacity_3: $p_red_opacity_3,
  p_red_opacity_4: $p_red_opacity_4,
  p_red_opacity_5: $p_red_opacity_5,
  p_red_opacity_6: $p_red_opacity_6,
  p_red_opacity_7: $p_red_opacity_7,
  p_red_opacity_8: $p_red_opacity_8,
  p_red_opacity_9: $p_red_opacity_9,

  p_royal_opacity_1: $p_royal_opacity_1,
  p_royal_opacity_2: $p_royal_opacity_2,
  p_royal_opacity_3: $p_royal_opacity_3,
  p_royal_opacity_4: $p_royal_opacity_4,
  p_royal_opacity_5: $p_royal_opacity_5,
  p_royal_opacity_6: $p_royal_opacity_6,
  p_royal_opacity_7: $p_royal_opacity_7,
  p_royal_opacity_8: $p_royal_opacity_8,
  p_royal_opacity_9: $p_royal_opacity_9,

  p_green_opacity_1: $p_green_opacity_1,
  p_green_opacity_2: $p_green_opacity_2,
  p_green_opacity_3: $p_green_opacity_3,
  p_green_opacity_4: $p_green_opacity_4,
  p_green_opacity_5: $p_green_opacity_5,
  p_green_opacity_6: $p_green_opacity_6,
  p_green_opacity_7: $p_green_opacity_7,
  p_green_opacity_8: $p_green_opacity_8,
  p_green_opacity_9: $p_green_opacity_9,

  white_opacity_1: $white_opacity_1,
  white_opacity_2: $white_opacity_2,
  white_opacity_3: $white_opacity_3,
  white_opacity_4: $white_opacity_4,
  white_opacity_5: $white_opacity_5,
  white_opacity_6: $white_opacity_6,
  white_opacity_7: $white_opacity_7,
  white_opacity_8: $white_opacity_8,
  white_opacity_9: $white_opacity_9,

  black_opacity_1: $black_opacity_1,
  black_opacity_2: $black_opacity_2,
  black_opacity_3: $black_opacity_3,
  black_opacity_4: $black_opacity_4,
  black_opacity_5: $black_opacity_5,
  black_opacity_6: $black_opacity_6,
  black_opacity_7: $black_opacity_7,
  black_opacity_8: $black_opacity_8,
  black_opacity_9: $black_opacity_9
);

// Highlight Colors
$light_yellow:      #fffcda;
$medium_yellow:     #FFFF9E;
$light_blue:        #F0F3F8;
$highlight_colors: (light_blue: $light_blue, light_yellow: $light_yellow, medium_yellow: $medium_yellow);