// prefix
$css-prefix             = 'view-'

// Color
$primary-color          := #2d8cf0
$info-color             := #2db7f5
$success-color          := #19be6b
$warning-color          := #ff9900
$error-color            := #ed3f14
$link-color             := #2d8cf0
$link-hover-color       := tint($link-color, 20%)
$link-active-color      := shade($link-color, 5%)
$selected-color         := fade($primary-color, 90%)
$tooltip-color          := #fff
$subsidiary-color       := #80848f
$rate-star-color        := #f5a623

// Base
$font-family            := "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif
$code-family            := Consolas,Menlo,Courier,monospace
$text-color             := #495060
$font-size-base         := 14px
$font-size-small        := 12px
$line-height-base       := 1.5
$border-radius-base     := 6px
$border-radius-small    := 4px
$cursor-disabled        := not-allowed

// Legend
$legend-color           := #999

// Border color
$border-color-base      := #dddee1  // outside
$border-color-split     := #e9eaec  // inside

// Button
$btn-font-weight        := 400
$btn-padding-base       := 6px 15px
$btn-padding-large      := 6px 15px 7px 15px
$btn-padding-small      := 2px 7px
$btn-font-size          := 12px
$btn-font-size-large    := 14px
$btn-border-radius      := 4px
$btn-border-radius-small:= 3px
$btn-group-border       := shade($primary-color, 5%)

$btn-disable-color      := #bbbec4
$btn-disable-bg         := $background-color-base
$btn-disable-border     := $border-color-base

$btn-default-color      := $text-color
$btn-default-bg         := $background-color-base
$btn-default-border     := $border-color-base

$btn-primary-color      := #fff
$btn-primary-bg         := $primary-color

$btn-ghost-color        := $text-color
$btn-ghost-bg           := transparent
$btn-ghost-border       := $border-color-base

$btn-circle-size        := 32px
$btn-circle-size-large  := 36px
$btn-circle-size-small  := 24px

// Input
$input-height-base           := 32px
$input-height-large          := 36px
$input-height-small          := 24px

$input-padding-horizontal    := 7px
$input-padding-vertical-base := 4px
$input-padding-vertical-small:= 1px
$input-padding-vertical-large:= 6px

$input-placeholder-color     := $btn-disable-color
$input-color                 := $text-color
$input-border-color          := $border-color-base
$input-bg                    := #fff

$input-hover-border-color    := $primary-color
$input-focus-border-color    := $primary-color
$input-disabled-bg           := #f3f3f3
$input-border-radius         := 4px

// menu
$menu-line-height       := 64px

// Background color
$background-color-base        := #f7f7f7  // base
$background-color-select-hover:= $input-disabled-bg
$tooltip-bg                   := rgba(70, 76, 91, .9)
$head-bg                      := #f9fafc
$table-thead-bg               := #f8f8f9
$table-td-stripe-bg           := #f8f8f9
$table-td-hover-bg            := #ebf7ff
$table-td-highlight-bg        := #ebf7ff
$menu-dark-title              := #495060
$menu-dark-active-bg          := #363e4f
$menu-dark-subsidiary-color   := rgba(255,255,255,.7)
$menu-dark-group-title-color  := rgba(255,255,255,.36)
$date-picker-cell-hover-bg    := #e1f0fe


// Media queries breakpoints
// Extra small screen / phone
$screen-xs              := 480px
$screen-xs-min          := $screen-xs
$screen-xs-max          := ($screen-xs-min - 1)

// Small screen / tablet
$screen-sm              := 768px
$screen-sm-min          := $screen-sm
$screen-sm-max          := ($screen-sm-min - 1)

// Medium screen / desktop
$screen-md              := 992px
$screen-md-min          := $screen-md
$screen-md-max          := ($screen-md-min - 1)

// Large screen / wide desktop
$screen-lg              := 1200px
$screen-lg-min          := $screen-lg
$screen-lg-max          := ($screen-lg-min - 1)

// Z-index
$zindex-spin            := 8
$zindex-affix           := 10
$zindex-back-top        := 10
$zindex-select          := 900
$zindex-modal           := 1000
$zindex-message         := 1010
$zindex-notification    := 1010
$zindex-tooltip         := 1060
$zindex-transfer        := 1060
$zindex-loading-bar     := 2000
$zindex-spin-fullscreen := 2010

// Animation
$animation-time         := .3s
$transition-time        := .2s
$ease-in-out            := ease-in-out

// Layout and Grid
$grid-columns           := 24
$grid-gutter-width      := 0

// Shadow
$shadow-color           := rgba(0, 0, 0, .2)
$shadow-base            := $shadow-down
$shadow-card            := 0 1px 1px 0 rgba(0,0,0,.1)
$shadow-up              := 0 -1px 6px $shadow-color
$shadow-down            := 0 1px 6px $shadow-color
$shadow-left            := -1px 0 6px $shadow-color
$shadow-right           := 1px 0 6px $shadow-color

// Tabs
$tabs-height                := 32px
$tabs-content-height        := 31px
$tabs-card-marigin-right    := 4px
$tabs-font-size             := 12px
$tabs-bar-margin-bottom     := 16px

// Collapse
// $collapse-header-height         := 34px
// $collapse-header-padding        := 0 0 0 0
// $collapse-content-padding       := 0 0 0 0
// $collapse-content-box-padding   := 0 16px
$collapse-header-height         := 38px
$collapse-header-padding        := 0 0 0 32px
$collapse-content-padding       := 0 16px
$collapse-content-box-padding   := 16px 0
$collapse-panel-border          := 1px solid $border-color-base

// Select
$select-border-radius           := 4px
$select-dropdown-border-radius  := 4px

// Card
$card-body-padding              := 16px;

// Dropdown
$dropdown-hover-color           := #ff5e56

// Notice
$notice-width                   := 335px
$notice-padding                 := 16px
$notice-margin-bottom           := 10px

// Spin
$spin-dot-size-small            := 12px
$spin-dot-size                  := 20px
$spin-dot-size-large            := 32px