/**
 * 自定义 input 样式，为 a-input 添加 custom-input 类
 */
.custom-form .ant-form-item .ant-input,
.custom-form-item.ant-form-item .ant-input,
.custom-form .ant-form-item .ant-input-affix-wrapper,
.custom-form-item.ant-form-item .ant-input-affix-wrapper,
.custom-form .ant-form-item .ant-input-group-wrapper,
.custom-form-item.ant-form-item .ant-input-group-wrapper,
.custom-input {
  box-shadow: none;
  outline: none;
  font-family: PingFangSC-Regular, 'PingFang SC', sans-serif;

  &:not(.ant-input-group-wrapper) {
    padding-right: 12px;
    padding-left: 12px;
  }

  &.ant-input-affix-wrapper .ant-input {
    padding-right: 0;
    padding-left: 0;
    border-radius: 0;
    font-size: 14px;
  }

  /* <=1024的设备 */
  @media (max-width: 1024px) {
    &.ant-input-affix-wrapper .ant-input {
      padding-right: 0;
      padding-left: 0;
      border-radius: 0;
      font-size: 16px;
    }
  }

  /* <=600的设备 */
  @media (max-width: 600px) {
    &.ant-input-affix-wrapper .ant-input {
      padding-right: 0;
      padding-left: 0;
      border-radius: 0;
      font-size: 18px;
    }
  }

  /**
   * 禁用输入框
   */
  &.ant-input.ant-input-disabled,
  .ant-input.ant-input-disabled {
    &[disabled] {
      color: #8c8c8c;
      font-size: 16px;

      &::placeholder {
        color: #bfbfbf;
        font-weight: 400;
        font-size: 14px;
      }
    }
  }

  /**
   * 最简输入框
   */
  &.ant-input {
    border-color: #dfe0e3;
    border-radius: 4px;
    color: #262626;

    &:focus {
      border-color: $yili-default-color;
      box-shadow: none;
      outline: none;
    }
  }

  /**
   * 带清除按钮
   */
  &.ant-input-affix-wrapper {
    border-color: #dfe0e3;
    border-radius: 4px;
    color: #262626;

    &.ant-input-affix-wrapper-focused {
      border-color: $yili-default-color;
      box-shadow: none;
      outline: none;
    }
  }

  /*
   * 带有 addon-before addon-after 的 input
   */
  &.ant-input-group-wrapper {
    .ant-input-group-addon {
      border-radius: 4px 0 0 4px;
    }

    .ant-input + .ant-input-group-addon,
    .ant-input-affix-wrapper + .ant-input-group-addon {
      border-radius: 0 4px 4px 0;
    }

    .ant-input,
    .ant-input-affix-wrapper {
      border-radius: 0;
    }

    *:last-child {
      border-top-right-radius: 4px;
      border-bottom-right-radius: 4px;
    }
  }
}

/**
 * 自定义 input-number 样式，为 a-input-number 添加 custom-input-number 类
 */
.custom-form .ant-form-item .ant-input-number,
.custom-form-item.ant-form-item .ant-input-number,
.custom-input-number.ant-input-number {
  border-color: #dfe0e3;
  border-radius: 4px;
  color: #262626;

  &.ant-input-number-focused {
    border-color: $yili-default-color;
    box-shadow: none;
    outline: none;
  }

  .ant-input-number-handler-wrap {
    width: 18px;
    height: 22px;
    border: none;
    opacity: 1;
    transform: translate(-6px, 4px);
  }

  .ant-input-number-handler,
  .ant-input-number-handler-up,
  .ant-input-number-handler-down {
    position: relative;
    height: 50% !important;
    border-color: transparent;

    .anticon {
      position: absolute;
      right: 6px;
      width: 6px;
      height: 5px;
      margin: 0;
      background-position: center center;
      background-size: 6px 5px;
      background-repeat: no-repeat;
      transform: translate(0);
    }

    svg {
      display: none;
    }
  }

  .ant-input-number-handler-up {
    .ant-input-number-handler-up-inner {
      top: unset;
      bottom: 1px;
      background-image: url('~@/assets/img/customize/num_up.png');

      &:hover {
        background-image: url('~@/assets/img/customize/num_up_hover.png');
      }
    }
  }

  .ant-input-number-handler-down {
    .ant-input-number-handler-down-inner {
      top: 1px;
      bottom: unset;
      background-image: url('~@/assets/img/customize/num_down.png');

      &:hover {
        background-image: url('~@/assets/img/customize/num_down_hover.png');
      }
    }
  }
}

.custom-form .ant-form-item textarea.ant-input,
.custom-form-item.ant-form-item textarea.ant-input,
textarea.custom-textarea.ant-input {
  &[no-resize] {
    resize: none;
  }
}
