.el-form {

  .el-form-item {
    margin-bottom: 30px;

    &.is-error {

      .el-input {
        ::v-deep .el-input__inner {
          border-color: #f56c6c;

        }
      }
    }

    ::v-deep .el-form-item__error {
      font-size: 14px;
      padding-top: 8px;
      font-family: PingFangSC-Medium;
    }

    .el-input {
      &:focus {
        ::v-deep .el-input__inner {
          background-color: red;
        }
      }

      &.is-disabled {
        ::v-deep .el-input__inner {
          color: #a4a4a4;

          &::placeholder {
            color: #a4a4a4;
          }

        }

        ::v-deep .el-input__icon {
          color: #a4a4a4 !important;
        }
      }

      ::v-deep .el-input__inner {
        background-color: transparent;
        border: 2px solid #c0c0c0;
        height: 50px;
        padding: 0 50px 0 45px;
        font-size: 16px;
        font-family: PingFangSC-Medium;
        color: #666;
        transition: all 0.4s;

        &::placeholder {
          color: #777;
        }

        &:focus {
          border-color: rgb(18, 100, 189);
        }

      }

      ::v-deep .el-input__prefix {
        width: 35px;

        .el-input__icon {
          font-size: 20px;
          color: #777;
          line-height: 51px;
        }

      }

      ::v-deep .el-input__suffix {

        .el-input__suffix-inner {
          .el-input__icon {
            font-size: 16px;
            color: #555;
            line-height: 51px;
          }
        }


      }

      ::v-deep .el-input-group__append {
        border: 2px solid #c0c0c0;
        border-left: 0;
      }
    }
  }
}

::v-deep .login-btn {
  height: 50px;
  margin-top: 15px;
  background-color: #0e6eff;
  transition: all .3s;

  &:hover {
    background-color: #2670e0;
  }

  &:active {
    background-color: rgb(54, 135, 234);
  }

  span {
    font-size: 16px;
    font-family: PingFangSC-Medium;
  }
}