@charset "UTF-8";

//-----------------------------------------------------	
// variables scss
//-----------------------------------------------------	


// font相关
//-----------------------------------------------------	
$fontSize:                       14px !default; 
$fontLineHeight:                 1.5 !default;
$fontFamily:                     "Helvetica Neue", Helvetica, STHeiTi, Arial, sans-serif !default;
// ios华文黑体,Android 4.0之后,Android 4.0之前
$fontCn:                         STHeiTi, Roboto, "Droid Sans Fallback", Arial !default; 
// ios4.0+,ios4.0-,Android 4.0+,Android 4.0-
$fontEn:                         "Helvetica Neue", Helvetica, Roboto, "Droid Sans", Arial !default; 


// 背景色，文本色，边框色，链接色
//-----------------------------------------------------	
$colorText:                      #333 !default;
$colorBg:                        #fff !default;
$colorBorder:                    #dbdbdb !default;
$colorLink:                      #08c !default;
$colorPlaceholder:               #999 !default; // input placeholder color
$colorDisabled:                  (text: #999, bg: #e3e3e3, border: #dbdbdb) !default; // textColor bgColor borderColor
$colorOverlay:                   rgba(0,0,0,.7) !default; // 遮罩层颜色


// 基本颜色
// color function : http://sass-lang.com/docs/yardoc/Sass/Script/Functions.html
// lighten($color, $amount)
// darken($color, $amount)
// opacity($color, $amount)
// mix($color1, $color2[, $amount])
//-----------------------------------------------------	
$color3:                          #333;
$color6:                          #666;
$color9:                          #999;
$colorC:                          #ccc;
$colorF:                          #f5f5f5;

$blue:                            #007aff !default;
$orange:                          #ff9500 !default;
$red:                             #ff3b30 !default;
$green:                           #4cd964 !default;
$primary:                         #007aff !default;


// 元素上下间距
//-----------------------------------------------------	
$gap:                             20px !default;


// header,footer等的高度
//-----------------------------------------------------	
$barHeight:                       44px !default;


// radius
//-----------------------------------------------------	
$radiusBase:                      5px !default;
$radiusSmall:                     3px !default;


// timing-function
//-----------------------------------------------------
$timingFunction:                  cubic-bezier(0.42, 0, 0.58, 1);


// active state switch
//-----------------------------------------------------
$activeStateSwitch:               true !default;


// z-index
//-----------------------------------------------------	
$zIndexHeader:                    1000 !default;
$zIndexFooter:                    2000 !default;
$zIndexPopup:					  3000 !default;                     
$zIndexOverlay:                   4000 !default; // 默认高于header和footer部分


//font
$font-size:14px;

//border type theme.
$border-default:1px solid #e3e6e4 !default;
$border-radius-base:2px !default;

//message
$message_bg_col:#fff;
$message_text_col:#000;
$message_border:1px solid #e3e3e3;
$message_border_col:#e3e3e3;
$message_btn_bg:#fff;
$message_padding:15px;

//toast
$toast_mask_bg_col:rgba(0,0,0,0);
$toast_bg_col:rgba(0,0,0,0.8);
$toast_text_col:#fff;
$toast_border_radius:4px;


//loading
$loading_bg_col:rgba(0,0,0,0.8);
$loading_text_col:#fff;
$loading_border_radius:10px;

//theme
$brand-default:         #ffffff !default;
$brand-default-color:	#666666 !default;
$brand-blue:         #007aff !default;
$brand-blue-color:	#ffffff !default;
$brand-red:            #fd4a1a !default;
$brand-red-color:	#ffffff !default;
$brand-green:         #04be02 !default;
$brand-green-color:	#ffffff !default;
$brand-yellow:          #ff9708 !default;
$brand-yellow-color:	#ffffff !default;
$brand-disabled:#ddd !default;
$brand-disabled-color: #f6f6f6 !default;

//radio
$radio-icon-border:1px solid #e3e3e3;
$radio-icon-border-checked:1px solid #007aff;
$radio-icon-width:14px;
$radio-icon-height:14px;
$radio-icon-radius:14px;
$radio-icon-background:#fff;
$radio-icon-background-checked:#007aff;

$radio-icon-border-disabled:1px solid #ddd;
$radio-icon-background-disabled:#f2f2f2;
$radio-icon-border-background-disabled:#ddd;

//checkbox
$checkbox-icon-border:1px solid #e3e3e3;
$checkbox-icon-border-checked:1px solid #007aff;

$checkbox-icon-width:14px;
$checkbox-icon-height:14px;
$checkbox-icon-radius:2px;
$checkbox-icon-background:#fff;
$checkbox-icon-background-checked:#007aff;

$checkbox-icon-border-disabled:1px solid #ddd;
$checkbox-icon-background-disabled:#f2f2f2;
$checkbox-icon-border-background-disabled:#ddd;


//switch
$switch-background:#ccc;
$switch-width:44px;
$switch-height:22px;
$switch-line-height:20px;
$switch-border:1px solid #ccc;
$switch-border-radius:20px;
$switch-border-checked:1px solid #2db7f5;
$switch-checked-background:#2db7f5;
$switch-checked-color:#fff;

//slider
$slider-background:#e9e9e9;
$slider-background-hover:darken(#e9e9e9,5%);
$slider-height:20px;
$slider-border:8px solid #fff;
$slider-border-radius:5px;

$slider-handler-background:#fff;
$slider-handler-width:14px;
$slider-handler-height:14px;
$slider-handler-border:2px solid #96dbfa;
$slider-handler-border-hover:darken(#96dbfa,10%);

$slider-track-height:6px;
$slider-track-background:#abe2fb;
$slider-track-background-hover:darken(#abe2fb,10%);
$slider-track-border-radius:6px;