// Brand Colors
// -------------------------------

$brand-default:         #fff;
$brand-secondary:       #f5f5f5;
$brand-primary:         #4a87ee;
$brand-info:            #43cee6;
$brand-success:         #66cc33;
$brand-warning:         #f0b840;
$brand-danger:          #ef4e3a;
$brand-dark:            #444;


// Scaffolding
// -------------------------------

$link-color:            $brand-primary !default;
$link-hover-color:      darken($link-color, 15%) !default;


// Global Gray Colors
// -------------------------------

$black:                 #000 !default;
$gray-darker:           lighten(#000, 13.5%) !default; // #222
$gray-dark:             lighten(#000, 20%) !default;   // #333
$gray:                  lighten(#000, 33.5%) !default; // #555
$gray-light:            lighten(#000, 60%) !default;   // #999
$gray-lighter:          lighten(#000, 93.5%) !default; // #eee
$white:                 #fff !default;


// Global Accent Colors
// -------------------------------

$blue:                 #049cdb !default;
$blue-dark:            #0064cd !default;
$green:                #46a546 !default;
$red:                  #9d261d !default;
$yellow:               #ffc40d !default;
$orange:               #f89406 !default;
$pink:                 #c3325f !default;
$purple:               #7a43b6 !default;

$component-active-bg:            $brand-primary !default;


// Global Fonts
// -------------------------------

$sans-font-family:         "Helvetica Neue", Helvetica, Arial, sans-serif !default;
$light-sans-font-family:   "Helvetica Neue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif !default;
$serif-font-family:        Georgia, "Times New Roman", Times, serif !default;
$mono-font-family:         Monaco, Menlo, Consolas, "Courier New", monospace !default;


// Base
// -------------------------------

$base-font-family:          $sans-font-family;
$base-background-color:     $white;
$base-color:                #000;
$content-padding:           10px !default;
$border-radius-base:        4px !default;
$border-radius-large:       6px !default;
$border-radius-small:       3px !default;


// Typography
// -------------------------------

$font-family-sans-serif:    "Helvetica Neue", Helvetica, Arial, sans-serif !default;
$font-family-serif:         Georgia, "Times New Roman", Times, serif !default;
$font-family-monospace:     Monaco, Menlo, Consolas, "Courier New", monospace !default;
$font-family-base:          $font-family-sans-serif !default;

$font-size-base:            14px !default;
$font-size-large:           17px !default; // ~18px
$font-size-small:           11px !default;

$line-height-base:          1.428571429 !default; // 20/14
$line-height-computed:      floor($font-size-base * $line-height-base) !default; // ~20px

$headings-font-family:      $font-family-base !default;
$headings-font-weight:      500 !default;
$headings-line-height:      1.1 !default;


// Components
// -------------------------------

// Based on 14px font-size and 1.428 line-height (~20px to start)

$padding-base-vertical:          6px !default;
$padding-base-horizontal:        12px !default;

$padding-large-vertical:         10px !default;
$padding-large-horizontal:       16px !default;

$padding-small-vertical:         5px !default;
$padding-small-horizontal:       10px !default;

$line-height-large:              1.33 !default;
$line-height-small:              1.5 !default;

$border-radius-base:             4px !default;
$border-radius-large:            6px !default;
$border-radius-small:            3px !default;

$caret-width-base:               4px !default;
$caret-width-large:              5px !default;


// Forms
// -------------------------------

$input-height-base:              ($line-height-computed + ($padding-base-vertical * 2) + 2) !default;
$input-height-large:             (floor($font-size-large * $line-height-large) + ($padding-large-vertical * 2) + 2) !default;
$input-height-small:             (floor($font-size-small * $line-height-small) + ($padding-small-vertical * 2) + 2) !default;

$input-bg:                        $white  !default;
$input-bg-disabled:               $gray-lighter !default;

$input-color:                     $gray !default;
$input-label-color:               $black !default;
$input-border-color:              #ccc !default;
$input-border-width:              1px !default;
$input-border-radius:             2px !default;
$input-border-focus:              #66afe9 !default;

$input-color-placeholder:         $gray-light !default;

$legend-color:                    $gray-dark !default;
$legend-border-color:             #e5e5e5 !default;

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


// Toggle
// -------------------------------

$toggle-width:                    54px;
$toggle-height:                   32px;
$toggle-border-width:             2px;
$toggle-border-radius:            20px;

$toggle-handle-width:             $toggle-height - ($toggle-border-width * 2);
$toggle-handle-height:            $toggle-handle-width;
$toggle-handle-radius:            50%;

$toggle-off-bg-color:             #E5E5E5;
$toggle-off-border-color:         #E5E5E5;

$toggle-on-bg-color:              #4A87EE;
$toggle-on-border-color:          $toggle-on-bg-color;

$toggle-handle-off-bg-color:      $white;
$toggle-handle-on-bg-color:       $toggle-handle-off-bg-color;

$toggle-transition-duration:      .1s;


// Checkbox
// -------------------------------

$checkbox-width:                  28px;
$checkbox-height:                 28px;
$checkbox-border-radius:          50%;
$checkbox-border-width:           1px;

$checkbox-off-bg-color:           #fff;
$checkbox-off-border-color:       #4A87EE;

$checkbox-on-bg-color:            #4A87EE;
$checkbox-on-border-color:        #4A87EE;

$checkbox-check-width:            3px;
$checkbox-check-color:            #fff;


// Range
// -------------------------------

$range-track-height:           4px;
$range-track-color:            #ccc;
$range-slider-width:           20px;
$range-slider-height:          20px;
$range-slider-border-radius:   10px;


// Alerts
// -------------------------------

$alert-padding:      8px 35px 8px 14px;
$alert-margin:       $content-padding;

$warning-text:       #c09853;
$warning-bg:         #fcf8e3;
$warning-border:     darken(adjust-hue($warning-bg, -10), 3%);

$error-text:         #b94a48;
$error-bg:           #f2dede;
$error-border:       darken(adjust-hue($error-bg, -10), 3%);

$success-text:       #468847;
$success-bg:         #dff0d8;
$success-border:     darken(adjust-hue($success-bg, -10), 5%);

$info-text:          #3a87ad;
$info-bg:            #d9edf7;
$info-border:        darken(adjust-hue($info-bg, -10), 7%);


// Buttons
// -------------------------------

$button-bar-button-line-height:   15px !default;

$button-color:                    #222;
$button-padding:                  8px 12px;
$button-block-margin:             10px !default;
$button-clear-padding:            4px 5px;
$button-border-radius:            2px;
$button-border-width:             1px;
$button-font-size:                16px;

$button-default-bg:               $brand-default;
$button-default-border:           #ddd;
$button-default-active-bg:        #fafafa;
$button-default-active-border:    #bbb;

$button-secondary-bg:             $brand-secondary;
$button-secondary-border:         #bbb;
$button-secondary-active-bg:      #e5e5e5;
$button-secondary-active-border:  #999;

$button-primary-bg:               $brand-primary;
$button-primary-border:           #3b6dc2;
$button-primary-active-bg:        #4175ce;
$button-primary-active-border:    #32599c;

$button-info-bg:                  $brand-info;
$button-info-border:              #3bb3c8;
$button-info-active-bg:           #3db8cd;
$button-info-active-border:       #3293a4;

$button-success-bg:               $brand-success;
$button-success-border:           #5bb22f;
$button-success-active-bg:        #55aa2b;
$button-success-active-border:    #448922;

$button-warning-bg:               $brand-warning;
$button-warning-border:           #d29f31;
$button-warning-active-bg:        #e2a114;
$button-warning-active-border:    #b88517;

$button-danger-bg:                $brand-danger;
$button-danger-border:            #c73927;
$button-danger-active-bg:         #ce4331;
$button-danger-active-border:     #9f3527;

$button-dark-bg:                  $brand-dark;
$button-dark-border:              #111;
$button-dark-active-bg:           #222;
$button-dark-active-border:       #000;


// Bars
// -------------------------------

$bar-height:                     44px !default;
$bar-button-line-height:         23px !default;
$bar-button-clear-line-height:   34px !default;
$bar-button-bar-line-height:     18px !default;
$bar-title-font-size:            $font-size-large;
$bar-padding-portrait:           5px;
$bar-padding-landscape:          5px;

$bar-bg:                      #fff;

$bar-transparency: 0.9;
// Bar variations
$bar-default-bg:              rgba($brand-default, $bar-transparency);
$bar-default-border-color:    #ddd;

$bar-secondary-bg:            rgba($brand-secondary, $bar-transparency);
$bar-secondary-border-color:  $button-secondary-border;

$bar-primary-bg:              rgba($brand-primary, $bar-transparency);
$bar-primary-border-color:    $button-primary-border;

$bar-info-bg:                 rgba($brand-info, $bar-transparency);
$bar-info-border-color:       $button-info-border;

$bar-success-bg:              rgba($brand-success, $bar-transparency);
$bar-success-border-color:    $button-success-border;

$bar-warning-bg:              rgba($brand-warning, $bar-transparency);
$bar-warning-border-color:    $button-warning-border;

$bar-danger-bg:               rgba($brand-danger, $bar-transparency);
$bar-danger-border-color:     $button-danger-border;

$bar-dark-bg:                 rgba($brand-dark, $bar-transparency);
$bar-dark-border-color:       $button-dark-border;


// Tabs
// -------------------------------

$tabs-height:                 49px !default;

$tabs-default-bg:              $brand-default;
$tabs-default-border-color:    $button-default-border;

$tabs-secondary-bg:            $brand-secondary;
$tabs-secondary-border-color:  $button-secondary-border;

$tabs-primary-bg:              $brand-primary;
$tabs-primary-border-color:    $button-primary-border;

$tabs-info-bg:                 $brand-info;
$tabs-info-border-color:       $button-info-border;

$tabs-success-bg:              $brand-success;
$tabs-success-border-color:    $button-success-border;

$tabs-warning-bg:              $brand-warning;
$tabs-warning-border-color:    $button-warning-border;

$tabs-danger-bg:               $brand-danger;
$tabs-danger-border-color:     $button-danger-border;

$tabs-dark-bg:                 $brand-dark;
$tabs-dark-border-color:       $button-dark-border;


// Lists
// -------------------------------

$list-font-size:                  16px;

$list-header-bg:                  transparent;
$list-header-color:               #222;
$list-header-padding:             5px 15px;
$list-header-margin-top:          20px !default;

$list-divider-bg:                 #f5f5f5;
$list-divider-color:              #222;
$list-divider-padding:            5px 15px;

$list-item-border-width:          1px !default;
$list-item-border-color:          #ddd;
$list-item-padding:               15px !default;

$list-default-background:         $brand-default;
$list-default-border:             #ddd;

$list-secondary-background:       $brand-secondary;
$list-secondary-border:           #ddd;

$list-success-background:         $brand-success;
$list-success-border:             $brand-success;

$list-primary-background:         $brand-primary;
$list-primary-border:             $brand-primary;

$list-info-background:            $brand-info;
$list-info-border:                $brand-info;

$list-warning-background:         $brand-warning;
$list-warning-border:             $brand-warning;

$list-danger-background:          $brand-danger;
$list-danger-border:              $brand-danger;

$list-dark-background:            $brand-dark;
$list-dark-border:                $brand-dark;

$list-icon-font-size:             28px !default;

$list-thumbnail-width:           40px !default;
$list-thumbnail-height:          40px !default;

$list-thumbnail-lrg-width:        80px !default;
$list-thumbnail-lrg-height:       80px !default;


// Icons
// -------------------------------

$icon-fill-border-radius:     6px !default;


// Menus
// -------------------------------

$menu-bg:                   #eee;
$menu-inset-border-color:   #bbb;
$menu-width:               270px;
$menu-animation-speed:     200ms;


// Cards
// -------------------------------

$card-header-bg:            #F5F5F5;
$card-body-bg:              #fff;
$card-footer-bg:            #F5F5F5;
$card-padding:              10px !default;
$card-border-width:         1px !default;
$card-border-color:         #ccc;
$card-border-radius:        2px !default;


// Modals
// -------------------------------

$modal-bg-color:              #fff !default;


// Action Sheets
// -------------------------------

$sheet-bg-color:              rgba(255, 255, 255, 0.6) !default;
$sheet-opacity:               0.95 !default;
$sheet-border-radius:         3px !default;


// Badges
// -------------------------

$badge-color:                 #fff !default;
$badge-link-hover-color:      #fff !default;
$badge-bg:                    $gray-light !default;

$badge-active-color:          $link-color !default;
$badge-active-bg:             #fff !default;

$badge-font-size:             14px !default;
$badge-line-height:           16px !default;
$badge-font-weight:           bold !default;
$badge-border-radius:         10px !default;


// Media queries breakpoints
// -------------------------------

// Extra small screen / phone
$screen-xs:                  480px !default;
$screen-phone:               $screen-xs !default;

// Small screen / tablet
$screen-sm:                  768px !default;
$screen-tablet:              $screen-sm !default;

// Medium screen / desktop
$screen-md:                  992px !default;
$screen-desktop:             $screen-md !default;

// Large screen / wide desktop
$screen-lg:                  1200px !default;
$screen-lg-desktop:          $screen-lg !default;

// So media queries don't overlap when required, provide a maximum
$screen-xs-max:              ($screen-sm - 1) !default;
$screen-sm-max:              ($screen-md - 1) !default;
$screen-md-max:              ($screen-lg - 1) !default;


// Z-Indexes
// -------------------------------

$zindex-modal: 10;