
#chat_box button {
  display: flex;
  width: auto;
  cursor: pointer;
	outline: none;
	border: none;
  background-color: rgb(220, 220, 220);
}
#chat_box button p {
  width: 100%;
	text-align: center;
}
#chat_box button.chat_item:hover,
#chat_box .chat_item button:hover {
  background-color: rgb(200, 200, 200);
}
#chat_box button.chat_item:active,
#chat_box .chat_item button:active {
  background-color: rgb(190, 190, 190);
}


/* BTN LIST
   add or remove '.btn' to toggle the hover effect
*/
#chat_box .list_btn button {
	margin: 0px;
	background-color: transparent;
}
#chat_box .list_btn {
	background-color: rgb(240, 240, 240);
}


/* BACK
*/
#chat_box .chat_item.chat_back button {
	width: 30px;
	height: 100%;
  background-color: transparent;
	display: none;
}
#chat_box .chat_item.chat_back button::before {
	content: "";
	position: absolute;
	top: calc(50% - 6px - 1px);
	left: 6px;
	width: 14px;
	height: 14px;
	border-left: 1px solid black;
	border-bottom: 1px solid black;
	transform: rotate(45deg);
}

