@include b(search) {
  @include flex-x(flex-start);

  position: relative;
  height: 44px;
  padding: 8px 6px;
  box-sizing: border-box;
  // background-color: #e5e5e5;
  background-color: #efeff4;
  .#{$namespace}-input {
    justify-content: flex-end;
    height: 28px;
    padding: 0 8px;
    border: none;
    border-radius: $radius-size;
    line-height: 28px;
    font-size: $size-15;
    &-inner {
      height: 28px;
      line-height: 28px;
      text-indent: 45%;
      transition: text-indent $transition-time ease;
    }
    &-prefix {
      position: absolute;
      left: 40%;
      transition: left $transition-time ease;
      .iconfont {
        color: rgba(178,178,178,.9);
      }
    }
    &.active {
      .#{$namespace}-input-inner {
        text-indent: 20px;
      }
      .#{$namespace}-input-prefix {
        left: 10px;
      }
    }
    &::before,
    &::after {
      border: none;
    }
  }
  &-action {
    min-width: 40px;
    margin-left: 6px;
    color: $primary-color;
    opacity: 1;
    word-wrap: none;
    word-break: keep-all;
    cursor: pointer;
    transition: all $transition-time ease;
  }
  &-disabled &-action {
    color: $auxiliary-text-color;
    cursor: not-allowed;
  }
}
