$orange: #EA5625;
$pink: #F4A7A8;
$light-green: #C5DED1;
$black: black;
$white: white;


// $carbon: #222222;
// $white: #ffffff;
// $epicea: #5d7b84;

// $gray-secondary: #666666;
$gray-light-1: #EEEEEE;
$gray-light-2: #EAECE8;
$gray-light-3: #A9A9A9;
$gray-dark-1: #596E80;

$primary-color: $orange;

$space-xsmall: 0.25em;
$space-small: 0.5em;
$space-medium: 1em;
$space-large: 2em;
$space-xlarge: 3em;

$border-radius-1: 15px;

// // typo
$font-color: $black;
$font-family: Manrope, sans-serif;
$font-size: 18px;
$font-line-height: 1.4;
$base-font: 16;
$fz-1: 30em / $base-font;
$fz-2: 24em / $base-font;
$fz-3: 21em / $base-font;
$fz-4: 18em / $base-font;
$fz-small: 14em / $base-font;
$fz-xsmall: 12em / $base-font;;
$fz-xxsmall: 11em / $base-font;;

$sidebar-width: 350px;
$width: 1300px;
$link-color: inherit;
$link-decoration: underline;
$link-hover-decoration: none;

$responsive-menu: left-to-right;
$nav-button-background: $white;
$nav-background: $pink;
$nav-after-image: false;
$nav-button-color: $black;
$nav-button-background: $gray-light-2;
$nav-color: white;
$nav-mobile-menu-background: $white;
$nav-border-color: none;

$nav-item-selected-background: $orange;
$nav-item-selected-color: $white;

$nav-item-hover-background: $white;
$nav-item-hover-color: $orange;
$nav-item-hover-border: 1px solid $orange;
$nav-item-transform: uppercase;

$nav-submenu-background: $orange;
$nav-submenu-color: $white;

$nav-mobile-bottom-bar-background: $pink;
$nav-mobile-bottom-bar-color: white;

$toplinks-border-radius: 0;
$toplinks-background: $gray-light-2;
$toplinks-box-shadow: none;
$toplinks-padding: $space-small;
$toplinks-border: none;

$cell-border: 1px solid $gray-dark-1;
$cell-entry-border: 2px dotted $gray-dark-1;
$cell-title-cover-border: false;
$title-color: $gray-dark-1;
$title-transform: uppercase;
$cell-entry-hover-background: #eee;

$button-background: $light-green;
$button-color: $gray-dark-1;
$button-border-radius: $border-radius-1;
$button-box-shadow: none;
$button-hover-background: $orange;
$button-hover-color: $white;
$button-focus-outline: 2px solid $orange;
$button-focus-outline-offset: 2px;
$buttons-order: previous, cancel, submit;
$buttons-alignment: flex-end;
$widget-background: $gray-light-1;
$widget-border: 1px solid $gray-dark-1;
$widget-focus-border: 1px solid $orange;
$widget-focus-background: $white;

$footer-background: white;
$footer-color: $font-color;
$footer-link-color: $orange;

$form-sidebar-position: top;
$wcs-step-marker-type: disc tied;
$wcs-step-current-marker-background: $primary-color;
$wcs-step-current-marker-color: white;
$wcs-step-marker-background: $light-green;
$wcs-step-border-bottom: none;
$wcs-step-marker-tie-color: $light-green;
