@import './modules/type-scale/index';
@import './modules/typography/index';
@import './modules/layout/index';
@import './modules/align/index';
@import './modules/margin/index';
@import './modules/padding/index';
@import './modules/flexbox/index';
@import './modules/position/index';
@import './modules/border/index';
@import './modules/grid/index';
@import './modules/hide/index';

$c-title: #404040; //标题黑
$c-text: #666; //正文
$c-subTitle:#8b8b8b; //次级文字，默认图标按钮颜色
$c-placeholder:#adadad; //输入框提示文字
$c-forbid:#cacaca; //失效置灰颜色

$bg: #fcfcfc; //背景灰
$c-divider: #ebebeb; //分割线
$c-border: #9e9e9e ; //边框线
/*常用颜色*/
$white: #fff;
$red: #f04134;
$yellow:#ffff00;
$gray:#5a5e66;
$bg-gray:#f6f6f6;
$green:#00A854;

//按钮四种默认颜色
$c-default: #ffffff;
$c-primary: #1b95e7;
$c-success: #00A854;
$c-warning: #ffBf00;
$c-danger: #f04134;

//按钮hover颜色
$h-default: #ecf5ff;
$h-primary: #177dc9;
$h-success: #00924c;
$h-warning: #e09a00;
$h-danger: #d73435;
//按钮禁用颜色
$f-default: #e6e6e6;
$f-primary: #84c6f2;
$f-success: #76d0a3;
$f-warning: #ffdd76;
$f-danger: #f79992;

.bd-color-divider {
   border-color: $c-divider;
}

.color-link{
  color:$c-primary ;
}
a.color-link:active,a.color-link:focus,a.color-link:visited {
  color:$c-primary ;
  @extend .underline;
}
a.color-link:hover {
  color:$h-primary ;
  @extend .underline;
}

.color-whitesmoke{
  color:$bg ;
}
.color-white{
  color:$white ;
}
.color-red{
  color:$red ;
}
.color-yellow{
  color:$yellow ;
}
.color-gray{
  color:$gray;
}
.color-blue{
  color:$c-primary;
}
.color-green{
  color:$green;
}
.color-title{
  color: $c-title;
}
.color-text,
html{
  color: $c-text;
}
.color-subTitle{
  color: $c-subTitle;
}
.color-placeholder{
  color: $c-placeholder;
}
.color-forbid{
  color: $c-forbid;
}

.color-border{
  color: $c-border;
}
.color-divider{
  color: $c-divider;
}

.bg{
  background:$bg;
}
.bg-white{
  background:$white ;
}
.bg-red{
  background:$red ;
}
.bg-yellow{
  background:$yellow ;
}
.bg-gray{
  background:$bg-gray;
}
.bg-green{
  background:$green;
}
.bg-primary{
  background:$c-primary;
}


.btn.btn-default {
  background-color:$c-default ;
  color: $c-text ;
  border: 1px solid #d8dce5;
  border-color: #d8dce5;
}

.btn.btn-primary {
  background-color:$c-primary ;
}
.btn.btn-success {
  background-color:$c-success ;
}
.btn.btn-warning {
  background-color:$c-warning ;
}
.btn.btn-danger {
  background-color:$c-danger ;
}

.btn.btn-default:hover {
  background-color:$h-default ;
  color: #409eff;
  border-color: #c6e2ff;
}

.btn.btn-primary:hover {
  background-color:$h-primary ;
}
.btn.btn-success:hover {
  background-color:$h-success ;
}
.btn.btn-warning:hover {
  background-color:$h-warning ;
}
.btn.btn-danger:hover {
  background-color:$h-danger ;
}

.btn.btn-default.disabled {
  background-color:$f-default ;
}

.btn.btn-primary.disabled {
  background-color:$f-primary ;
}
.btn.btn-success.disabled {
  background-color:$f-success ;
}
.btn.btn-warning.disabled {
  background-color:$f-warning ;
}
.btn.btn-danger.disabled {
  background-color:$f-danger ;
}
.btn{
  display: inline-block;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
  background: #fff;
  @extend .color-white;
  -webkit-appearance: none;
  text-align: center;
  box-sizing: border-box;
  outline: none;
  margin: 0;
  transition: .1s;
  font-weight: 500;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  padding: 12px 20px;
  font-size: 14px;
  border-radius: 4px;
}

.btn-sm{
  @extend .btn;
  padding: 6px 10px;
  @extend .h14;

}
.btn-xs{
  @extend .btn;
  @extend .h12;
  padding: 3px 5px;

}
.btn-lg{
  @extend .btn;
  @extend .h18;
  padding: 15px 25px;
}