@layer ddsweb-large-atoms {
  @layer ddsweb-spinner {
    .bfIYcq_image {
      width: var(--size);
      height: var(--size);
      transform-origin: center;
      animation-duration: 1s;
      animation-timing-function: linear;
      animation-iteration-count: var(--animation-repeat);
      animation-fill-mode: forwards;
      animation-play-state: var(--animation-play-state);
      animation-name: bfIYcq_spin;
    }

    .bfIYcq_normal {
      --ddsweb-spinner-base-colour: var(--dds-interaction-colour-interactive-default);
      --ddsweb-spinner-load-colour: var(--dds-interaction-colour-interactive-default);
    }

    .bfIYcq_dark {
      --ddsweb-spinner-base-colour: var(--dds-retain-colour-in-dark-mode-retain-interactive-inverse);
      --ddsweb-spinner-load-colour: var(--dds-retain-colour-in-dark-mode-retain-interactive-inverse);
    }

    .bfIYcq_image circle {
      transform-origin: center;
      transition: stroke-dashoffset .3s ease-in-out;
      transform: rotate(-90deg);
    }

    @media (prefers-reduced-motion: reduce) {
      .bfIYcq_image {
        animation-duration: 2s;
      }

      .bfIYcq_image circle {
        transition-duration: 0s;
      }
    }

    @keyframes bfIYcq_spin {
      0% {
        transform: rotate(0);
      }

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

    .bfIYcq_indeterminate {
      --animation-repeat: infinite;
      --animation-play-state: running;
    }

    .bfIYcq_determinate {
      --animation-repeat: 1;
      --animation-play-state: paused;
    }

    .bfIYcq_xx, .bfIYcq_xs {
      --size: var(--ddsweb-tc-spinner-xs-size, 16px);
    }

    .bfIYcq_sm {
      --size: var(--ddsweb-tc-spinner-sm-size, 24px);
    }

    .bfIYcq_md {
      --size: var(--ddsweb-tc-spinner-md-size, 32px);
    }

    .bfIYcq_lg {
      --size: var(--ddsweb-tc-spinner-lg-size, 40px);
    }

    .bfIYcq_xl {
      --size: var(--ddsweb-tc-spinner-xl-size, 64px);
    }

    .bfIYcq_base {
      stroke: var(--ddsweb-spinner-base-colour, var(--dds-interaction-colour-interactive-default));
    }

    .bfIYcq_load {
      stroke: var(--ddsweb-spinner-load-colour, var(--dds-interaction-colour-interactive-default));
    }
  }
}


/*# sourceMappingURL=94b23d735ec30917124f.css.map*/