/* pages/inviteFriend/inviteFriend.wxss */
@import "inviteProductListCell.ttss";
@import "inviteAlertView.ttss";

.invite-friend {
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: black; 
}

.invite-friend .invite-friend-bg{
  width: 100%;
  height: 750rpx;
  background-color: black;
}

.invite-friend  .invite-friend-rules {
  margin-left: 606rpx;
  margin-top: -357rpx;
  background-color: red;
  width: 144rpx;
  height: 44rpx;
  border-bottom-left-radius: 22rpx;
  border-top-left-radius: 22rpx;
  display: flex;
  justify-content: center;
  align-items: center;
}

.invite-friend  .invite-friend-rules .rules-text{
  color: white;
  font-size: 24rpx;
  font-weight: 500;
  text-align: center;
  align-self: center;
}

.invite-friend .invite-friend-content {
  margin-top: 41rpx;  
  margin-bottom: 51rpx;
  width: 690rpx;
  /* height: 1176rpx; */
  background-color: white;
  display: flex;
  flex-direction: column;
  border-radius: 30rpx;
}

.invite-friend .invite-friend-content  .invite-friend-top {
  width: 100%;
  margin-top: 59rpx;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.invite-friend .invite-friend-content  .invite-friend-top .inviter-info {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-bottom: 50rpx;
}

.inviter-nick {
  font-size: 36rpx;
  font-weight: 600;
  letter-spacing: 4rpx;
  text-align: center;
  color: #000000;
}

.inviter-headicon {
  margin-top: 19rpx;
  width: 100rpx;
  height: 100rpx;
  border-radius: 50rpx;
  background-color: gray; 
}

.inviter-trendword {
  margin-top: 14rpx;
  color: #b0b0b0;
  font-size: 18rpx;
  letter-spacing: 2rpx;
  font-weight: 500;
  text-align: center;
}

.invite-tip-content {
  margin-top: 20rpx;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.black-dot {
  background-color: black;
  width: 6rpx;
  height: 6rpx;
}

.invite-tip {
  margin-left: 20rpx;
  margin-right: 20rpx;
  color: black;
  font-size: 24rpx;
  letter-spacing: 2.6rpx;
  text-align: center;
  font-weight: 500;
}

.invite-friend .invite-friend-content .invite-friend-top .invite-info {
   width: 100%; 
  /* margin-left: 40rpx;
  margin-right: 50rpx; */
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.invite-friend .invite-friend-content .invite-friend-top .invite-info .invite-number-one {
  width: 30%;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-right: -20rpx;
}

.invite-number-two {
  width: 30%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.invite-number-three {
  width: 30%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.invite-info-separate {
   /* margin-left: 10rpx;
  margin-right: 10rpx;   */
	width: 1px;
	height: 75rpx;
	background: black;
}

.invite-info-blackText {
  text-align: center;
  font-size: 20rpx;
  font-weight: 500;
  color: #000000;
  letter-spacing: 2.2px;
}

.invite-info-redText {
  margin-top: 18rpx;
  text-align: center;
  font-size: 28rpx;
  font-weight: 600;
  color: #b40001;
  letter-spacing: 3.1px;
}

.invite-share {
  margin-top: 64rpx;
  width: 380rpx;
  height: 70rpx;
  border-radius: 35rpx;
  background-color: #b40001;
  display: flex;
  justify-content: center;
  align-items: center;
}

.invite-share-text {
  width: 100%;
  text-align: center;
  color: white;
  font-size: 28rpx;
  font-weight: 500;
  letter-spacing: 3.1rpx;
}
.shareButton1::after {
  border-width: 0rpx;
}

.shareButton1 {
  background-color: transparent;
  width: 100%;
  height: 100%;
}

.my-invite-content {
  width: 100%;
  margin-top: 38rpx;
  display: flex;
  flex-direction: column;
}

.my-invite-text {
  font-size: 32rpx;
  color: #290707;
  letter-spacing: 3.5rpx;
  font-weight: 500;
  align-self: center;
}

.friend-container {
  margin-top: 28rpx;
  margin-left: 90rpx;
  margin-right: 70rpx;
  width: 530rpx;
  height: 100rpx;
  background-color: white;
  white-space: nowrap;
  overflow:hidden;
 }

.friend-header-content {
  width: 100rpx;
  height: 100%;
  margin-right: 20rpx;
  display: inline-block; 
}

.friend-header-container {
  width: 100rpx;
  height: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-end; 
  /* background-color: rebeccapurple; */
}

.friend-header-ic {
  height: 90rpx;
  width: 90rpx;
  border-radius: 46rpx;
  border: 2rpx solid #e1e1e1;
  margin-bottom: 2rpx;
}

.friend-status {
  width: 40rpx;
  height: 40rpx;
  margin-left: -30rpx;
  margin-bottom: 2rpx;
}

.productlist-title-image {
  margin-top: 70rpx;
  width: 313rpx;
  height: 46rpx;
}

.product-container {
    margin-top: 30rpx;
    margin-bottom: 30rpx;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    background-color: white;
}