// Colors
$gray-light: #ececec;
$gray: #6e6e6e;
$red: #cf141d;
$red-orange: #ff3300;
$red-light: lighten($red-orange, 20%);
$red-xlight: lighten($red-orange, 50%);
$pink: #e72f75;

$colors: (
	"red": #cf141d,
	"red-soft": #eb585c,
	"red-vivid": #e51736,
	"blue-dark": #282f89,
	"blue-soft": #2f6cb5,
	"violet-dark": #6d3089,
	"pink-soft": #e95d7c,
	"pink": #e72f75,
	"purple": #aa318a,
	"purple-soft": #c7559b,
	"cyan-green": #009178,
	"cyan-soft": #2391a4,
	"cyan-dark": #007698,
	"green": #2ea834,
	"green-lime": #017e3d,
	"green-dark": #358c2a,
	"orange": #ec6703
);

// typo
$ff-title: Din, Arial, sans-serif;
$ff-text: Roboto, Arial, sans-serif;
// Fonts sizes - base 19px (desktop)
$fz-h1: 2.3em;  // 48px
$fz-h2: 1.9em;  // 40px
$fz-h3: 1.7em;  // 36px
$fz-h4: 1.57em; // 33px
$fz-h5: 1.25em;  // 24px
$fz-h6: 1.15em;  // 22px
$fz-small: 0.85em;

// Icons
$icons: (
	"cadenas": "cadenas.svg",
	"couple": "couple.svg",
	"citoyen": "document.svg",
	"document-valide": "document-valide.svg",
	"feu-tricolore": "feu-tricolore.svg",
	"geometrie": "geometrie.svg",
	"loupe": "loupe.svg",
	"loisir": "loisir.svg",
	"main-halte": "halte.svg",
	"mains-famille": "famille.svg",
	"mains-poignee": "mains-poignee.svg",
	"mains-social": "social.svg",
	"maison": "maison.svg",
	"megaphone": "megaphone.svg",
	"navigation": "navigation.svg",
	"plot": "plot.svg",
	"poubelle": "poubelle.svg",
	"robinet": "robinet.svg",
	"tasse": "tasse.svg"
);

$logos-gris: (
	"commelle-vernay": "commelle-vernay",
	"icitoyen": "icitoyen",
	"mably": "mably",
	"office-tourisme": "loffice-de-tourisme",
	"riorges": "riorges",
	"roannais-agglo": "roannais-agglomeration",
	"roannaise-de-l-eau": "la-roannaise-de-leau",
	"roanne": "roanne",
	"villerest": "villerest"
);

$custom-border-radius: 7px;
$top-gradient: linear-gradient(to bottom, hsla(0, 0%, 0%, 0.2), transparent 35%);
$logo-size: 80px;

// Core Vars
$width: 1280px;
$mobile_limit: 1024px;
$mobile-width: none;
$very-small-limit: 560px;
$sidebar-width: 17.5rem;
$primary-color: $red-orange;
$columns-gutter: 0.5em;

$font-size: 100%;
$font-family: $ff-text;
$font-color: #333;
$link-color: $primary-color;

$title-font-size: $fz-h5;
$title-font-family: $ff-title;
$title-transform: uppercase;
$title-weight: bold;
$title-background: none;

$nav-after-image: false;
$nav-mobile-limit: 20000px;
$nav-border-color: none;
$nav-button-background: white;
$nav-button-color: black;
$nav-menu-side: 40px;
$nav-mobile-menu-background: black;
$nav-mobile-menu-item-color: white;
$nav-button-bar-height: 4px;
$nav-active-color: white;
$nav-item-selected-color: $font-color;

$nav-mobile-bottom-bar-background: black;
$nav-mobile-bottom-bar-color: white;
$nav-mobile-bottom-bar-item-selected-background: transparent;
$nav-mobile-bottom-bar-item-selected-color: $primary-color;
$nav-mobile-bottom-bar-item-hover-color: white;
// $nav-mobile-bottom-bar-color: white;
$nav-mobile-bottom-bar-item-hover-background: none;
$nav-mobile-bottom-bar-item-hover-color: white;

$cell-border: none;
$cell-entry-color: $gray;
$cell-entry-border: 1px solid transparent;

$carrousel-text-position: bottom left;
$carrousel-navigation-bullet-size: 15px;
$carrousel-arrows: none;
$carrousel-navigation-bullet-border: 2px solid black;

$button-background: $font-color;
$button-border-radius: $custom-border-radius;
$button-border: 1px solid $font-color;
$button-hover-background: $primary-color;

$buttons-order: previous, cancel, submit;
$buttons-alignment: space-between;

$widget-border: 1px solid $gray-light;
$widget-background: #f3f3f3;
$widget-border-radius: 0.33em;
$widget-focus-background: #fdf2e5;
$widget-focus-border: 1px solid $gray;
$widget-unique-checkbox-position: left;

$wcs-steps-small-layout-limit: $mobile-limit;
$wcs-step-background: $gray-light;
$wcs-step-color: $font-color;
$wcs-step-current-color: black;
$wcs-step-border-bottom: none;
$wcs-step-marker-background: $font-color;
$wcs-step-marker-color: white;
$wcs-step-current-marker-color: white;
$wcs-step-current-marker-background: $primary-color;

$footer-background: $font-color;
$footer-color: #fff;
$footer-menucell-separator: 1px solid;
