//////////////////////////////
// Project Specific Variables
//////////////////////////////

// Empty variable for user-defined breakpoints
$custom-breakpoints: () !default;

// Fae-specific breakpoints
$fae-breakpoints: (
  // @depreciation - remove page_header_save_block in v2.0
  'page_header_save_block': ( max-width:  615px ),
  'login_container':        ( min-width: 700px ),
  'login_submit':           ( min-width: 500px ),
);

// Merge $custom-breakpoints, $fae-breakpoints, and Frob Core's $fine-breakpoints to one variable to use with bp() mixin
$fae-breakpoints: map-merge($fae-breakpoints, $custom-breakpoints);
$breakpoints: map-merge($fine-breakpoints, $fae-breakpoints);

// Widths, padding, margins, and the like
$content-buffer: 30px !default;
$sidenav-width: 250px !default;

$header-border-width: 4px !default;

// Typography
$f-content: 'Lato', $f-sans !default;

// Apps should declare $c-custom-highlight in their fae.scss file
$c-custom-highlight: #9aa142 !default;

// In order from dark to light
// These are stacked in 10s so new colors can be easily inserted between if/when this list changes
$grays: (
  10: #1e1e1e,
  20: #3b3b3b,
  30: #595959,
  40: #999,
  50: #ccc,
  60: #dfdfdf,
  70: #ebebeb,
  80: #efefef,
  90: #f7f7f7,
) !default;

// Functional name for colors
$c-darkest-grey: gray(10) !default;
$c-dark-grey: gray(20) !default;
$c-mid-dark-grey: gray(30) !default;
$c-darker-grey: gray(40) !default;
$c-mid-grey: gray(50) !default;
$c-grey: gray(60) !default;
$c-light-grey: gray(70) !default;
$c-lightest-grey: gray(80) !default;
$c-near-white: gray(90) !default;

// Text
$c-body-bg: $c-near-white !default;
$c-text: $c-mid-dark-grey !default;
$c-text-sub: $c-darker-grey !default;
$c-text-sub-hover: $c-mid-grey !default;
$c-text-heavy: $c-darkest-grey !default;
$c-box_shadow: $c-mid-grey !default;
$c-border: $c-mid-grey !default;

// Nav
$c-header-bg: $c-darkest-grey !default;

// Content Headers
$c-content-header-bg: $c-white !default;

// Tables
$c-table-th: $c-grey !default;
$c-table-tr-even: $c-light-grey !default;
$c-table-td: $c-near-white !default;
$c-table-tr-hover: $c-white !default;
$c-table-filter-header: $c-darkest-grey !default;

// Forms
$c-dark-button: $c-white !default;
$c-dark-button-gradient-start: $c-dark-grey !default;
$c-dark-button-gradient-end: $c-darkest-grey !default;
$c-light-button: $c-dark-grey !default;
$c-light-button-gradient-start: $c-near-white !default;
$c-light-button-gradient-end: $c-light-grey !default;
$c-form-file-link-bg: $c-grey !default;
$c-form-file-link-bg-hover: $c-grey !default;
$c-form-table-bg: $c-light-grey !default;
$c-chosen-gradient-start: $c-near-white !default;
$c-chosen-gradient-end: $c-light-grey !default;
$c-chosen-multi-bg: $c-lightest-grey !default;
$c-chosen-multi-text: $c-dark-grey !default;
$c-chosen-multi-delete: $c-darker-grey !default;

// Yes / No Sliders
$c-slider-no-color: $c-light-grey !default;
$c-slider-no-bg: $c-darker-grey !default;

// Modal
$c-modal-overlay-bg: $c-mid-grey !default;
$c-modal-bg: $c-dark-grey !default;
$c-modal-text: $c-darker-grey !default;

// Notices and Errors
$c-notice-bg: #d8f0d0 !default;
$c-notice-content: #4c884e !default;
$c-warning-bg: #f7f2c8 !default;
$c-warning-content: #ca953a !default;
$c-error-bg: #f6cfcf !default;
$c-error-content: #b75553 !default;

$mobilenav-transition: margin-left .3s cubic-bezier(0.250, 0.460, 0.450, 0.940) !default;

$fae-nav-stack: (
  '.sidenav',
  '.content-header',
  '.sticky-table-header',
  '.main-header'
);