// -------------------------------------------------- //
// Color variables
// -------------------------------------------------- //

//this should be sunsetted at some point - it's redundant to the theme color variables///

// Brand colors
$gg-gold: $goldColor;
$gg-gold-light-1: mix(white, $gg-gold, 5%);
$gg-gold-light-2: mix(white, $gg-gold, 10%);
$gg-gold-light-3: mix(white, $gg-gold, 15%);
$gg-gold-light-4: mix(white, $gg-gold, 30%);
$gg-gold-dark-1: mix(black, $gg-gold, 5%);
$gg-gold-dark-2: mix(black, $gg-gold, 10%);
$gg-gold-dark-3: mix(black, $gg-gold, 15%);
$gg-gold-dark-4: mix(black, $gg-gold, 30%);

$gg-blue: $blueColor;
$gg-blue-light-1: mix($gg-blue, white, 90%);
$gg-blue-light-2: mix($gg-blue, white, 80%);
$gg-blue-light-3: mix($gg-blue, white, 70%);
$gg-blue-light-4: mix($gg-blue, white, 60%);
$gg-blue-dark-1: mix($gg-blue, black, 90%);
$gg-blue-dark-2: mix($gg-blue, black, 80%);
$gg-blue-dark-3: mix($gg-blue, black, 70%);
$gg-blue-dark-4: mix($gg-blue, black, 60%);

$gg-gray: $grayColor;
$gg-dark-1: $grayDark1Color;
$gg-dark-2: $grayDark2Color;
$gg-dark-3: $grayDark3Color;
$gg-dark-4: $grayDark4Color;
$gg-dark-5: $grayDark5Color;

$gg-light-1: $grayLight1Color;
$gg-light-2: $grayLight2Color;
$gg-light-3: $grayLight3Color;
$gg-light-4: $grayLight4Color;
$gg-light-5: $grayLight5Color;

$gg-green: $greenColor;
$gg-green-light-1: mix($gg-green, white, 90%);
$gg-green-light-2: mix($gg-green, white, 80%);
$gg-green-light-3: mix($gg-green, white, 70%);
$gg-green-light-4: mix($gg-green, white, 60%);
$gg-green-dark-1: mix($gg-green, black, 90%);
$gg-green-dark-2: mix($gg-green, black, 80%);
$gg-green-dark-3: mix($gg-green, black, 70%);
$gg-green-dark-4: mix($gg-green, black, 60%);

$gg-red: $redColor;
$gg-red-light-1: mix($gg-red, white, 90%);
$gg-red-light-2: mix($gg-red, white, 80%);
$gg-red-light-3: mix($gg-red, white, 70%);
$gg-red-light-4: mix($gg-red, white, 60%);
$gg-red-dark-1: mix($gg-red, black, 90%);
$gg-red-dark-2: mix($gg-red, black, 80%);
$gg-red-dark-3: mix($gg-red, black, 70%);
$gg-red-dark-4: mix($gg-red, black, 60%);

$gg-purple: $purpleColor;
$gg-purple-light-1: mix($gg-purple, white, 90%);
$gg-purple-light-2: mix($gg-purple, white, 80%);
$gg-purple-light-3: mix($gg-purple, white, 70%);
$gg-purple-light-4: mix($gg-purple, white, 60%);
$gg-purple-dark-1: mix($gg-purple, black, 90%);
$gg-purple-dark-2: mix($gg-purple, black, 80%);
$gg-purple-dark-3: mix($gg-purple, black, 70%);
$gg-purple-dark-4: mix($gg-purple, black, 60%);

$gg-dkgreen: $darkGreenColor;
$gg-dkgreen-light-1: mix($gg-dkgreen, white, 90%);
$gg-dkgreen-light-2: mix($gg-dkgreen, white, 80%);
$gg-dkgreen-light-3: mix($gg-dkgreen, white, 70%);
$gg-dkgreen-light-4: mix($gg-dkgreen, white, 60%);
$gg-dkgreen-dark-1: mix($gg-dkgreen, black, 90%);
$gg-dkgreen-dark-2: mix($gg-dkgreen, black, 80%);
$gg-dkgreen-dark-3: mix($gg-dkgreen, black, 70%);
$gg-dkgreen-dark-4: mix($gg-dkgreen, black, 60%);

$gg-orange: $orangeColor;
$gg-orange-light-1: mix($gg-orange, white, 90%);
$gg-orange-light-2: mix($gg-orange, white, 80%);
$gg-orange-light-3: mix($gg-orange, white, 70%);
$gg-orange-light-4: mix($gg-orange, white, 60%);
$gg-orange-dark-1: mix($gg-orange, black, 90%);
$gg-orange-dark-2: mix($gg-orange, black, 80%);
$gg-orange-dark-3: mix($gg-orange, black, 70%);
$gg-orange-dark-4: mix($gg-orange, black, 60%);

$gg-magenta: $magentaColor;
$gg-magenta-light-1: mix($gg-magenta, white, 90%);
$gg-magenta-light-2: mix($gg-magenta, white, 80%);
$gg-magenta-light-3: mix($gg-magenta, white, 70%);
$gg-magenta-light-4: mix($gg-magenta, white, 60%);
$gg-magenta-dark-1: mix($gg-magenta, black, 90%);
$gg-magenta-dark-2: mix($gg-magenta, black, 80%);
$gg-magenta-dark-3: mix($gg-magenta, black, 70%);
$gg-magenta-dark-4: mix($gg-magenta, black, 60%);

// Transparent colors
$trans-black-dark: rgba(0, 0, 0, 0.87);
$trans-black-medium: rgba(0, 0, 0, 0.54);
$trans-black-light: rgba(0, 0, 0, 0.38);
$trans-black-x-light: rgba(0, 0, 0, 0.05);

$trans-white-dark: rgba(255, 255, 255, 0.87);
$trans-white-medium: rgba(255, 255, 255, 0.54);
$trans-white-light: rgba(255, 255, 255, 0.2);
$trans-white-x-light: rgba(255, 255, 255, 0.1);

// Gradients
$white-gray-diag: linear-gradient(45deg, rgba(241, 241, 241, 1) 0%, rgba(251, 251, 251, 1) 100%);
$white-gray-diag-invert: linear-gradient(
    45deg,
    rgba(251, 251, 251, 1) 0%,
    rgba(241, 241, 241, 1) 100%
);
$white-gray-vert: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 1) 0%,
    rgba(226, 226, 226, 1) 100%
);
$gg-blue-diag: linear-gradient(45deg, rgba($gg-blue, 1) 0%, rgba($gg-blue-dark-1, 1) 100%);
$gg-blue-diag-invert: linear-gradient(45deg, rgba($gg-blue-dark-1, 1) 0%, rgba($gg-blue, 1) 100%);

@function strip-hash($color) {
    $c: inspect($color);
    @return str-slice($c, 2);
}