:root {
  --brand-1: #ff2f92;
  --brand-2: #ff2f92;
  --brand-3: #ec4e99;
  --gray-1: #4a4a4a;
  --gray-2: #4a4a4a;
  --gray-3: #9b9b9b;
  --gray-4: #9b9b9b;
  --gray-5: rgba(0, 0, 0, 0.2);
  --gray-6: rgba(0, 0, 0, 0.1);
  --gray-7: rgba(0, 0, 0, 0.05);
  --gray-8: rgba(0, 0, 0, 0.03);
  --gray-dark: #4a4a4a;
  --red: #ff2f92;
  --btn-primary-color: #ffffff;
}
.ChatApp,
.MessageContainer,
.Navbar,
.Message .Bubble,
.QuickReplies,
.ChatFooter {
  background-repeat: no-repeat;
  background-size: cover;
}
.ChatApp {
  background-color: #ffffff;
}
.MessageContainer {
  background-image: linear-gradient(180deg, #ffffff 0%, #f2f2f2 100%);
}
.Navbar {
  background-color: #ffffff;
}
.Message.left .Bubble {
  background-color: #fff;
}
.Message.right .Bubble {
  background-image: linear-gradient(180deg, #fc636b 0%, #fc636b 100%);
  color: #ffffff;
}
.QuickReply.highlight {
  height: 32px;
}
.QuickReplies,
.ChatFooter {
  background-color: rgba(242, 244, 245, 0.95);
}
.Message.left .Bubble {
  border-radius: 4px 20px 20px 20px;
}
.Message.right .Bubble {
  border-radius: 20px 4px 20px 20px;
}
.Btn {
  border-radius: 16px;
}
.QuickReply {
  border-radius: 20px;
}
.Message.right[data-type="text"] a {
  pointer-events: none;
  cursor: default;
}
.Message.right .Message-main > .Avatar {
  display: none;
}
