//////////////////////////////
// !THEME / VARIABLES / COLORS
//////////////////////////////


// !BRAND COLORS

// Define brand colors
$color-brand-alpha: #d00000;
$color-brand-beta: #fefdfa;
$color-brand-gamma: #c7c8ca;


// Assign names to brand colors
$scarlet: $color-brand-alpha;
$cream: $color-brand-beta;
$gray: $color-brand-gamma;


// !UI COLORS
// Assign colors to elements
$white: #fff;


// Body background color (usually white, off-white, or very light gray)
$color-body-bg: $cream;


// Must meet WCAG AA (minimum contrast ratio of 4.5)
// Strive for WCAG AAA (minimum contrast ratio of 7.0) for body text
$color-body: mix($cream, #000, 24%);


// Must meet WCAG AA (minimum contrast ratio of 4.5)
// Strive for WCAG AAA (minimum contrast ratio of 7.0) for heading text
$color-heading: mix($cream, #000, 18%);


// Must meet WCAG AA (minimum contrast ratio of 4.5)
$color-light-text: mix($cream, #000, 32%);


// Must meet WCAG AA (minimum contrast ratio of 4.5)
$color-lightest-text: mix($cream, #000, 42%);


// !Links
$color-link: $scarlet;
$color-link-visited: darken($color-link, 10%);
$color-link-hover: darken($color-link, 10%);
$color-link-active: darken($color-link, 10%);
$color-link-underline: scale-color($color-link, $lightness: 50%, $saturation: -50%);
// $color-link-visited: scale-color($color-link, $lightness: -10%, $saturation: -100%);
// $color-link-hover: scale-color($color-link, $lightness: -20%, $saturation: 100%);
// $color-link-active: scale-color($color-link, $lightness: -30%, $saturation: 100%);


// !Buttons
$color-button: $color-link;
$color-button-visited: $color-link-visited;
$color-button-hover: $color-link-hover;
$color-button-active: $color-link-active;


// !Borders
$color-border: $gray;
$color-border-hover: darken($color-border,10%);
// $border-color: scale-color($scarlet, $saturation: -100%);


// !Marks (Highlights) Background Color
$color-mark: #ff0;


// !Breadcrumbs
$color-breadcrumb: $gray;


// !Badges
$color-badge: $gray;


// !Footer
$color-footer-local: fade-out($white, 0);
$color-footer-local-bg: $color-body;
$color-footer-global: fade-out($white, 0);
$color-footer-global-bg: $scarlet;
$color-footer-link: fade-out($white, 0);
$color-footer-link-visited: fade-out($white, 0);
$color-footer-link-hover: fade-out($white, 0);
$color-footer-link-active: fade-out($white, 0);


// !Define contextual colors
$color-active: rgba(0,0,0,.1);
$color-info: rgba(0,102,255,.1);
$color-success: rgba(0,153,0,.1);
$color-warning: rgba(255,102,0,.1);
$color-danger: rgba(255,0,0,.1);


// $theme-color-key: 'base' !default;
//
// $theme-colors: (
//   'primary': (
//     'base': #d00000
// //     'base': hsla(0,100%,41%,1.0) // #d00000
//   ),
//   'accent': (
//     'base': #fefdfa
// //     'base': hsla(45,67%,99%,1.0) // #fefdfa
//   )
// );
//
// $theme-opacity: (
//   'light': 0.75, // opacity used with lighter colors
//   'dark': 0.25  // opacity used with darker colors
// );
//
// @function theme-color(
//   $name: 'primary',
//   $variant: $theme-color-key,
//   $opacity: 1
// ) {
//   $color: null;
//
//   // Get the color spectrum
//   $color-spectrum: map-get($theme-colors, $name);
//
//   // Get the color variant
//   @if $color-spectrum {
//     $color: map-get($color-spectrum, $variant);
//   }
//
//   // Get the alpha setting
//   $alpha: if(type-of($opacity) == 'number', $opacity, map-get($theme-opacity, $opacity));
//
//   // Set the alpha of the color
//   @if $alpha {
//     $color: rgba($color, $alpha);
//   }
//
//   @return $color;
// }