@primary-color: #873bf4;
@yuque-color-text-caption: #8c8c8c;
@yuque-color-text-body: #595959;
@yuque-grey-5: #bfbfbf;
@yuque-color-bg-tertiary: #fafafa;
@color-1: #bfbfbf;
@color: #873bf4;
@yuque-color-bg-primary-hover-light: #f5f5f5;
@yuque-color-text-link: #873bf4;

.form-pro .mobile-code .ant-legacy-form-explain {
  margin-top: 8px;
  text-align: left;
  padding-right: 120px;
  margin-bottom: 18px;
}

.verify-modal .mobile-code .ant-legacy-form-explain {
  margin-top: 8px;
  text-align: left;
  padding-right: 120px;
}

.captcha-check-code {
  margin-bottom: 22px;
}

.ant-modal-body .mobile-code .ant-legacy-form-explain {
  margin-top: 8px;
  text-align: left;
  padding-right: 120px;
}

.verify-modal .mobile-code .mobile-code-showtip {
  margin-bottom: 8px;
}

.lark-form .mobile-code .ant-legacy-form-item {
  margin-bottom: 8px;
}

.mobile-code {
  position: relative;
  min-height: 72px;

  .mobile-code-hint {
    color: @yuque-color-text-caption;
  }

  &-pwd-link {
    height: 22px;
    padding-top: 1px;
    text-align: left;
    color: @yuque-color-text-body;
    cursor: pointer;
    line-height: 1.5;
    margin-right: 200px;
  }

  &-showtip {
    margin-bottom: 4px;
  }

  &-main {
    height: 40px;
    display: flex;

    .mobile-code-field {
      flex: 1;
      margin-bottom: 8px;
    }

    .mobile-code-getBtn {
      position: relative;
      min-width: 118px;
      margin-left: 14px;

      .countdown-btn {
        .code-send-button {
          border: 1px solid @yuque-grey-5;
          font-size: 14px;
          letter-spacing: 0;
          width: 100%;
          height: 100%;

          &:disabled {
            background-color: @yuque-color-bg-tertiary;

            .code-send-text {
              .code-send-text {
                color: @color-1;
              }
            }
          }
        }
      }

      .code-send-text {
        color: @color;
        font-weight: 500;
      }
    }
  }

  .mobile-code-pwd-link {
    line-height: 10px;
  }

  &-tip {
    color: @yuque-color-text-caption;
    text-align: left;
  }

  &-swith-channel {
    cursor: pointer;
    color: @yuque-color-text-body;
    padding-top: 8px;
    padding-left: 12px;
    line-height: 1.7;

    &-highlight {
      cursor: pointer;
      color: @yuque-color-text-link;
    }
  }

  input {
    appearance: none;
  }

  .captcha .nc-container .nc_wrapper .nc_scale,
  .captcha .nc-container #nc_1_wrapper .nc_scale {
    height: 40px;
    background: @yuque-color-bg-primary-hover-light;
    width: auto;
  }
}