@import "reset.less";
@import "var.less";
@import "mixins.less";
html,body,#app {
  height: 100%;
}
body {
  font-family: @font-family;
  background-color: @background-color;
}
a {
  color: @blue;
  font-size: @font-size-12;
}
.cr-button {
  padding: 0 @padding-sm !important;
  &__text {
    font-weight: bold !important;
  }
  &--warning {
    color: @button-warning-color !important;
    background-color: @button-warning-background-color !important;
    border: 1px solid @button-warning-border-color !important;
    border-radius: @border-radius-md !important;
  }
  &--default {
    color: @button-default-color !important;
    background-color: @button-default-background-color !important;
    border: 1px solid @button-default-border-color !important;
    border-radius: @border-radius-md !important;
  }
  &--large {
    height: @button-large-height !important;
    line-height: @button-large-line-height !important;
  }
  &--small {
    height: @button-small-height !important;
    line-height: @button-small-line-height !important;
  }
}

.cr-tag {
  border-radius: 8px 2px 8px 2px !important;
  background-color: @tag-default-background-color !important;
  color: @tag-default-color !important;
  padding: 1px 6px 2px !important;
  font-size: 10px !important;
  font-weight: bold;
  &--round {
    border-radius: 1em !important;
  }
  &_light {
    background-color: @tag-default-light-background-color !important;
    color: @tag-default-light-color !important;
  }
  &--primary {
    background-color: @tag-primary-background-color !important;
    color: @tag-primary-color !important;
    &_light {
      background-color: @tag-primary-light-background-color !important;
      color: @tag-primary-light-color !important;
    }
  }
  &--success {
    background-color: @tag-success-background-color !important;
    color: @tag-success-color !important;
    &_light {
      background-color: @tag-success-light-background-color !important;
      color: @tag-success-light-color !important;
    }
  }
  &--danger {
    background-color: @tag-danger-background-color !important;
    color: @tag-danger-color !important;
    &_light {
      background-color: @tag-danger-light-background-color !important;
      color: @tag-danger-light-color !important;
    }
  }
  &--warning {
    background-color: @tag-warning-background-color !important;
    color: @tag-warning-color !important;
    &_light {
      background-color: @tag-warning-light-background-color !important;
      color: @tag-warning-light-color !important;
    }
  }
}
