/* Variants */
/* Define maps for color-related variables */
/* Define maps for size-related variables */
@keyframes rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
nv-loader {
  display: inline-block;
  position: relative;
  aspect-ratio: 1/1;
  border-radius: 9999px;
  color: inherit;
}
nv-loader.size-xs {
  width: var(--loader-size-xs);
  height: var(--loader-size-xs);
}
nv-loader.size-xs::before, nv-loader.size-xs::after {
  content: " ";
  position: absolute;
  top: 0;
  left: 0;
  border-radius: inherit;
  width: 100%;
  height: 100%;
}
nv-loader.size-xs::before {
  content: " ";
  border: calc(var(--loader-size-xs) / 10) solid;
  opacity: 0.3;
}
nv-loader.size-xs::after {
  content: " ";
  border-top: calc(var(--loader-size-xs) / 10) solid transparent;
  border-left: calc(var(--loader-size-xs) / 10) solid transparent;
  border-right: calc(var(--loader-size-xs) / 10) solid transparent;
  border-bottom: calc(var(--loader-size-xs) / 10) solid;
  animation: rotation 1s linear infinite;
}
nv-loader.size-sm {
  width: var(--loader-size-sm);
  height: var(--loader-size-sm);
}
nv-loader.size-sm::before, nv-loader.size-sm::after {
  content: " ";
  position: absolute;
  top: 0;
  left: 0;
  border-radius: inherit;
  width: 100%;
  height: 100%;
}
nv-loader.size-sm::before {
  content: " ";
  border: calc(var(--loader-size-sm) / 10) solid;
  opacity: 0.3;
}
nv-loader.size-sm::after {
  content: " ";
  border-top: calc(var(--loader-size-sm) / 10) solid transparent;
  border-left: calc(var(--loader-size-sm) / 10) solid transparent;
  border-right: calc(var(--loader-size-sm) / 10) solid transparent;
  border-bottom: calc(var(--loader-size-sm) / 10) solid;
  animation: rotation 1s linear infinite;
}
nv-loader.size-md {
  width: var(--loader-size-md);
  height: var(--loader-size-md);
}
nv-loader.size-md::before, nv-loader.size-md::after {
  content: " ";
  position: absolute;
  top: 0;
  left: 0;
  border-radius: inherit;
  width: 100%;
  height: 100%;
}
nv-loader.size-md::before {
  content: " ";
  border: calc(var(--loader-size-md) / 10) solid;
  opacity: 0.3;
}
nv-loader.size-md::after {
  content: " ";
  border-top: calc(var(--loader-size-md) / 10) solid transparent;
  border-left: calc(var(--loader-size-md) / 10) solid transparent;
  border-right: calc(var(--loader-size-md) / 10) solid transparent;
  border-bottom: calc(var(--loader-size-md) / 10) solid;
  animation: rotation 1s linear infinite;
}
nv-loader.size-lg {
  width: var(--loader-size-lg);
  height: var(--loader-size-lg);
}
nv-loader.size-lg::before, nv-loader.size-lg::after {
  content: " ";
  position: absolute;
  top: 0;
  left: 0;
  border-radius: inherit;
  width: 100%;
  height: 100%;
}
nv-loader.size-lg::before {
  content: " ";
  border: calc(var(--loader-size-lg) / 10) solid;
  opacity: 0.3;
}
nv-loader.size-lg::after {
  content: " ";
  border-top: calc(var(--loader-size-lg) / 10) solid transparent;
  border-left: calc(var(--loader-size-lg) / 10) solid transparent;
  border-right: calc(var(--loader-size-lg) / 10) solid transparent;
  border-bottom: calc(var(--loader-size-lg) / 10) solid;
  animation: rotation 1s linear infinite;
}
nv-loader.size-xl {
  width: var(--loader-size-xl);
  height: var(--loader-size-xl);
}
nv-loader.size-xl::before, nv-loader.size-xl::after {
  content: " ";
  position: absolute;
  top: 0;
  left: 0;
  border-radius: inherit;
  width: 100%;
  height: 100%;
}
nv-loader.size-xl::before {
  content: " ";
  border: calc(var(--loader-size-xl) / 10) solid;
  opacity: 0.3;
}
nv-loader.size-xl::after {
  content: " ";
  border-top: calc(var(--loader-size-xl) / 10) solid transparent;
  border-left: calc(var(--loader-size-xl) / 10) solid transparent;
  border-right: calc(var(--loader-size-xl) / 10) solid transparent;
  border-bottom: calc(var(--loader-size-xl) / 10) solid;
  animation: rotation 1s linear infinite;
}
nv-loader.color-brand::before {
  border-color: var(--components-loader-brand-background);
  opacity: 1;
}
nv-loader.color-brand::after {
  border-bottom-color: var(--components-loader-brand-foreground);
}
nv-loader.color-white::before {
  border-color: var(--components-loader-white-background);
  opacity: 1;
}
nv-loader.color-white::after {
  border-bottom-color: var(--components-loader-white-foreground);
}