.zap-container {
  position: relative;
  border-radius: 12px;
  border: 1px solid transparent;
  @apply bg-layer-0;
  background-clip: padding-box;
  padding: 8px 12px;
}

.zap-container:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  margin: -1px;
  background: linear-gradient(to bottom right, #ff902b, #f83838);
  border-radius: inherit;
}

.zap-container.big-zap:before {
  background: linear-gradient(60deg, #2bd9ff, #8c8ded, #f838d9, #f83838, #ff902b, #ddf838);
  animation: animatedgradient 3s ease alternate infinite;
  background-size: 300% 300%;
}

@keyframes animatedgradient {
  0% {
    background-position: 0% 50%;
  }

  50% {
    background-position: 100% 50%;
  }

  100% {
    background-position: 0% 50%;
  }
}
