/* Media-only messages size to the rendered image instead of filling the row. */
.message-bubble.image-bubble {
  width: max-content;
  min-width: 0;
  max-width: min(78%, 560px);
}

.message-bubble.image-bubble img {
  width: auto;
  height: auto;
  max-width: 380px;
  max-height: 470px;
  object-fit: contain;
}

@media (max-width: 800px) {
  .message-bubble.image-bubble {
    max-width: 84%;
  }

  .message-bubble.image-bubble img {
    max-width: 100%;
  }
}