.root {
  position: relative;
}

.avatarContainer {
  position: absolute;
  z-index: 2;
  top: 0;
  bottom: 0;
  transform: translateX(0) scale(1);

  display: flex;
  flex-direction: column-reverse;

  opacity: 1;

  transition: opacity 0.2s, transform var(--select-transition);

  :global(.select-mode-active) & {
    transform: translateX(2.5rem);
  }
}

.senderAvatar {
  position: sticky !important;
  bottom: 0.25rem;

  :global(.select-mode-active) & {
    bottom: 5rem;

    @media (max-width: 600px) {
      bottom: 3.6875rem;
    }
  }
}

.contextMenu {
  position: absolute;

  :global(.bubble) {
    width: auto;
  }
}
