// 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;


// 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:           ceil($font-size-base * 1.25) !default; // ~18px
$font-size-small:           ceil($font-size-base * 0.85) !default; // ~12px

$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;


// Content stuff
// -------------------------------
$content-padding:           10px;
$inset-margin:              10px;
$border-radius-base:        4px !default;
$border-radius-large:       6px !default;
$border-radius-small:       3px !default;


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


// Button bar stuff
// -------------------------------
$button-bar-button-line-height:	 15px !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;


// Lists
// -------------------------------
$list-item-border:         1px solid #ddd;


// Menus
// -------------------------------
$menu-width:               270px;
$menu-animation-speed:     200ms;


// 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;


// Grid system
// -------------------------------
// Number of columns in the grid system
$grid-columns:              12 !default;
// Padding, to be divided by two and applied to the left and right of all columns
$grid-gutter-width:         30px !default;
// Point at which the navbar stops collapsing
$grid-float-breakpoint:     $screen-tablet !default;


// Container sizes
// -------------------------------

// Small screen / tablet
$container-tablet:            ((720px + $grid-gutter-width)) !default;

// Medium screen / desktop
$container-desktop:           ((940px + $grid-gutter-width)) !default;

// Large screen / wide desktop
$container-lg-desktop:        ((1140px + $grid-gutter-width)) !default;