.loading:after {
    content: "";
    animation-duration: 1s;
    animation-name: loadingAnimation;
    animation-iteration-count: infinite;
}
  
@keyframes loadingAnimation {
    from {
      content: "";
    }
  
    33% {
      content: ".";
    }
    
    66% {
      content: "..";
    }
  
    to {
      content: "...";
    }
}


@keyframes rotateAnimation {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(180deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.loadingIcon svg path{
  animation: rotateAnimation 2s ease-in-out infinite;
  overflow: hidden; /* Prevent overflow */
  transform-origin: center; /* Center the rotation */
  box-sizing: border-box; /* Include padding and borders in dimensions */
}

.icon {
  width: min-content;
  height:min-content;
}