.button-badge:hover {
  background-color: var(--base0C);
  cursor: unset;
}

.button-badge {
  vertical-align: unset;
  transform: unset;
  margin-top: unset;
}

.button-badge:active {
  transform: scale(0.75);
}

.badge-info {
  background-color: var(--base0E);
}

.badge-info:hover {
  background-color: var(--base0E);
}

.badge-rainbow {
  color: var(--base07);
  animation: rainbow 20s ease-in-out infinite;
}

@keyframes rainbow {
  0% {
    background: rgba(0, 105, 255, 0.71);
  }
  10% {
    background: rgba(100, 0, 255, 0.71);
  }
  20% {
    background: rgba(255, 0, 139, 0.71);
  }
  30% {
    background: rgba(255, 0, 0, 0.71);
  }
  40% {
    background: rgba(255, 96, 0, 0.71);
  }
  50% {
    background: rgba(202, 255, 0, 0.71);
  }
  60% {
    background: rgba(0, 255, 139, 0.71);
  }
  70% {
    background: rgba(202, 255, 0, 0.71);
  }
  80% {
    background: rgba(255, 96, 0, 0.71);
  }
  85% {
    background: rgba(255, 0, 0, 0.71);
  }
  90% {
    background: rgba(255, 0, 139, 0.71);
  }
  95% {
    background: rgba(100, 0, 255, 0.71);
  }
  to {
    background: rgba(0, 105, 255, 0.71);
  }
}