page {
  background: #F9F9F9;
  /* overflow: hidden; */
  /* background: #fff; */
}

/* .user-info {
  height: 290rpx;
  position: relative;
} */

.user-info {
  width: 100%;
  height: 168rpx;
  padding: 28rpx 30rpx;
  box-sizing: border-box;
  overflow: hidden;
  position: relative;
  /* position: relative;
  z-index: -1;
  overflow: hidden; */
}

.user-info::after {
  content: '';
  width: 100%;
  height: 168rpx;
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  border-radius: 0 0 24rpx 24rpx;
  background: #FFCAE0;
  overflow: hidden;
}

.user-info .bg {
  width: 100%;
  height: 100%;
}

/* .user-info-box {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
} */

.user-info-box .avatar {
  width: 112rpx;
  height: 112rpx;
  /* margin-bottom: 20rpx; */
  border-radius: 50%;
  box-sizing: border-box;
  border: 2rpx solid #FFFFFF;
  /* background-color: #ccc; */
}


.user-info-box.active .avatar {
  border: 2rpx solid #FF3803;
}

.user-info-box .info-right {
  margin-left: 20rpx;
}

.user-info-box.active .nick-name {
  font-family: PingFangSC-Medium, PingFang SC;
  color: #FF3803;
}

.user-info-box .intro {
  margin: 4rpx 0;
}

.user-info-box .gender {
  width: 44rpx;
  height: 28rpx;
  background: #FFFFFF;
  border-radius: 14rpx;
}

.user-info-box .gender image {
  width: 28rpx;
  height: 28rpx;
}

.user-info-box .city {
  height: 28rpx;
  padding: 0rpx 10rpx;
  background: #FFFFFF;
  border-radius: 14rpx;
  font-size: 16rpx;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #666666;
}

.user-info-box .vip-time {
  background: linear-gradient(298deg, #FFB16E 0%, #FF7F7F 100%);
  border-radius: 20rpx;
  height: 40rpx;
  padding: 0 8rpx;
}

.user-info-box .vip-time image {
  width: 48rpx;
  height: 28rpx;
}

.user-info-box .vip-time text {
  font-size: 28rpx;
  font-family: PingFangSC-Medium, PingFang SC;
  font-weight: 500;
  color: #FFFFFF;
}

/* .user-info-box text {
  color: #fff;
} */

.order {
  height: 172rpx;
  display: flex;
  justify-content: space-around;
  align-items: center;
  background: #fff;
}

.order .item {
  display: flex;
  flex-direction: column;
  position: relative;
}

.order .item image {
  width: 72rpx;
  height: 72rpx;
  margin-bottom: 10rpx;
}

.order .item text {
  font-size: 24rpx;
  color: #666666;
  font-family: PingFangSC-Regular;
}

.order .item .item-num {
  position: absolute;
  top: -14rpx;
  right: -14rpx;
  height: 28rpx;
  width: 28rpx;
  padding: 4rpx;
  /* padding: 4rpx; */
  background: #FF566B;
  border-radius: 50%;
  font-size: 22rpx;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: #FFFFFF;
}

.tools .item {
  display: flex;
  align-items: center;
  padding: 0 30rpx;
  height: 112rpx;
  background: #fff;
}

.tools .item.top {
  margin-top: 20rpx;
}

.tools .item.line {
  border-bottom: 1rpx solid #F9F9F9;
}

.tools .item .active {
  font-size: 14px;
  color: #FF87B9;
}

.tools .item .icon-left {
  width: 48rpx;
  height: 48rpx;
  margin-right: 20rpx;
  /* background-color: #ccc; */
}

.tools .item .icon-right {
  width: 24rpx;
  height: 24rpx;
  margin-left: 12rpx;
}

.item-radius {
  background: #FFFFFF;
  border-radius: 16rpx;
  margin: 20rpx 30rpx;
  overflow: hidden;
}