//Transition
$all-transition: all .3s cubic-bezier(.645,.045,.355,1);
$fade-transition:opacify 300ms cubic-bezier(0.23,1,0.32,1);
$fade-linear-transition:opacify 200ms linear;
$md-fade-transition:transform 300ms cubic-bezier(0.23,1,0.32,1) 100ms,
                    opacify 300ms cubic-bezier(0.23,1,0.32,1) 100ms;
$border-transition-base: border-color .2s cubic-bezier(0.645,0.045,0.335,1);
$color-transition-base:color .2s cubic-bezier(0.645,0.045,0.335,1);

//Colors
$color-primary:#20a0ff;
$color-success:#7ace4c;
$color-warning:#f7ba2a;
$color-danger:#ff4949;
$color-info:#50bfff;
$color-blue:#2e90fe;
$color-blue-light:#5da9ff;
$color-blue-lighter:rgba($color-blue,0.12);
$color-white:#fff;
$color-black:#000;
$color-grey:#c0ccda;

//Link
$link-color:#475669;
$link-hover-color:$color-primary;

//Border
$border-width-base:1px;
$border-style-base:solid;
$border-color-base:$color-grey;
$border-base:$border-width-base $border-style-base $border-color-base;
$border-radius-base:2px;
$border-radius-small:2px;
$border-radius-circle:100%;
$shadow-base:0 0 2px rgba($color-black,0.18),
             0 0 1px $color-blue-light;

//Fill
$fill-base:$color-white;

//Font
$font-size-base:12px;
$font-color-base:#1f2d3d;
$font-color-disabled-base:#bbb;

//Size
$size-base:12px;

//Z-index
$index-normal:1;
$index-top:1000;
$index-popper:2000;

//Disable base
$disabled-fill-base:#eff2f2;
$disabled-color-base:#bbb;
$disabled-border-base:#d3dce6;

//Icon
$icon-color:#666;

//Checkbox
$checkbox-font-size:14px;
$checkbox-color:#1f2d3d;
$checkbox-input-height:18px;
$checkbox-input-width:18px;
$checkbox-input-border-radius:$border-radius-base;
$checkbox-input-fill:#fff;
$checkbox-input-border:$border-base;
$checkbox-input-border-color:$border-color-base;
$checkbox-icon-color:#fff;

$checkbox-disabled-input-border-color:$disabled-border-base;
$checkbox-disabled-input-fill:$disabled-fill-base;
$checkbox-disabled-icon-color:$disabled-fill-base;

$checkbox-disabled-checked-input-fill:$disabled-border-base;
$checkbox-disabled-checked-input-border-color:$disabled-border-base;
$checkbox-disabled-checked-icon-color:#fff;

$checkbox-checked-input-border-color:$color-blue;
$checkbox-checked-input-fill:$color-primary;
$checkbox-checked-icon-color:$fill-base;

$checkbox-input-shadow-hover:$shadow-base;
$checkbox-input-border-color-hover:$color-primary;

//Radio
$radio-font-size:14px;
$radio-color:#1f2d3d;
$radio-input-height:18px;
$radio-input-width:18px;
$radio-input-border-radius:$border-radius-circle;
$radio-input-fill:#fff;
$radio-input-border:$border-base;
$radio-input-border-color:$border-color-base;
$radio-icon-color:#fff;

$radio-disabled-input-border-color:$disabled-border-base;
$radio-disabled-input-fill:$disabled-fill-base;
$radio-disabled-icon-color:$disabled-fill-base;

$radio-disabled-checked-input-fill:$disabled-border-base;
$radio-disabled-checked-input-border-color:$disabled-border-base;
$radio-disabled-checked-icon-color:#fff;

$radio-checked-input-border-color:$color-primary;
$radio-checked-input-fill:#fff;
$radio-checked-icon-color:$color-primary;

$radio-input-shadow-hover:$shadow-base;
$radio-input-border-color-hover:$color-primary;

$radio-button-font-size:$font-size-base;

//Input
$input-font-size:$font-size-base;
$input-color:$font-color-base;
$input-width:140px;
$input-height:36px;
$input-shadow-hover:$shadow-base;
$input-border:$border-base;
$input-border-color:$border-color-base;
$input-border-radius:$border-radius-base;
$input-border-color-hover:#20a0ff;
$input-fill:#fff;
$input-fill-disabled:$disabled-fill-base;
$input-color-disabled:$font-color-disabled-base;
$input-icon-color:$color-grey;
$input-placeholder-color:#99a9bf;
$input-max-width:314px;

$input-hover-border:#20a0ff;

$input-focus-border:$color-primary;
$input-focus-fill:#fff;

$input-disabled-fill:$disabled-fill-base;
$input-disabled-border:$disabled-border-base;
$input-disabled-color:$disabled-color-base;
$input-disabled-placeholder-color:#c0ccda;

$input-large-font-size:16px;
$input-large-height:42px;

$input-small-font-size:12px;
$input-small-height:28px;

$input-mini-font-size:12px;
$input-mini-height:22px;

//Cascader
$cascader-menu-fill:$fill-base;
$cascader-menu-font-size:$font-size-base;
$cascader-menu-radius:$border-radius-base;
$cascader-menu-border:$border-base;
$cascader-menu-border-color:$border-color-base;
$cascader-menu-border-width:$border-width-base;
$cascader-menu-color:$font-color-base;
$cascader-menu-option-color-active:$color-blue;
$cascader-menu-option-fill-active:rgba($color-blue,0.12);
$cascader-menu-option-color-hover:$font-color-base;
$cascader-menu-option-fill-hover:rgba($color-black,0.06);
$cascader-menu-option-color-disabled:#999;
$cascader-menu-option-fill-disabled:rgba($color-black,0.06);
$cascader-menu-option-empty-color:#666;
$cascader-menu-option-group-color:#999;
$cascader-menu-shadow:0 1px 2px rgba($color-black,0.14),
                      0 0 3px rgba($color-black,0.14);
$cascader-menu-option-pinyin-color:#999;
$cascader-menu-submenu-shadow:1px 1px 2px rgba($color-black,0.14),
                              1px 0 2px rgba($color-black,0.14);
$cascader-height:200px;

//Tag
$tag-color:$font-color-base;
$tag-fill:#e2e2e2;
$tag-border-radius:$border-radius-base;
$tag-close-color:#666;

//Group
$group-option-flex:0 0 (1/5) * 100%;
$group-option-offset-bottom:12px;
$group-option-fill-hover:rgba($color-black,0.06);
$group-title-color:$color-black;
$group-title-font-size:$font-size-base;
$group-title-width:66px;

//Tab
$tab-font-size:$font-size-base;
$tab-border-line:$border-width-base $border-style-base #e4e4e4;
$tab-header-color-active:$color-blue;
$tab-header-color-hover:$font-color-base;
$tab-header-color:$font-color-base;
$tab-header-fill-avtive:rgba($color-black,0.06);
$tab-header-fill-hover:rgba($color-black,0.06);
$tab-vertical-header-width:90px;
$tab-vertical-header-count-color:$color-white;
$tab-vertical-header-count-fill:$color-blue;
$tab-horizontal-border:2px solid #438de0;

//button
$button-font-size:14px;
$button-border-radius:$border-radius-base;
$button-padding:5px 20px;
$button-padding-vertical:10px;
$button-padding-horizontal:15px;

$button-large-font-size:16px;
$button-large-padding-vertical:11px;
$button-large-padding-horizontal:19px;

$button-small-font-size:12px;
$button-small-padding-vertical:7px;
$button-small-padding-horizontal:4px;

$button-mini-font-size:12px;
$button-mini-padding-vertical:4px;
$button-mini-padding-horizontal:4px;

$button-default-color:#1f2d3d;
$button-default-fill:#fff;
$button-default-border:#c4c4c4;

$button-ghost-color:#666;
$button-ghost-fill:transparent;
$button-ghost-border:none;

$button-disabled-color:#c0ccda;
$button-disabled-fill:#eff2f7;
$button-disabled-border:#d3dce6;

$button-primary-border:$color-primary;
$button-primary-color:#fff;
$button-primary-fill:$color-primary;

$button-success-border:$color-success;
$button-success-color:#fff;
$button-success-fill:$color-success;

$button-warning-border:$color-warning;
$button-warning-color:#fff;
$button-warning-fill:$color-warning;

$button-danger-border:$color-danger;
$button-danger-color:#fff;
$button-danger-fill:$color-danger;

$button-info-border:$color-info;
$button-info-color:#fff;
$button-info-fill:$color-info;

$button-hover-tint-percent:20%;
$button-active-shade-percent:10%;

//Switch
$switch-on-color:#20a0ff;
$switch-oof-color:#c0ccda;
$switch-disabled-color:#e5e9f3;
$switch-disabled-text-color:#f9fafc;

//Dialog
$dialog-background-color:$color-blue;
$dialog-footer-background:$color-blue-lighter;
$dialog-box-shadow:0 1px 3px rgba(0,0,0,.3);
$dialog-tiny-width:30%;
$dialog-small-width:40%;
$dialog-normal-width:60%;
$dialog-large-width:90%;
$dialog-close-color:$color-grey;
$dialog-close-hover-color:$color-primary;
$dialog-title-font-size:16px;
$dialog-font-size:14px;

//Table
$table-border-color:#e0e6ed;
$table-text-color:#1f2d3d;
$table-header-background:#E5E9F2;

//Pagination
$pagination-font-size:13px;
$pagination-fill:$color-white;
$pagination-color:#475669;
$pagination-border-radius:2px;
$pagination-button-color:#99a9bf;
$pagination-button-size:28px;
$pagination-button-disabled-color:#d3dce6;
$pagination-button-disabled-fill:$color-white;
$pagination-border-color:#d3dce6;
$pagination-hover-fill:$color-primary;
$pagination-hover-color:$color-white;


//Popover
$popover-fill:$color-white;
$popover-font-size:12px;
$popover-border-color:#d3dce6;
$popover-arrow-size:6px;
$popover-padding:10px;
$popover-title-font-size:13px;
$popover-title-color:#1f2d3d;

//Tooltip
$tooltip-fill:#1f2d3d;
$tooltip-color:#fff;
$tooltip-font-size:12px;
$tooltip-border-color:#1f2d3d;
$tooltip-arrow-size:6px;
$tooltip-padding:10px;

//Tag
$tag-padding:0 5px;
$tag-fill:#8492a6;
$tag-border:#8492a6;
$tag-color:#fff;
$tag-font-size:12px;
$tag-border-radius:4px;

$tag-gray-fill:#e5e9f2;
$tag-gray-border:#e5e9f2;
$tag-gray-color:#475669;

$tag-primary-fill:rgba($color-primary,0.10);
$tag-primary-border:rgba($color-primary,0.20);
$tag-primary-color:$color-primary;

$tag-success-fill:rgba($color-success,0.10);
$tag-success-border:rgba($color-success,0.20);
$tag-success-color:$color-success;

$tag-warning-fill:rgba($color-warning,0.10);
$tag-warning-border:rgba($color-warning,0.20);
$tag-warning-color:$color-warning;

$tag-danger-fill:rgba($color-danger,0.10);
$tag-danger-border:rgba($color-danger,0.20);
$tag-danger-color:$color-danger;

//Dropdown
$dropdown-menu-box-shadow:0 0 6px 0 rgba(0,0,0,0.12),
                          0 2px 4px 0 rgba(0,0,0,0.12);
$dropdown-menuItem-hover-fill:#e5e9f2;
$dropdown-menuItem-hover-color:#475669;

//Badge
$badge-fill:$color-danger;
$badge-raduis:10ppx;
$badge-font-size:12px;
$badge-padding:6px;
$badge-size:18px;

//Card
$card-border-color:$disabled-border-base;
$card-border-radius:4px;
$card-padding:20px;

//Slider
$slider-main-background-color:$color-primary;
$slider-runway-background-color:#e5e9f2;
$slider-runway-hover-color:#1d8ce0;
$slider-stop-background-color:#c0ccda;

//Steps
$steps-border-color:$disabled-border-base;
$steps-border-radius:4px;
$steps-padding:20px;

$menu-item-color:#475669;
$menu-item-fill:#eff2f7;
$menu-item-hover-fill:#d3dce6;
$submenu-item-fill:#e5e9f2;

$dark-menu-item-color:#475669;
$dark-menu-item-fill:#324057;
$dark-menu-item-hover-fill:#475669;
$dark-submenu-item-fill:#1f2d3d;


//date-picker
$datepicker-color: #475669;
$datepicker-off-color: #ddd;
$datepicker-header-color: #8492a6;
$datepicker-icon-color: #99a9bf;
$datepicker-trigger-color: #c0ccda;
$datepicker-border-color: #d3dce6;
$datepicker-inner-border-color: #e4e4e4;
$datepicker-cell-hover-color: #e5e9f2;
$datepicker-inrange-color: #D3ECFF;
$datepicker-inrange-hover-color: #AFDCFF;
$datepicker-active-color: #20a0ff;
$datepicker-text-hover-color: #20a0ff;

//loading
$loading-spinner-size:42px;
$loading-fullscreen-spinner-size:50px;
