@spinner-width: .28rem;
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  .font-smoothing();
}

img {
  border: 0;
}

body {
  font-size: .16rem;
  background-color: @gray-light;
  font-family: @font-family;
}

.list-panel {
  padding: @con-gap;
  background-color: @white;
  border-top: 1px solid @gray-dark;
}

.c {
  clear: both;
}

a {
  color: @orange;
  text-decoration: none;
  cursor: pointer;
  &:hover {
    color: @orange-dark;
  }
}

.rf-iconfont {
  &:before {
    font-size: @font-l;
  }
}

.flex-center {
  display: flex;
  justify-content: center;
  align-items: center;
}

.text-ellipsis {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.input-style {
  font-size: @font-xs;
  line-height: .18rem;
  position: absolute;
  top: 0;
  left: 0;
  width: 98%;
  height: 100%;
  border: 1px solid @white;
  outline: none;
  font-family: @font-family;
  .transition(all 0.5s ease);
  .border-radius(@border-radius);
  &:focus {
    border: 1px solid @orange;
  }
  &.error {
    border-color: @red;
  }
}

.fixed-position {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}

.absolute-position {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

input,
textarea {
  &:extend(.input-style);
  resize: none;
  overflow: hidden;
}

button,
input,
textarea,
select {
  outline: none;
  &:disabled {
    background-color: @gray-dark !important;
    cursor: not-allowed;
  }
}

button {
  &:active {
    background: @orange-dark;
  }
  &:disabled {
    background: @black-light;
    border-color: @black-light;
  }
}

.ui-btn-big {
  position: absolute;
  width: 100%;
  height: @btn-height;
  top: 50%;
  margin-top: -@btn-height/2;
  color: @white;
  font-size: @font-s;
  background: @orange;
  border: 0;
  .border-radius(@border-radius);
  &:hover {
    background: @orange-dark;
  }
}