Mini Shell

// Blues
$blue-wordpress:         #0087be;
$blue-light:             #78dcfa;
$blue-medium:            #3582c4;
$blue-dark:              #005082;
$blue-medium-dark:       #2271b1;
$blue-grey-light:        #f6f7f7;
$blue-grey-dark:         #0a4b78;
$light-gray-700:         #c3c4c7;


// Grays
$gray-original:          #87a6bc;
$gray:                   desaturate( $gray-original, 100% ); // Intermediary transform to match dotcom's colors

// $gray color functions:
//
// lighten( $gray, 10% )
// lighten( $gray, 20% )
// lighten( $gray, 30% )
// darken( $gray, 10% )
// darken( $gray, 20% )
// darken( $gray, 30% )
//
// See wordpress.com/design-handbook/colors/ for more info.

$gray-light:             lighten( $gray, 33% ); //#f6f6f6
$gray-dark:              darken( $gray, 38% ); //#404040

// $gray-text: ideal for standard, non placeholder text
// $gray-text-min: minimum contrast needed for WCAG 2.0 AA on white background
$gray-text:              $gray-dark;
$gray-text-min:          darken( $gray, 18% ); //#537994

// Shades of gray
$gray-lighten-10: lighten( $gray, 10% ); // #a8bece
$gray-lighten-20: lighten( $gray, 20% ); // #c8d7e1
$gray-lighten-30: lighten( $gray, 30% ); // #e9eff3
$gray-darken-10:  darken( $gray, 10% );  // #668eaa
$gray-darken-20:  darken( $gray, 20% );  // #4f748e
$gray-darken-30:  darken( $gray, 30% );  // #3d596d

// Oranges
$orange-jazzy:           #f0821e;
$orange-fire:            #d63638;

// Alerts
$alert-yellow:           #f0b849;
$alert-red:              #d94f4f;
$alert-green:            #4ab866;
$alert-purple:           #855DA6;

// Link hovers
$link-highlight:         tint($blue-medium, 20%);

// Essentials
$white:                  rgba(255,255,255,1);
$transparent:            rgba(255,255,255,0);

$border-ultra-light-gray: #e8f0f5;