.button-primary {
  position: relative;
  padding: 12px 24px;
  border-radius: 9999px;
  background-color: black;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0);
  color: white;
  cursor: pointer;
  transition: all 150ms ease;
}

.button-primary:hover {
  background-color: #6366f1;
  box-shadow: 0 10px 15px -3px rgba(99, 102, 241, 0.5);
  color: white;
  transform: rotate(-6deg) scale(1.2);
  z-index: 999;
}

.button-primary:disabled {
  opacity: 0.5;
}

.button-secondary {
  position: relative;
  padding: 12px 24px;
  border-radius: 9999px;
  background-color: #f1f5f9;
  box-shadow: 0 10px 15px -3px rgba(100, 116, 139, 0);
  color: #1e293b;
  font-weight: 500;
  cursor: pointer;
  transition: all 150ms ease;
}

.button-secondary:hover {
  background-color: #6366f1;
  box-shadow: 0 10px 15px -3px rgba(99, 102, 241, 0.5);
  color: white;
  transform: rotate(6deg) scale(1.2);
  z-index: 999;
}

.button-secondary:disabled {
  opacity: 0.5;
}

.button-primary.small,
.button-secondary.small {
  padding: 10px 16px;
}

.button-primary div, .button-secondary div {
  /* width: 100%; */
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-align: center;
}