@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  * {
    @apply min-w-0 border-neutral-200 dark:border-neutral-800;
  }
  html {
    text-rendering: optimizelegibility;
  }
  body {
    @apply bg-white dark:bg-neutral-950 text-neutral-950 dark:text-white min-h-[100dvh];
  }
}

@layer utilities {
  .bg-dashed {
    background-image: linear-gradient(
      45deg,
      #e5e5e5 12.50%,
      transparent 12.50%,
      transparent 50%,
      #e5e5e5 50%,
      #e5e5e5 62.50%,
      transparent 62.50%,
      transparent 100%
    );
    background-size: 0.25rem 0.25rem;
  }
}

@keyframes move-x {
  0% {
    transform: translateX(var(--move-x-from));
  }
  100% {
    transform: translateX(var(--move-x-to));
  }
}
