// Bootstrap core functions
@import "bootstrap/scss/functions";

//
// Theme Variables
//

// Paths
$img-path:                              "img" !default;
$fonts-path:                            "fonts" !default;
$lib-path:                              "/assets" !default;
$bootstrap-path:                        "bootstrap/scss" !default;

// Logo
$logo-bg:                               asset_path("#{$img-path}/logo.png");
$logo-bg-2x:                            asset_path("#{$img-path}/logo-xx.png");
$logo-white:                            asset_path("#{$img-path}/logo-white.png");
$logo-white-2x:                         asset_path("#{$img-path}/logo-white-xx.png");

// Theme Fonts
$roboto-font-path:                      'roboto' !default;
$roboto:                                'Roboto', Arial, sans-serif !default;

$icons-font-path:                       'material-design-icons/fonts' !default;
$icons-font:                            'Material Icons' !default;

//
// Bootstrap variables custom values
//

// Color System
$white:                                 #FFFFFF !default;
$gray-100:                              #f5f5f5 !default;
$gray-200:                              #dddddd !default;
$gray-300:                              #dee2e6 !default;
$gray-500:                              #a1a1a1 !default;
$gray-600:                              #878787 !default;
$gray-700:                              #636c72 !default;
$gray-800:                              #3d3c3c !default;
$black:                                 #000000 !default;

$green:                                 #60C060 !default;
$blue:                                  #5BC0DE !default;
$orange:                                #FF9900 !default;
$red:                                   #DF4B33 !default;

// Brand Colors
$primary:                                 #4285f4 !default;
$success:                                #34a853 !default;
$info:                                   #6ba4ff !default;
$warning:                                 #fbbc05 !default;
$danger:                                #ea4335 !default;
$light:                                  $white !default;
$dark:                                  $gray-800 !default;
$grey:                                  #cccccc !default;

// Enable contrast color calculations (Requires newer version of libsass)
$enable-contrast-calculation:           true !default;

// Special needed colors
$light-alt:                             #737373 !default;
$light-bg:                              rgba(115, 115, 115, 0.08);

// Brand Scale
$theme-colors: (
  "primary": $primary,
  "success": $success,
  "info": $info,
  "warning": $warning,
  "danger": $danger,
  "light": $light,
  "dark": $dark,
  "grey": $grey
) !default;

$grid-breakpoints: (
  xs: 0,
  sm: 576px,
  md: 768px,
  lg: 992px,
  xl: 1200px,
  xxl: 1500px
) !default;

// Left sidebar custom colors. In case you want to build the colors based on only one
// value, replace this array for a hex value
$left-sidebar-colors: (
  "left-sidebar-bg": $gray-100,
  "left-sidebar-text-color": shade-correction($gray-100, true),
  "left-sidebar-text-active-color": theme-color("primary"),
  "left-sidebar-divider-color": shade-contrast-correction(theme-color("primary"), $gray-100),
  "left-sidebar-progress-bar-color": theme-color("primary"),
  "left-sidebar-progress-bar-bg-color": darken($gray-100, 4%),
  "left-sidebar-sub-menu-arrow-color": shade-correction($gray-100),
  "left-sidebar-logo-bg": darken(theme-color("dark"), 1.5%),
  "left-sidebar-main-level-hover-text-color": #3d3d3d
) !default;

// Top header custom colors. In case you want to build the colors based on only one
// value, replace this array for a hex value
$top-header-colors: (
  "top-header-bg": $white,
  "top-header-text-color": #404040,
  "top-header-icons-open-color": theme-color("primary"),
  "top-header-icons-open-color-mobile": $white,
  "top-header-icons-color": lighten(#404040, 20%),
  "top-header-icons-color-mobile": $white,
  "top-header-indicator-color": theme-color("primary"),
  "top-header-phone-bg": theme-color("primary"),
  "top-header-link-color": darken($white, 55%),
  "top-header-nav-link-color-mobile": $white,
  "top-header-navbar-color-open": theme-color("primary")
) !default;

//Spacing
$spacer:                                 1rem !default; // 13px
$spacers: (
  0: 0,
  1: ($spacer / 2.6),
  2: ($spacer / 1.3),
  3: ($spacer * 1.154),
  4: ($spacer * 1.539),
  5: ($spacer * 1.923),
  6: ($spacer * 2.308),
  7: ($spacer * 3.077),
  8: ($spacer * 3.851)
) !default;

// Body
$body-bg:                               #EEEEEE !default;
$body-color:                            #404040 !default;

// Links
$link-color:                            theme-color("primary") !default;

// Components
$line-height-lg:                        1.7 !default;
$line-height-sm:                        1.6 !default;

$border-width:                          1px !default;
$border-color:                          $gray-300 !default;

$border-radius:                         2px !default;
$border-radius-lg:                      4px !default;
$border-radius-sm:                      2px !default;

$box-shadow-sm:                         0 .125rem .25rem rgba($black, .075) !default;
$box-shadow:                            0 .5rem 1rem rgba($black, .15) !default;
$box-shadow-lg:                         0 1rem 3rem rgba($black, .175) !default;

$component-active-color:                $white !default;
$component-active-bg:                   theme-color("primary") !default;

// Fonts
$font-family-sans-serif:                $roboto !default;

$line-height-base:                      1.428571429 !default;

$font-size-base:                        1rem !default;
$font-size-lg:                          $font-size-base * 1.15 !default;
$font-size-sm:                          $font-size-base * 0.85 !default;

$h1-font-size:                          $font-size-base * 2.539 !default;    //33px
$h2-font-size:                          $font-size-base * 2.077 !default;    //27px
$h3-font-size:                          $font-size-base * 1.769 !default;    //23px
$h4-font-size:                          $font-size-base * 1.308 !default;    //17px
$h5-font-size:                          $font-size-base;                     //13px
$h6-font-size:                          $font-size-base * 0.923 !default;    //12px

$headings-font-weight:                  300 !default;
$headings-line-height:                  1.1 !default;

$small-font-size:                       65% !default;

//Tables
$table-cell-padding:                    12px 10px !default;
$table-cell-padding-sm:                 7px !default;

$table-accent-bg:                       $gray-100 !default;
$table-hover-bg:                        #f0f0f0 !default;

// Dropdowns
$dropdown-border-color:                 darken(theme-color("light"), 11%) !default;
$dropdown-divider-bg:                   #e5e5e5 !default;
$dropdown-box-shadow:                   0px 0px 6px 0px rgba(0, 0, 0, 0.12) !default;

// Buttons
$input-btn-padding-y:                   .7692rem !default;
$input-btn-padding-x:                   .75rem !default;
$input-btn-line-height:                 $line-height-base !default;

$input-btn-focus-width:                 .15rem !default;
$input-btn-focus-color:                 transparent !default;
$input-btn-focus-box-shadow:            0 0 0 $input-btn-focus-width $input-btn-focus-color !default;

$input-btn-padding-y-sm:                .25rem !default;
$input-btn-padding-x-sm:                8px !default;
$input-btn-line-height-sm:              $line-height-sm !default;

$input-btn-padding-y-lg:                .5rem !default;
$input-btn-padding-x-lg:                12px !default;
$input-btn-line-height-lg:              $line-height-lg !default;

$input-btn-border-width:                $border-width !default;


$btn-box-shadow:                        none !default;
$btn-focus-box-shadow:                  0 0 0 $input-btn-focus-width rgba($gray-600, .5) !default;
$btn-active-box-shadow:                 none !default;
$btn-transition:                        none !default;

// Forms
$input-padding-y:                       $input-btn-padding-y !default;
$input-padding-x:                       $input-btn-padding-x !default;
$input-line-height:                     $input-btn-line-height !default;

$input-padding-y-sm:                    $input-btn-padding-y-sm !default;
$input-padding-x-sm:                    $input-btn-padding-x-sm !default;
$input-line-height-sm:                  $input-btn-line-height-sm !default;

$input-padding-y-lg:                    $input-btn-padding-y-lg !default;
$input-padding-x-lg:                    $input-btn-padding-x-lg !default;
$input-line-height-lg:                  $input-btn-line-height-lg !default;

$input-bg:                              $white !default;
$input-disabled-bg:                     $body-bg !default;

$input-color:                           $body-color !default;
$input-border-color:                    #d5d8de !default;
$input-border-width:                    $input-btn-border-width !default;
$input-box-shadow:                      inset 0 1px 1px rgba($black, .075) !default;

$input-border-radius:                   $border-radius !default;
$input-border-radius-lg:                $border-radius-lg !default;
$input-border-radius-sm:                $border-radius-sm !default;

$input-focus-bg:                        $input-bg !default;
$input-focus-border-color:              theme-color("primary") !default;
$input-focus-color:                     $input-color !default;
$input-focus-width:                     $input-btn-focus-width !default;
$input-focus-box-shadow:                $input-btn-focus-box-shadow !default;

$input-placeholder-color:               $gray-600 !default;
$input-plaintext-color:                 $body-color !default;

$input-height-border:                   $input-border-width * 2 !default;

$input-height-inner:                    ($font-size-base * $input-btn-line-height) + ($input-btn-padding-y * 2) !default;
$input-height:                          3.692rem !default;

$input-height-inner-sm:                 ($font-size-sm * $input-btn-line-height-sm) + ($input-btn-padding-y-sm * 2) !default;
$input-height-sm:                       2.3125rem !default;

$input-height-inner-lg:                 ($font-size-lg * $input-btn-line-height-lg) + ($input-btn-padding-y-lg * 2) !default;
$input-height-lg:                       2.846rem !default;

$input-transition:                      border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;

$form-check-inline-margin-x:            1.385rem !default;

$custom-control-gutter:                 .5rem !default;
$custom-control-spacer-y:               .5385rem !default;
$custom-control-spacer-x:               1.385rem !default;
$custom-control-indicator-size:         1.7rem !default;
$custom-control-label-line-height:      1.7;
$custom-control-vertical-padding:       .1875rem;

$form-group-margin-bottom:              1.538rem !default;
$custom-control-indicator-bg:           theme-color("light") !default;

$custom-control-indicator-checked-color:        theme-color("primary") !default;
$custom-control-indicator-checked-bg:           theme-color("light") !default;
$custom-control-indicator-focus-box-shadow:     0 0 0 2px rgba($gray-600, .4), 0 0 0 $input-btn-focus-width $input-btn-focus-color !default;
$custom-control-indicator-active-bg:            lighten(theme-color("primary"), 35%) !default;
$custom-control-indicator-checked-disabled-bg:  $input-disabled-bg;
$custom-checkbox-indicator-border-radius:       3px !default;
$custom-checkbox-indicator-icon-checked:        none !default;
$custom-radio-indicator-icon-checked:           none !default;

$input-group-addon-color:               $body-color !default;
$input-group-addon-bg:                  $gray-100 !default;
$input-group-addon-border-color:        $input-border-color !default;

$custom-file-height:                    $input-height !default;
$custom-file-height-inner:              $input-height-inner !default;
$custom-file-focus-border-color:        $input-focus-border-color !default;
$custom-file-focus-box-shadow:          $input-btn-focus-box-shadow !default;
$custom-file-disabled-bg:               $input-disabled-bg !default;

$custom-file-padding-y:                 $input-btn-padding-y !default;
$custom-file-padding-x:                 $input-btn-padding-x !default;
$custom-file-line-height:               $input-btn-line-height !default;
$custom-file-color:                     $input-color !default;
$custom-file-bg:                        $input-bg !default;
$custom-file-border-width:              $input-btn-border-width !default;
$custom-file-border-color:              $input-border-color !default;
$custom-file-border-radius:             $input-border-radius !default;
$custom-file-box-shadow:                $input-box-shadow !default;
$custom-file-button-color:              $custom-file-color !default;
$custom-file-button-bg:                 $input-group-addon-bg !default;
$custom-file-text: (
  en: "Browse"
) !default;


// Popovers
$popover-header-padding-y:              .6154rem !default;
$popover-header-padding-x:              1.077rem !default;

// Alerts
$alert-padding-y:                       1.385rem !default;
$alert-padding-x:                       1.385rem !default;

// Paginations
$pagination-color:                      $body-color !default;
$pagination-bg:                         #fff !default;
$pagination-border:                     #ddd !default;

$pagination-hover-bg:                   lighten($gray-200, 6%) !default;

// Cards
$card-border-radius:                    3px !default;
$card-spacer-y:                         0.7692rem !default;
$card-spacer-x:                         1.538rem !default;
$card-cap-bg:                           $white;
$card-header-margin-bottom:             20px !default;
$card-text-no-title-margin-top:         15px !default;
$card-container-margin-bottom:          25px !default;
$small-card-font-size:                       0.8462rem !default;

// Badges
$badge-padding-y:                       .07692rem !default;
$badge-padding-x:                       .6154rem !default;
$badge-text-color:                      theme-color("light");

$badge-pill-padding-x:                  .7em !default;

// Modals
$modal-lg:                              700px !default;
$modal-md:                              600px !default;

// Progress bars
$progress-height:                       3.077rem !default;
$progress-font-size:                    .9231rem !default;
$progress-bg:                           $gray-100 !default;
$progress-bar-animation-timing:         2s linear infinite !default;

// List group
$list-group-disabled-bg:                lighten($gray-200, 6%) !default;

// Breadcrumbs
$breadcrumb-padding-y:                  7px !default;
$breadcrumb-padding-x:                  20px !default;
$breadcrumb-item-padding:               0.6154rem !default;

$breadcrumb-bg:                         darken(theme-color("light"), 4%) !default;

$breadcrumb-active-color:               darken(theme-color("light"), 70%) !default;

// Close
$close-font-weight:                     bold !default;
$close-color:                           #000 !default;
$close-text-shadow:                     0 1px 0 #fff !default;

$code-color:                            theme-color("primary") !default;
$code-bg:                               #FAFAFA !default;

//
// Beagle Variables
//

// Gray Scale
$gray-darker:                           lighten($black, 13.5%) !default;
$gray-dark:                             lighten($black, 20%) !default;
$gray:                                  lighten($black, 33.5%) !default;
$gray-light:                            lighten($black, 46.7%) !default;
$gray-lighter:                          lighten($black, 93.5%) !default;

// Color Variations
@import "includes/colors";

$font-size-root:                        13px !default;

// Icons colors
$icon-default-color:                    darken(theme-color("light"), 55%) !default;
$icon-hover-color:                      darken(theme-color("light"), 75%) !default;

// Fonts
$font-size-xs:                          $font-size-base * 0.8 !default;

$font-weight-thin:                      100 !default;
$font-weight-light:                     300 !default;
$font-weight-normal:                    400 !default;
$font-weight-medium:                    500 !default;
$font-weight-bold:                      700 !default;
$font-weight-black:                     900 !default;

$paragraph-font-size:                   inherit !default;
$paragraph-line-height:                 21px !default;
$paragraph-margin:                      15px !default;

$list-lineheight:                       20px;

$display-heading-size:                  40px !default;
$display-heading-margin:                20px 0 15px !default;
$display-description-size:              18px !default;
$display-description-line-height:       29px !default;
$display-description-margin:            0 0 50px !default;

// Sidebars
$sidebars-hardware-accelerated-animation: true !default;
$sidebars-push-effect:                  all .35s ease !default;

// General Elements
$logo-width:                            102px !default;
$logo-height:                           27px !default;
$logo-padding:                          20px !default;
$body-background:                       #EEEEEE !default;
$link-color:                            (theme-color("primary") + 10%) !default;
$scroller-size:                         6px !default;//Scroller plugin width

// Aside
$page-aside-width:                      280px !default;
$page-aside-bg:                         theme-color("light") !default;
$page-aside-text-color:                 $body-color;
$page-aside-padding:                    22px !default;
$page-aside-title-size:                 27px !default;

// Top Header
$top-header-bg:                         is-custom-color($top-header-colors, "top-header-bg") !default;
$top-header-border-color:               darken($top-header-bg, 10%) !default;
$top-header-text-color:                 is-custom-color($vartype: $top-header-colors, $list-name: "top-header-text-color", $function-name: "shade-correction", $param1: $top-header-bg, $param3: true) !default;
$top-header-icons-color:                is-custom-color($top-header-colors, "top-header-icons-color", "assign", $top-header-text-color) !default;
$top-header-icons-color-mobile:         is-custom-color($top-header-colors, "top-header-icons-color-mobile", "assign", $top-header-text-color) !default;
$top-header-icons-open-color:           is-custom-color($top-header-colors, "top-header-icons-open-color", "assign", $top-header-icons-color) !default;
$top-header-icons-open-color-mobile:    $top-header-icons-color-mobile;
$top-header-phone-bg:                   is-custom-color($top-header-colors, "top-header-phone-bg") !default;
$top-header-indicator-color:            is-custom-color($top-header-colors, "top-header-indicator-color", "assign", $top-header-text-color) !default;
$top-header-indicator-color-mobile:     $top-header-icons-color-mobile;
$top-header-nav-link-color-mobile:      is-custom-color($top-header-colors, "top-header-nav-link-color-mobile", "assign", $top-header-text-color) !default;
$top-header-user-info-text-color:       $top-header-nav-link-color-mobile;
$top-header-link-color:                 darken(theme-color("light"), 55%) !default;
$top-header-height:                     60px !default;
$top-header-height-phone:               70px !default;
$top-header-navbar-color:               lighten($top-header-text-color, 10%) !default;
$top-header-navbar-color-open:          theme-color("primary") !default;
$top-header-navbar-font-size:           14px !default;
$top-header-navbar-padding:             18px !default;
$top-header-search-max-width:           800px !default;
$icons-nav-dropdown-width:              300px !default;
$user-dropdown-width:                   220px !default;

// Sub Navigation
$sub-navigation-bg:                     $gray-100 !default;
$sub-navigation-focus-color:            darken(theme-color("light"), 80%) !default;
$sub-navigation-collapse-padding:       16px 10px !default;

// Sub navigation -- Mega Menu
$sub-nav-height:                        50px !default;
$sub-nav-bg:                            $white !default;
$sub-nav-bg-mobile:                     lighten(theme-color("dark"), 3%) !default;
$sub-nav-item-padding:                  26px !default;
$sub-nav-mobile-vertical-padding:       .6rem !default;
$sub-nav-dropdown-min-width:            200px !default;
$sub-nav-dropdown-box-shadow:           0 3px 0.3077rem rgba(0, 0, 0, 0.1) !default;

$arrow-down-code:                       '\f2f2' !default;
$arrow-up-code:                         '\f2f8' !default;

// Top Header
$top-header-height:                     62px !default;
$top-header-height-responsive:          74px !default;
$top-header-bg:                         theme-color("dark") !default;
$top-header-bg-mobile:                  theme-color("primary") !default;
$top-header-menu-color:                 lighten(theme-color("dark"), 31%) !default;
$top-header-dropdown-color:             lighten(theme-color("dark"), 48.4%) !default;
$top-header-dropdown-min-width:         184px !default;
$top-header-logo-font-size:             1.5rem;
$icons-nav-dropdown-width:              330px !default;
$icons-nav-icons-size:                  25px !default;

// Mega Menu
$mega-menu-padding:                     15px 0 25px !default;
$mega-menu-column-vertical-spacing:     7px !default;
$mega-menu-section-padding:             10px 0 6px !default;
$mega-menu-section-margin:              0 0 15px !default;
$mega-menu-item-padding:                7px 23px !default;
$mega-menu-box-shadow:                  0 3px 0.3077rem rgba(0, 0, 0, 0.1) !default;

// Sub Header
$sub-header-mobile-bg:                  $white;
$sub-header-padding:                    25px 20px 0 !default;
$sub-header-navbar-height:              40px !default;
$sub-header-page-header-height:         71px !default;
$sub-header-tab-hover-color:            contrast-color(theme-color("primary")) !default;

// Navbar links
$navbar-default-link-color:             #777;
$navbar-default-link-hover-color:       #333;

// Navbar brand label
$navbar-default-brand-color:            $navbar-default-link-color !default;

// Left Sidebar
$left-sidebar-bg:                           is-custom-color($left-sidebar-colors, "left-sidebar-bg") !default;
$left-sidebar-width:                        230px !default;
$left-sidebar-text-color:                   is-custom-color($vartype: $left-sidebar-colors, $list-name: "left-sidebar-text-color", $function-name: "shade-correction", $param1: $left-sidebar-bg, $param3: true) !default;
$left-sidebar-text-active-color:            is-custom-color($left-sidebar-colors, "left-sidebar-text-active-color", "primary-contrast-correction", theme-color("primary"), $left-sidebar-bg) !default;
$left-sidebar-divider-color:                is-custom-color($left-sidebar-colors, "left-sidebar-divider-color", "shade-contrast-correction", theme-color("primary"), $left-sidebar-bg) !default;
$left-sidebar-progress-bar-color:           is-custom-color($left-sidebar-colors, "left-sidebar-progress-bar-color", "primary-contrast-correction", theme-color("primary"), $left-sidebar-bg) !default;
$left-sidebar-progress-bar-bg-color:        is-custom-color($vartype: $left-sidebar-colors, $list-name: "left-sidebar-progress-bar-bg-color", $function-name: "lighten", $param1: $left-sidebar-progress-bar-color, $param5: 10%) !default;
$left-sidebar-sub-menu-arrow-color:         is-custom-color($left-sidebar-colors, "left-sidebar-sub-menu-arrow-color", "shade-correction", $left-sidebar-bg) !default;
$left-sidebar-logo-bg:                      is-custom-color($vartype: $left-sidebar-colors, $list-name: "left-sidebar-logo-bg", $function-name: "darken", $param1: theme-color("dark"), $param5: 1.5%) !default;
$left-sidebar-icon-size:                    19px !default;
$left-sidebar-main-level-font-size:         1.077rem !default;
$left-sidebar-main-level-hover-bg:          darken($left-sidebar-bg, 2%);
$left-sidebar-main-level-hover-text-color:  is-custom-color($left-sidebar-colors, "left-sidebar-main-level-hover-text-color", "assign", $left-sidebar-text-active-color) !default;
$left-sidebar-main-level-padding:           20px !default;
$left-sidebar-main-level-height:            38px !default;
$left-sidebar-main-level-label-margin:      ($left-sidebar-main-level-height / 2) - 10px  !default;
$left-sidebar-sub-level-color:              $left-sidebar-text-color !default;
$left-sidebar-sub-level-bg:                 darken($left-sidebar-bg, 2.8%) !default;
$left-sidebar-sub-level-font-size:          13px !default;
$left-sidebar-sub-level-padding:            8px 15px 8px 49px !default;
$left-sidebar-multilevel-sub-level-padding: 49px !default;
$left-sidebar-collapsible-submenu-padding:  25px !default;
$left-sidebar-collapsed-width:              60px !default;
$left-sidebar-collapsed-submenu-width:      232px !default;

// Right Sidebar
$right-sidebar-width:                   290px !default;
$right-sidebar-width-phone:             290px !default;
$right-sidebar-icons-color:             darken(theme-color("light"), 33.2%) !default;
$right-sidebar-low-contrast-color:      darken(theme-color("light"), 30%) !default;
$right-sidebar-background:              $code-bg !default;

// Sub navigation collapse
$sub-navigation-text-active-color:      $left-sidebar-text-active-color !default;

// Dropdowns
$dropdown-text-color:                   lighten(theme-color("dark"), 7.2%) !default;
$dropdown-bg:                           #fff !default;
$dropdown-fallback-border:              $dropdown-border-color !default;

// Cards & Widget Cards
$card-border-radius:                    $card-border-radius !default;
$card-body-padding:                     15px 20px 20px !default;
$card-body-horizontal-padding:          20px !default;
$card-body-top-padding:                 8px !default;
$card-body-bottom-padding:              20px !default;
$card-heading-horizontal-padding:       $card-spacer-x !default;
$card-heading-top-padding:              ($card-spacer-y * 2) !default;
$card-heading-bottom-padding:           $card-spacer-y !default;
$card-heading-padding:                  $card-heading-top-padding $card-heading-horizontal-padding $card-heading-bottom-padding !default;
$card-heading-subtitle-margin:          0.4615rem !default;
$card-heading-font-size:                18px !default;
$card-heading-font-weight:              $font-weight-light !default;
$card-heading-icon-color:               darken(theme-color("light"), 27%) !default;
$card-heading-icon-hover:               darken(theme-color("light"), 35%) !default;
$card-heading-icon-size:                1.538rem !default;
$card-heading-icon-separation:          2px !default;
$card-heading-icon-line-height:         25px !default;
$card-margin-bottom:                    25px !default;
$card-box-shadow:                       0 0 4px 0 rgba(0,0,0,0.04) !default;

$widget-heading-font-size:              1.385rem !default;
$widget-heading-font-weight:            300 !default;
$widget-horizontal-padding:             20px !default;
$widget-horizontal-padding-small:       15px !default;
$widget-margin-bottom:                  $card-margin-bottom !default;

// Buttons
$btn-padding-vertical:                  0 !default;
$btn-padding-horizontal:                10px !default;
$btn-font-size-base:                    $font-size-base !default;
$btn-line-height-base:                  28px !default;
$btn-border-radius-base:                2px !default;
$btn-box-shadow-base:                   0 1px 0 rgba(0, 0, 0, .05) !default;

$btn-primary-color:                     $white !default;
$btn-primary-bg:                        theme-color("primary");
$btn-primary-border:                    $btn-primary-bg !default;

$btn-secondary-color:                   $body-color !default;
$btn-secondary-bg:                      theme-color("light") !default;
$btn-secondary-border:                  darken(theme-color("light"), 14%) !default;

$btn-info-color:                        $white !default;
$btn-info-bg:                           theme-color("info");
$btn-info-border:                       $btn-info-bg !default;

$btn-success-color:                     $white !default;
$btn-success-bg:                        theme-color("success");
$btn-success-border:                    $btn-success-bg !default;

$btn-warning-color:                     $white !default;
$btn-warning-bg:                        theme-color("warning");
$btn-warning-border:                    $btn-warning-bg !default;

$btn-danger-color:                      $white !default;
$btn-danger-bg:                         theme-color("danger");
$btn-danger-border:                     $btn-danger-bg !default;

$btn-light-color:                       $body-color !default;
$btn-light-bg:                          theme-color("light");
$btn-light-border:                      $btn-light-bg !default;

$btn-dark-color:                        theme-color("light") !default;
$btn-dark-bg:                           theme-color("dark");
$btn-dark-border:                       theme-color("dark");

$btn-font-weight:                       $font-weight-bold !default;
$btn-icon-margin:                       1px !default;

//Sizes
$btn-xs-font-size:                      $btn-font-size-base - .1538rem !default;
$btn-xs-padding-horizontal:             6px !default;
$btn-xs-line-height:                    18px !default;
$btn-xs-border-radius:                  1px !default;

$btn-sm-font-size:                      $btn-font-size-base !default;
$btn-sm-padding-horizontal:             8px !default;
$btn-sm-line-height:                    22px !default;
$btn-sm-border-radius:                  2px !default;

$btn-lg-font-size:                      $btn-font-size-base + .1538rem !default;
$btn-lg-padding-horizontal:             12px !default;
$btn-lg-line-height:                    38px !default;
$btn-lg-border-radius:                  3px !default;

$btn-xl-font-size:                      $btn-font-size-base + .1538rem !default;
$btn-xl-padding-horizontal:             12px !default;
$btn-xl-line-height:                    43px !default;
$btn-xl-border-radius:                  3px !default;

// Alert States
$state-primary-text:                    $primary-color-text !default;
$state-primary-bg:                      theme-color("primary") !default;
$state-primary-border:                  theme-color("primary") !default;

$state-success-text:                    $success-color-text !default;
$state-success-bg:                      theme-color("success") !default;
$state-success-border:                  theme-color("success") !default;

$state-info-text:                       $info-color-text !default;
$state-info-bg:                         theme-color("info") !default;
$state-info-border:                     theme-color("info") !default;

$state-warning-text:                    $warning-color-text !default;
$state-warning-bg:                      theme-color("warning") !default;
$state-warning-border:                  theme-color("warning") !default;

$state-danger-text:                     theme-color("danger") !default;
$state-danger-bg:                       theme-color("danger") !default;
$state-danger-border:                   theme-color("danger") !default;

$state-light-text:                      $body-color !default;
$state-light-bg:                        theme-color("light") !default;
$state-light-border:                    theme-color("light") !default;
$state-light-icon-color:                $light-alt !default;

$state-dark-text:                       $gray-500 !default;
$state-dark-bg:                         $gray-500 !default;
$state-dark-border:                     $gray-500 !default;

// Alerts
$alert-icon-width:                      60px !default;

$alert-primary-bg:                      $state-primary-bg !default;
$alert-primary-border:                  $state-primary-border !default;

$alert-success-bg:                      $state-success-bg !default;
$alert-success-border:                  $state-success-border !default;

$alert-info-bg:                         $state-info-bg !default;
$alert-info-border:                     $state-info-border !default;

$alert-warning-bg:                      $state-warning-bg !default;
$alert-warning-border:                  $state-warning-border !default;

$alert-danger-bg:                       $state-danger-bg !default;
$alert-danger-border:                   $state-danger-border !default;

$alert-light-bg:                        $state-light-bg !default;
$alert-light-border:                    $state-light-border !default;
$alert-light-icon-color:                $state-light-icon-color !default;

$alert-dark-bg:                         $state-dark-bg !default;
$alert-dark-border:                     $state-dark-border !default;

// Badges
$badge-color:                           $body-color !default;

// Status color
$status-online:                         #00b777 !default;
$status-offline:                        #e65a5a !default;
$status-away:                           #f2c329 !default;

//Progress bars
$progress-line-height:                   22px !default;

// Dividers
$divider-border:                        1px solid darken(theme-color("light"), 5%) !default;
$divider-margin:                        10px !default;
$divider-lg-margin:                     15px !default;
$divider-xl-margin:                     20px !default;

// Loader
$loader-background:                     rgba(255, 255, 255, 0.7) !default;

// Pricing Tables
$pricing-tables-margin:                 30px 0 20px !default;
$pricing-table-border-radius:           $card-border-radius !default;
$pricing-table-horizontal-space:        10px !default;
$pricing-table-padding:                 35px 20px !default;
$pricing-table-margin:                  0 0 20px !default;
$pricing-table-value-size:              35px !default;
$pricing-table-price-line-height:       40px !default;
$pricing-table-frecuency-size:          1.538rem !default;
$pricing-table-fatures-line-height:     33px !default;
$pricing-table-button-height:           36px !default;
$pricing-table-button-min-width:        120px !default;

// Table Filters
$table-filter-title-font-size:          13px !default;
$table-filters-padding:                 25px !default;
$table-container-filter-padding:        5px 0 15px !default;

// Forms
$radio-icon-component-size:             52px !default;
$radio-icon-component-icon-size:        36px !default;
$radio-icon-component-border:           #d5d8de !default;

$input-top-border:                      #bdc0c7 !default;

$input-label-color:                     lighten($input-color, 15%) !default;

$input-check-component-size:            1.699rem !default;
$input-check-component-border:          1px solid #ccc !default;
$input-check-component-border-radius:   $custom-checkbox-indicator-border-radius !default;
$input-check-component-margin:          0 0 !default;

// Form Validation States
$form-validation-icon-size:             19px !default;

// Pages
$splash-screen-bg:                      #eee !default;

// Boxed Layout
$boxed-layout-width:                    1200px !default;

// Login page
$login-width:                           401px !default;
$login-margin-top:                      50px !default;

// Sign up page
$sign-up-width:                         433px !default;
$sign-up-margin-top:                    10px !default;

//Email pages
$email-page-favorite-color:             #FFC600 !default;

//Booking page
$booking-container-padding:             26px !default;
$booking-container-padding-responsive:  15px 0 !default;
$booking-promo-border-radius:           3px !default;
$booking-promo-bg:                      theme-color("light") !default;
$booking-promo-padding:                 23px 30px 26px !default;

// Charts
$chart-legend-color-size:               10px !default;
$chart-legend-padding:                  6px !default;
$chart-pie-counter-size:                3.846rem !default;

// Timeline
$timeline-max-width:                    840px !default;
$timeline-left-padding:                 210px !default;
$timeline-vbar-position:                $timeline-left-padding - 40px !default;// From timeline-item element to left
$timeline-margin-helper:                10px !default; //Helper to thumbnails whitout damage timeline content size
$timeline-avatar-size:                  35px !default;
$timeline-content-min-height:           85px !default;
$timeline-header-line-height:           21px !default;
$timeline-header-padding-top:           ($timeline-avatar-size - $timeline-header-line-height) / 2 !default;
$timeline-content-vpadding:             25px !default;
$timeline-date-width:                   $timeline-vbar-position - 25px !default;
$timeline-date-position:                ceil($timeline-content-vpadding + $timeline-header-padding-top) + 2px !default;
$timeline-tail-size:                    10px !default;
$timeline-tail-position:                ceil($timeline-content-min-height - $timeline-tail-size) / 2 !default;
$timeline-bubble-size:                  16px !default;
$timeline-bubble-position:              ceil($timeline-content-min-height - $timeline-bubble-size) / 2 !default;
$timeline-icon-size:                    44px !default;
$timeline-icon-border-width:            2px !default;
$timeline-icon-position:                floor(($timeline-content-min-height - $timeline-icon-size) / 2) !default;

// Invoice
$invoice-page-padding:                  100px 100px 70px !default;
$invoice-tablet-padding:                50px 50px 35px !default;
$invoice-small-phone-padding:           35px 25px 15px !default;
$invoice-logo-height:                   $logo-height * 2 !default;
$invoice-logo-width:                    $logo-width * 2 !default;
$invoice-logo-small-height:             $logo-height !default;
$invoice-logo-small-width:              $logo-width !default;
$invoice-header-margin:                 100px !default;
$invoice-id-font-size:                  2.308rem !default;
$invoice-id-lineheight:                 $invoice-id-font-size !default;
$invoice-data-margin:                   110px !default;
$invoice-person-font-size:              1.385rem !default;
$invoice-person-lineheight:             2rem !default;
$invoice-direction-height:              130px !default;
$invoice-direction-bubble-size:         80px !default;
$invoice-details-font-size:             1.231rem !default;
$invoice-payment-font-size:             1.385rem !default;
$invoice-payment-lineheight:            2rem !default;
$invoice-payment-margin:                75px !default;
$invoice-message-font-size:             1.231rem !default;
$invoice-message-lineheight:            2rem !default;
$invoice-message-margin:                62px !default;
$invoice-company-info-margin:           70px !default;
$invoice-footer-button-font-size:       1.077rem !default;

// Widgets

// User Profile Display Widget
$user-profile-widget-avatar-size:        110px !default;

// User Progress Widget
$user-progress-height:                   10px !default;

//Vector Maps
$vector-map-zoom-button-size:            30px !default;
$vector-map-zoom-font-size:              22px !default;
$vector-map-zoom-line-height:            24px !default;

// Social Colors
$facebook:                               #5d82d1 !default;
$twitter:                                #50bff5 !default;
$google-plus:                            #eb5e4c !default;
$dribbble:                               #f7659c !default;
$youtube:                                #ef4e41 !default;
$flickr:                                 #0063dc !default;
$linkedin:                               #238cc8 !default;
$pinterest:                              #e13138 !default;
$github:                                 #333 !default;
$tumblr:                                 #426d9b !default;
$evernote:                               #2DBE60 !default;
$dropbox:                                #007EE5 !default;

// Plugins

// Gritter Notifications
$notification-width:                     360px !default;
$notification-top-position:              82px !default;

// Select2
$select2-border-width:                   .07692rem !default;

//Parsley
$parsley-error-bg:                       $danger-color-text;

// Forms
$radio-icon-component-color:             lighten($input-color, 25%) !default;

// Bootstrap Core Variables
@import "bootstrap/scss/variables";

// Nifty Modals
$modal-prefix:                           modal;
$modal-zindex:                           $zindex-modal;

// input Sizing
$input-height-xs:                       ((1rem * $line-height-sm) + ($input-btn-padding-y * 2));


// Mega Menu
$mega-menu-zindex:                      $zindex-dropdown - 1;

// Sub navigation -- Mega Menu
$sub-nav-dropdown-item-color:           lighten($body-color, 5%);

// Print
$print:                                 "print";

// Retina Display
$retina:                                "(-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi)";
$high-dpi:                              "only screen and (-webkit-min-device-pixel-ratio: 1.3), only screen and (-o-min-device-pixel-ratio: 13/10), only screen and (min-resolution: 120dpi)";

// Google Chrome Query
$webkit:                                "screen and (-webkit-min-device-pixel-ratio:0)";

// IE8 Media Query
$ie8:                                   "\0screen";

// IE9 & IE10 Media Query
$ie910:                                 "screen and (min-width:0\0)";

// IE 10+ Media Query
$ie10:                                  "all and (-ms-high-contrast: none), (-ms-high-contrast: active)";

// IOS
$ios:                                   "(-webkit-overflow-scrolling: touch)";
