.reaction-wrapper {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.reaction-popup {
  position: absolute;
  bottom: 100%;
  left: 0;
  /* anchor to left */
  transform: none;
  /* remove centering */
  display: none;
  white-space: nowrap;
  z-index: 1000;
  padding: 5px 10px;
}

/* Show on hover */
.reaction-wrapper:hover .reaction-popup {
  display: flex;
}

.reaction-icon {
  cursor: pointer;
  transition: transform 0.2s ease;
}

.reaction-icon:hover {
  transform: scale(1.3);
}