.loadingMessage {
  display: flex;
  align-items: flex-end;
  gap: 4px;
  padding: 16px;

  & > .dot {
    display: block;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background-color: #333;
    animation: bounceDot 1.2s infinite ease-in-out;

    &:nth-child(2) {
      animation-delay: 0.15s;
    }

    &:nth-child(3) {
      animation-delay: 0.3s;
    }
  }
}

@keyframes bounceDot {
  0%,
  60%,
  100% {
    transform: translateY(0);
  }

  30% {
    transform: translateY(-6px);
  }
}
