:root {
	--sent-background: #435f7a;
	--sent-color: #f5f5f5;
	--received-background: #d9dcde;
	--received-color: #656565;
}

body{
    font-family: 'Poppins', sans-serif;
}


.sent .message-data:before {
	border-color: #263238 transparent transparent transparent;
}

.sent .message-data:before {
	border-color: var(--sent-background) transparent transparent transparent;
}

.replies .message-data:after {
	border-color: var(--received-background) transparent transparent transparent;
}

.sent .chat-img-sgl, 
.sent .chat-img-duo, 
.sent .chat-img-grp, 
.sent .chat-gif, 
.sent .chat-txt, 
.sent .chat-code, 
.chat-fwd, 
.sent .link-meta, 
.sent .file-section, 
.sent .video-section,
.sent .chat-replied-bubble,
.sent .chat-audio {
    background: var(--sent-background);
}

.replies .chat-img-sgl, 
.replies .chat-img-duo, 
.replies .chat-img-grp, 
.replies .chat-gif, 
.replies .chat-txt, 
.replies .chat-code, 
.replies .message-data small, 
.replies .chat-fwd, 
.replies .link-meta, 
.replies .file-section, 
.replies .video-section,
.replies .chat-replied-bubble,
.replies .chat-audio {
    background: var(--received-background);
}

.cht.sent .message-data , .sent .file-header{
	color: var(--sent-color);
}

.cht.replies .message-data {
	color: var(--received-color);
    background: var(--received-background);
	box-shadow: 2px 2px 4px -3px rgb(0 0 0 / 75%);
}

.cht.sent .message-data{
	color: var(--sent-color);
    background: var(--sent-background);
	box-shadow: -2px 2px 4px -3px rgb(0 0 0 / 75%);
}

div[data-msg-type="5"].cht.replies .chat-txt, div[data-msg-type="5"].cht.replies .link-preview  {
	box-shadow: 2px 2px 4px -3px rgb(0 0 0 / 75%);
}

div[data-msg-type="5"].cht.sent .chat-txt, div[data-msg-type="5"].cht.sent .link-preview  {
	box-shadow: -2px 2px 4px -3px rgb(0 0 0 / 75%);
}
