.container {
  width: 100vw;
  height: 100vh;
  background-color: #F4F4F4;
  z-index: 0;
}
.safetytips-box{
  background: rgba(255, 149, 0, 0.1);
  padding: 9px;
}
.safetytips{
  font-family: 'PingFang SC';
  font-style: normal;
  font-weight: 400;
  font-size: 24rpx;
  line-height: 36rpx;
  text-align: justify;
  color: #FF8C39;
}
.report{
  float: right;
  color: #006EFF;
}
.tui-navigatorbar{
  position: absolute;
  top: 0;
  width: 750rpx;
  height: 172rpx;
  background-color: #ffffff;
}

.tui-navigatorbar-back{
  position: absolute;
  width: 48rpx;
  height: 48rpx;
  left: 40rpx;
  bottom: 20rpx;
}

.conversation-title {
  position:absolute;
  width: 350rpx;
  height: 88rpx;
  line-height: 56rpx;
  font-size: 36rpx;
  color: #e68080;
  bottom: 0;
  left: 200rpx;
  display: flex;
  justify-content: center;
  align-items: center;
}
.tui-chatroom-navigatorbar{
  position: relative;
  /*top: 0;*/
  flex-shrink: 0;
  width: 750rpx;
  height: 176rpx;
  background-color: #006EFF;
}

.tui-chatroom-navigatorbar-back{
    position: absolute;
    width: 60rpx;
    height: 60rpx;
    left: 24rpx;
    bottom: 15rpx;
}

.conversation-title {
  position: absolute;
  width: 350rpx;
  height: 88rpx;
  line-height: 56rpx;
  font-size: 36rpx;
  color: #000000;
  bottom: 0;
  left: 200rpx;
  display: flex;
  justify-content: center;
  align-items: center;
}
.list-box {
  /* position: absolute; */
  width: 100vw;
  /* position: fixed; */
}
.list-box-notips {
  height: calc(100vh - 284px);
}
.list-box-group {
    height: calc(100vh - 248px);
    top: 254rpx;  
}
.list-box-group-notips {
    height: calc(100vh - 320px) !important;
    top: 246rpx;
}
.input-area {
  position: relative;
  z-index: 2;
  /* z-index: 999999; */
  /* position: absolute;
  bottom: 20px; */
}
.message-list {
  width: 100%;
  height: 100%;
}

.message-input {
  flex-shrink: 0;
  width: 100%;
  padding-bottom: var(--padding);
  background-color: #ffffff;
  /* z-index: 999999; */
}
.calling {
  position: fixed;
  z-index: 199;
  top: 0;
  bottom: 0;
  right: 0;
}
.group-profile {
    top: 151rpx;
    left: 0;
    z-index: 8;
    position: absolute;
}
.info{
  /* position: relative; */
  z-index: 9;
  height: 100rpx;
  background-color: rgb(255, 255, 255);
  display: flex;
  padding:0 20rpx;
  justify-content: space-between;
  align-items: center;
  box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.08);
}
.left{
  display: flex;
   justify-content:space-between;
  align-items: center;
 
}
.right{
  
  font-size: 28rpx;
  color: #FFFFFF;
  /* padding-right: 20rpx; */
}
.time_desc{
 color:#E34D59;
 display: flex;
 font-size: 32rpx;
 align-items: center;
}

.time_desc .item{
  color:#E34D59;
 
  display: flex;
  align-items: center;
  font-size: 32rpx;
}
.count_time{
  font-size: 32rpx;
  display: flex;
  height:100rpx;
  align-items: center;
}
.circle_top{
  width: 10rpx;
  height: 10rpx;
  margin-right: 10rpx;
  background: #3CC7C0;
  border-radius: 50%;
}
.right_txt{
  background: #3CC7C0;
  border-radius: 29rpx;
  padding: 10rpx 20rpx;
}
.name{
  font-size: 34rpx;
  color: #3CC7C0;
  text-align: center;
}
.age{
  display: flex;
  align-items: center;
  margin-left: 20rpx;
  font-size: 34rpx;
  color: #666666;
}
.status{
  display: flex;
  justify-content: center;
  background: #FFF2E8;
  box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.08);
  border-radius: 10rpx;
  font-size: 24rpx;
  color: #FA541C;
  padding: 10rpx 20rpx;
}
.status_complete{
  color: #ffffff;
  background-color: #c5c5c5;
}
.dialog{
  width: 50%;
  text-align: center;
  height: 100rpx;
  line-height: 100rpx;
}
.dialog_cancel_btn{
  border-top: 1px solid #E9E9E9;
  border-right: 1px solid #E9E9E9;
}
.dialog_confirm_btn{
  border-top: 1px solid #E9E9E9;
  color: #3CC7C0;
}