.yg-input-container {
  padding: 24rpx 0;
  margin: 0 32rpx;
  font-size: 28rpx;
  color: #646566;
  position: relative;

  &.yg-input-border {
    border-bottom: 1rpx solid #ebedf0;
  }

  &.yg-input-disabled {
    color: #c8c9cc;
  }
}

.yg-input {
  width: 100%;
  &-box {
    flex: 1;
    overflow: hidden;
    position: relative;
  }

  &-pad {
    padding: 16rpx;
    background-color: #f7f8fa;
    border-radius: 16rpx;
  }

  &-left {
    display: flex;
    margin-right: 32rpx;
    &.reverse {
      flex-direction: row-reverse;
    }
  }

  &-label {
    max-width: 188rpx;
  }

  &-count {
    font-size: 24rpx;
    color: #999999;
    text-align: right;
  }

  &-placeholder {
    font-size: 28rpx;
    font-weight: 400;
    color: #c8c9cc;
    line-height: 40rpx;
  }

  &-icon {
    font-size: 28rpx;
    color: #969799;
    padding: 0 10rpx;
    margin-left: 24rpx;
    margin-right: -10rpx;
  }
  &-clear {
    font-size: 30rpx;
    color: #969799;
    padding: 0 10rpx;
  }
  &-children {
    display: inline-flex;
    position: relative;
  }
  &-error {
    padding-top: 4rpx;
    font-size: 24rpx;
    padding-left: 32rpx;
  }
}
.yg-input-wrap {
  display: flex;
  align-items: center;
  line-height: 40rpx;

  &.yg-input-textarea {
    align-items: flex-start;
  }
}