@use "sass:color";
@use "sass:math";

/*** Colors ***/
$primary-color: #de5a5f !default;
$primary-color-light: color.adjust($primary-color, $lightness: 5%) !default;
$primary-color-dark: color.adjust($primary-color, $lightness: -15%) !default;

$secondary-color: #4A7874 !default;
$secondary-color-light: color.adjust($secondary-color, $lightness: 5%) !default;
//$secondary-color: color("teal", "lighten-1") !default;
$success-color: $secondary-color !default;
$favorite-color: #ff8f00;
//$success-color: color("teal", "lighten-1") !default;
$error-color: #B90303 !default;
//$link-color: color("light-blue", "darken-1") !default;
$link-color: #26A69A !default;//#26A69A !default;
/*** Badges ***/
$badge-bg-color: $secondary-color !default;

$grey-light: #f0f0f0;
$grey-dark:#3D3D3D;
$black-light:#272626;

$submenu-color: $grey-dark;
$header-color: $black-light;

$option-disabled-color: #a5a5a5;

/*** Buttons ***/
$button-bg-color-disabled: #DFDFDF !default;
$button-color: $link-color !default;
$button-color-disabled: #9F9F9F !default;
$button-color-flat: #343434 !default;
$button-color-raised: #fff !default;
$button-floating-size: 37px !default;
$button-height: 36px !default;
$button-font-size-shared: 1.3rem !default;
$button-large-gogo-icon-font-size: 1.6rem !default;
$button-line-height: 36px !default;

/*** Collapsible ***/
$collapsible-height: 3rem !default;
$collapsible-header-color: #fff !default;
$collapsible-border-color: #ddd !default;

/*** Dropdown ***/
$dropdown-bg-color: #fff !default;
$dropdown-hover-bg-color: #eee !default;
$dropdown-color: $secondary-color !default;

/*** Fonts ***/
$roboto-font-path: "fonts/Roboto/" !default;

/*** Forms ***/
// Text Inputs + Textarea
$input-border-color: $grey-dark !default;
$input-bg-color: #fff !default;
$input-error-color: $error-color !default;
$input-success-color: $success-color !default;
$input-focus-color: $success-color !default;
$label-font-size: .8rem !default;
$input-disabled-color: rgba(0,0,0, .26) !default;
$input-disabled-solid-color: #BDBDBD !default;

// Radio Buttons
$radio-fill-color: $success-color !default;
$radio-empty-color: #5a5a5a !default;

// Switches
$switch-bg-color: $secondary-color !default;
$switch-checked-lever-bg: color.adjust(color.adjust($secondary-color, $lightness: 25%), $saturation: -25%) !default;
$switch-unchecked-bg: #F1F1F1 !default;
$switch-unchecked-lever-bg: #818181 !default;

// Date Picker
$datepicker-weekday-bg: color.adjust($secondary-color, $lightness: -7%) !default;
$datepicker-date-bg: $secondary_color !default;
$datepicker-year: rgba(255, 255, 255, .4) !default;
$datepicker-focus: rgba(0,0,0, .05) !default;
$datepicker-selected: $secondary-color !default;
$datepicker-selected-outfocus: color.adjust(color.adjust($secondary-color, $lightness: 35%), $saturation: -15%) !default;


/*** Global ***/
// Media Query Ranges
$small-screen-up: 601px !default;
$medium-screen-up: 901px !default;
$large-screen-up: 1201px !default;
$small-screen: 600px !default;
$medium-screen: 900px !default;
$large-screen: 1200px !default;

$small-only: "only screen and (max-width : #{$small-screen})" !default;
$medium1-only: "only screen and (min-width : #{$small-screen-up}) and (max-width : #{$medium-screen})" !default;
$medium-only: "only screen and (min-width : #{$small-screen-up}) and (max-width : #{$large-screen})" !default;
$medium2-only: "only screen and (min-width : #{$medium-screen-up}) and (max-width : #{$large-screen})" !default;
$large-only: "only screen and (min-width : #{$large-screen-up})" !default;

$medium2-and-up: "only screen and (min-width : #{$medium-screen-up})" !default;
$medium-and-down: "only screen and (max-width : #{$large-screen})" !default;
$medium-and-up: "only screen and (min-width : #{$small-screen-up})" !default;

// Grid Variables
$num-cols: 12 !default;
$gutter-width: 1.5rem !default;
$element-top-margin: math.div($gutter-width, 3) !default;
$element-bottom-margin: math.div($gutter-width * 2, 3) !default;

/*** Navbar ***/
$navbar-height: 64px !default;
$navbar-height-mobile: 56px !default;
$navbar-font-color: #fff !default;
$navbar-brand-font-size: 2.1rem !default;

/*** SideNav ***/
$sidenav-bg-color: #fff !default;
$sidenav-padding-right: 15px !default;

/*** Spinners | Loaders ***/
$spinner-default-color: $secondary-color !default;

/*** Tabs ***/
$tabs-underline-color: white !default;
$tabs-text-color: white !default;
$tabs-bg-color: #5c5757 !default;

/*** Tables ***/
$table-border-color: #d0d0d0 !default;
$table-striped-color: #f2f2f2 !default;

/*** Toasts ***/
$toast-height: 48px !default;
$toast-color: #323232 !default;
$toast-text-color: #fff !default;

/*** Typography ***/
$off-black: rgba(0, 0, 0, 0.87) !default;
// Header Styles
$h1-fontsize: 4.2rem !default;
$h2-fontsize: 3.56rem !default;
$h3-fontsize: 2.92rem !default;
$h4-fontsize: 2.28rem !default;
$h5-fontsize: 1.64rem !default;
$h6-fontsize: 1rem !default;

// Footer
$footer-bg-color: $primary-color !default;

// Flowtext
$range : $large-screen - $small-screen !default;
$intervals: 20 !default;
$interval-size: calc($range / $intervals) !default;

/*** Collections ***/
$collection-border-color: #e0e0e0 !default;
$collection-bg-color: #fff !default;
$collection-active-bg-color: $secondary-color !default;
$collection-active-color: color.adjust($secondary-color, $lightness: 55%) !default;
$collection-hover-bg-color: #ddd !default;

/* Progress Bar */
$progress-bar-color: $secondary-color !default;