button::after {
  border: none;
}

// 主容器
.content {
  width: 100%;
  min-height: 100vh;
  background-color: #f8f8f8;
}

// 头部欢迎区域
.login-header {
  width: 100%;
  padding: 120rpx 40rpx 130rpx;
  background-color: $uni-color-primary;
  color: #fff;

  .greeting {
    font-size: 35rpx;
    font-weight: bold;
    display: block;
    line-height: 1.5;
  }
}

// 表单区域
.login-form {
  width: 80%;
  margin: -80rpx auto 0;
  padding: 30rpx;
  background-color: #fff;
  border-radius: 50rpx 50rpx 0 0;
  box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.05);
}

// 登录方式切换标签
.login-tabs {
  display: flex;
  justify-content: space-between;
  margin: 30rpx auto 50rpx;
  width: 70%;

  .tab-item {
    font-size: 30rpx;
    padding-bottom: 15rpx;
    position: relative;
    cursor: pointer;
    transition: all 0.3s ease;

    &.active {
      color: $uni-color-primary;
      font-weight: 500;

      &::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        height: 6rpx;
        background-color: $uni-color-primary;
        border-radius: 3rpx;
      }
    }
  }
}

// 输入框组
.input-group {
  margin: 30rpx 0 40rpx;
  position: relative;

  input {
    width: 100%;
    height: 80rpx;
    padding: 0 40rpx;
    border: 1rpx solid #dadbde;
    border-radius: 10rpx;
    font-size: 28rpx;
    transition: border-color 0.3s;

    &:focus {
      border-color: $uni-color-primary;
      outline: none;
    }
  }

  .sms-btn {
    position: absolute;
    right: 20rpx;
    top: 50%;
    transform: translateY(-50%);
    font-size: 28rpx;
    color: $uni-color-primary;
    background: none;
    border: none;
    padding: 10rpx 15rpx;
    border-radius: 6rpx;

    &:disabled {
      color: #999;
      background-color: #f1f1f1;
    }
  }
}

// 记住账号选项
.remember-account {
  display: flex;
  align-items: center;
  font-size: 26rpx;
  margin: 10rpx 0 20rpx;

  checkbox {
    transform: scale(0.7);
    margin-right: 10rpx;
  }
}

// 登录按钮
.login-btn {
  width: 100%;
  height: 85rpx;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 10rpx;
  background-color: $uni-color-primary;
  color: #fff;
  font-size: 30rpx;
  font-weight: 500;
  border: none;
  margin-top: 20rpx;
  transition: opacity 0.3s;

  &:active {
    opacity: 0.8;
  }
}

// 底部链接区域
.form-footer {
  display: flex;
  justify-content: space-between;
  margin-top: 30rpx;
  font-size: 28rpx;

  .link-text {
    .link {
      color: $uni-color-primary;
      text-decoration: underline;
      margin-left: 8rpx;
    }
  }
}

// 协议同意区域
.agreement-check {
  display: flex;
  justify-content: center;
  margin-top: 60rpx;
  padding: 0 30rpx;
  font-size: 28rpx;
  // color: #666;

  .protocol-link {
    color: $uni-color-primary;
    text-decoration: underline;
    margin: 0 5rpx;
  }
}

// 占位符样式
._pl {
  color: #999;
  font-size: 28rpx;
}
