@charset "utf-8";
@include ns(form-input) {
  display: inline-block;position: relative;
  .suffix-icon, .prefix-icon {position: absolute;right: 0;top: 50%;transform: translateY(-50%);}
  .prefix-icon {left: 0;right: auto;}
  i {display: inline-block;font-size: 20px;cursor: pointer;transition: all .3s;width: 30px;height: 30px;text-align: center;line-height: 30px;color: #999}
  .icon-close {display: none;font-size: 14px}
  &:hover {
    .icon-close {display: inline-block}
  }
  .has-prefix {padding-left: 30px}
}
@include ns(input-control) {
  $border: #ddd;
  $focus: #f60;
  $error: red;
  height: 38px;line-height: 38px;border: 1px solid #ddd;border-radius: 3px;background: none;outline: none;padding: 0 10px;font-size: 14px;overflow: hidden;box-sizing: border-box;width: 300px;
  &:hover {border-color: #ccc}
  &:focus, &.focus {border-color: $focus}
  &.placeholder {color: #999}
  /*禁用状态*/
  &.disabled {background: #eee;cursor: not-allowed;}
  @at-root {
    // formItem里输入错误状态
    @include ns(form-item-error) {
      @include ns(input-control) {border-color: $error;}
    }
  }
}
