/* packageH/chitchat/personalProfile/personalProfile.wxss */
.wrap {
  width: 100%;
  height: 100%;
}

.top-box {
  height: 14rem;
  box-sizing: border-box;
  padding-top: 30rpx;
  padding-bottom: 60rpx;
  background-blend-mode: normal, normal;
  background-image: linear-gradient(90deg, #66b3ff 0%, #0b79f0 100%), linear-gradient(-50deg, #3265ff 0%, #45b2ff 100%);
  overflow: hidden;
}

.top-box .avatar {
  width: 150rpx;
  height: 150rpx;
  margin: 0 auto;
  background-color: #c1c1c1;
  border-radius: 14rpx;
  overflow: hidden;
}

.top-box .avatar .img {
  width: 100%;
  height: 100%;
}

.top-box .name {
  margin-top: 16rpx;
  text-align: center;
  font-weight: bold;
  color: #fff;
  font-size: 18px;
}

.content {
  position: fixed;
  width: 100%;
  height: calc(100vh - 12rem);
  background: #fff;
  bottom: 2.7rem;
  left: 0;
  border-radius: 20px 20px 0 0;
  box-sizing: border-box;
  padding: 30rpx;
  text-align: left;
}

.content .title {
  position: relative;
  font-size: 14px;
  color: #3b98f7;
  padding-left: 28rpx;
}

.content .title::after {
  content: '';
  position: absolute;
  top: 20%;
  left: 0;
  height: 80%;
  width: 6rpx;
  border-radius: 2rpx;
  background-color: #3b97f7;
}

.content .profile-text {
  overflow-y: scroll;
  width: 100%;
  height: 90%;
  display: block;
  margin-top: 28rpx;
  font-size: 14px;
}

.foot {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  background-color: #fff;
}

.foot .i-home {
  text-align: center;
  color: #777;
}

.foot .i-home .iconfont {
  font-size: 22px;
  margin-left: 8px;
}

.foot .btn-chat {
  width: 15.63rem;
  height: 2.38rem;
  line-height: 2.38rem;
  background-color: #3b97f7;
  border-radius: 1.19rem;
  color: #fff;
  text-align: center;
}