.ConvoMessage {
  display: flex;
  flex-direction: column;
  width: fit-content;
  max-width: 100%;
  padding: 8px 10px;
  background-color: var(--vkd--color_background_message);
  border-radius: 14px;
  overflow-wrap: break-word;
  /* для поддержки нескольких пробелов подряд можно заюзать pre-wrap */
  white-space: pre-line;
  user-select: text;
}

.ConvoMessage--out {
  background-color: var(--vkd--color_background_message_out);
}

.ConvoMessage__author {
  color: var(--vkui--color_text_link);
  font: 500 var(--smallFontSize) / var(--smallLineHeight) var(--fontFamily);
  margin-bottom: 2px;
}

.ConvoMessage__time {
  position: relative;
  float: right;
  font: var(--messageDateFontSize) / var(--messageDateLineHeight) var(--fontFamily);
  margin: 4px 0 4px 6px;
  bottom: -6px;
  color: var(--vkui--color_text_secondary);
  user-select: none;
}

.ConvoMessage--out .ConvoMessage__time {
  color: var(--vkui--color_text_accent_themed);
}

.ConvoMessage__status {
  display: inline-flex;
  align-items: center;
  width: 14px;
  height: var(--messageDateFontSize);
  vertical-align: bottom;
  margin-left: 3px;
}

.ConvoMessage__empty {
  color: var(--vkui--color_text_secondary);
}

.ConvoMessage__author + .ConvoMessage__attaches,
.ConvoMessage__text + .ConvoMessage__attaches,
.ConvoMessage__reply + .ConvoMessage__attaches {
  margin-top: 6px;
}
