.animated-gradient-text {
  display: inline-block;
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  background-size: 200% auto;
  background-image: linear-gradient(to right, var(--gradient-colors));
}

.animated-gradient-text-right {
  animation: animated-gradient-text-flow-right var(--animation-speed, 8s) linear infinite;
}

.animated-gradient-text-left {
  animation: animated-gradient-text-flow-left var(--animation-speed, 8s) linear infinite;
}

@keyframes animated-gradient-text-flow-right {
  from {
    background-position: 0% center;
  }
  to {
    background-position: -200% center;
  }
}

@keyframes animated-gradient-text-flow-left {
  from {
    background-position: -200% center;
  }
  to {
    background-position: 0% center;
  }
}