/*-------------------------------------------------------------
8.1 chat
-------------------------------------------------------------*/
.chat-wrapper{
	margin:-24px;
	.chatsidebar-wrapper{
		width:15.5rem;
		.a-list{
			transition: all 0.5s ease-in-out;
			&:hover{
				background: rgba(0,0,0,.04);
			}
		}
		.a-toolbar{
			height:64px !important;
		}
		.a-list-img{
			min-width:56px;
		}
		.scroll-bar{
			height: calc(100vh - 130px) !important;
		}
		.chatsidebar-content {
			.grayish-blue {
				.list-title {
				 	h6 {
	    				color: #dfeaff !important;
					}
					p {
    					color: $text-color !important;
					}
				}
			}
		}	
   }
   .chat-footer{
		box-shadow: 0px 0px 20px rgba(0,0,0,0.07);
		padding: 0 1rem;
		height: 90px;
      .input-slot{
         label{
            line-height: normal;
         }
         
      }
   }
	.sidenav-wrapper{
	 	height:calc(100vh - 64px);
	 	overflow:hidden;
	 	.mat-drawer-inner-container{
	 		overflow:hidden;
	 	}
	}
	.chatarea-wrapper {
		.chatarea-content {
			.a-toolbar-content {
				background-color:$chat-header-bg;
				height:64px !important;
				box-shadow:$chat-header-shadow;
			}
			.toggle-btn {
				display:none;
			}
			.chat-body{
				
				.scroll-bar{
					height: calc(100vh - 218px) !important;
				}
				.chat-block{
					.chat-bubble-wrap{
						margin: 0 1rem;
						width: calc(50% - 70px);
						.chat-bubble.odd{
							border-radius:$chat-body-radius;
						} 
						.chat-bubble.even{
						   border-radius: 20px 20px 20px 0;
						   box-shadow:$chat-block-box-shadow;
						   background-color:$chat-block-bg !important;
						   // color: $chat-text-color;
						}
					}
				}
			}	
		}	
	}

}

.avatar-wrap {
	width: 50px;
	img {
		width: 50px;
		height: 50px;
	}
}
@media (max-width: 959px) {
 	.chatarea-content {
 		.toggle-btn {
 			display: block !important;
 		}
 	}
}

@media (max-width: 599px) {
	.chat-wrapper .chatarea-wrapper .chatarea-content .chat-body .chat-block .chat-bubble-wrap {
		margin: 0 1rem;
		width: calc(100% - 70px);
	}
	.chat-wrapper .chatarea-content .chat-head-right .video-icon {
    	display: none;
	}
}
