$brand-primary: null !default;
$focus-loading-color: $brand-primary !default;

.focus-loading {
   display: flex;
   align-items: center;
   justify-content: center;
   padding: 30px;

   &::before {
      content: '';
      display: block;
      border: 3px solid $focus-loading-color;
      border-radius: 50%;
      border-right-color: transparent;
      width: 50px;
      height: 50px;
      animation: focus-loader 1.25s infinite linear;
   }
}

@keyframes focus-loader {
   0% {
      transform: rotate(0);
   }

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