#global-loader {
  position: absolute;
  inset: 0;
  background-color: #1f2028;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 10px;
  color: white;
}

@keyframes global-loader__spinner-animation {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

@keyframes appear {
  0% {
    transform: translateX(-120px);
    opacity: 0;
  }

  40% {
    transform: translateX(0);
    opacity: 1;
  }

  60% {
    transform: translateX(120px);
    opacity: 0;
  }

  100% {
    transform: translateX(-120px);
    opacity: 0;
  }
}

.spinner {
  animation: global-loader__spinner-animation 1s linear infinite;
}

.loading {
  width: 100%;
  text-transform: uppercase;
  text-align: center;
  background: -webkit-linear-gradient(#006bff, #b366ff);
  background-clip: text;
  -webkit-text-fill-color: transparent;
  overflow: hidden;
}

.loading__string-1 {
  animation: appear 2s -0.1s ease-in-out infinite;
  opacity: 0;
}

.loading__string-2 {
  animation: appear 2s ease-in-out infinite;
  opacity: 0;
}