@import "../../static/iconfont.wxss";

.popup-box {
  padding: 60rpx 30rpx;
  display: flex;
  flex-direction: column;
  align-items: center;
  line-height: 1.3;
}
.popup-nav {
  font-size: 36rpx;
  color: #000;
  font-weight: 700;
  width: 100%;
}
.popup-nav-sub {
  font-size: 26rpx;
  color: #aaa;
  padding-top: 10rpx;
  width: 100%;
}
.avatar {
  position: relative;
  margin-top: 60rpx;
  border-radius: 100rpx;
  width: 180rpx;
  height: 180rpx;
}
.avatar::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 110%;
  height: 110%;
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.4);
  box-shadow: 0 0 2.5rem 0 rgba(0, 0, 0, 0.15);
}

.button {
  width: 100%;
  height: 100%;
  background-color: #f8f7f8;
  border-radius: 100rpx;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 0 !important;
  overflow: hidden;
}
.button::after {
  background-color: rgba(0, 0, 0, 0) !important;
  border: 0rpx solid rgba(0, 0, 0, 0) !important;
}
.icon-bg {
  font-size: 100rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  color: #e4e9ec;
  height: 100%;
}
.cam {
  position: absolute;
  bottom: 12rpx;
  right: -10rpx;
  width: 64rpx;
  height: 64rpx;
  border: 4rpx solid #fff;
  border-radius: 100rpx;
  background: #000;
  display: flex;
  justify-content: center;
  align-items: center;
}
.icon-cam {
  font-size: 40rpx;
  line-height: 1;
  color: #fff;
}
.input {
  margin: 50rpx 0 0;
  padding: 0 20rpx;
  height: 80rpx;
  border-radius: 12rpx;
  line-height: 80rpx;
  background: #f8f7f8;
  font-size: 32rpx;
  width: 650rpx;
}
.buttons {
  margin-top: 70rpx;
  width: 100%;
}