@keyframes dv-loading-circle-outer {
  0% {
    stroke: #02bcfe;
  }
  50% {
    stroke: #3be6cb;
  }
  100% {
    stroke: #02bcfe;
  }
}

@keyframes dv-loading-circle-inner {
  0% {
    stroke: #3be6cb;
  }
  50% {
    stroke: #02bcfe;
  }
  100% {
    stroke: #3be6cb;
  }
}

.dv-loading {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  &-tip {
    font-size: $font-size;
  }

  &-circle-outer {
    stroke: #02bcfe;
    animation: dv-loading-circle-outer 3s infinite;
  }

  &-circle-inner {
    stroke: #02bcfe;
    animation: dv-loading-circle-outer 3s infinite;
  }
}
