.ui-skeleton-loader {
  @apply inline-block min-h-[1rem] min-w-[2rem] overflow-hidden rounded bg-isa-neutral-300 relative;
}

.ui-skeleton-loader-bar {
  @apply block absolute top-0 left-0 right-0 bottom-0;
  @apply bg-gradient-to-r from-isa-neutral-300 via-isa-neutral-400 to-isa-neutral-300;
  animation: loader 1s ease-in-out infinite;

  @keyframes loader {
    0% {
      transform: translateX(-100%);
      opacity: 0.3;
    }
    50% {
      opacity: 1;
    }
    100% {
      transform: translateX(100%);
      opacity: 0.3;
    }
  }
}
