.container {
  width: 100vw;
  height: 100vh;
  background-color: #F4F5F9;
  display: flex;
  flex-direction: column;
}

.enter {
  transform: translate3d(0,0,0);
  transform-origin: right;
  animation: pageEnter .3s ease-in-out;
}

@keyframes pageEnter {
  0%{
    transform:translate(100%, 0);
  }
  100% {
    transform:translate(0, 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: relative;
  top: 0;
  width: 100%;
  height: 172rpx;
  background-color: #006EFF;
}

.tui-navigatorbar-back{
  position: absolute;
  width: 48rpx;
  height: 48rpx;
  left: 40rpx;
  bottom: 20rpx;
  z-index: 2;
}
.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: #FFFFFF;
  bottom: 0;
  left: 200rpx;
  display: flex;
  justify-content: center;
  align-items: center;
  white-space: nowrap;
  overflow: hidden;
}
.list-box {
  height: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.list-box-group {
    height: calc(100vh - 248px);
    top: 254rpx;  
}

.input-area {
  position: relative;
}
.message-list {
  flex: 1;
  height: 0;
}

.message-input {
  flex-shrink: 0;
  width: 100%;
  padding-bottom: var(--padding);
  background-color: #F1F1F1;
}
.calling {
  position: fixed;
  z-index: 199;
  top: 0;
  bottom: 0;
  right: 0;
}
.group-profile {
  height: 60px;
  position: relative;
  z-index: 10;
}
.group{
  top: 0;
  left: 0;
  z-index: 10;
  position: absolute;
}