@import "tailwindcss";

@layer utilities {
  .scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  .scrollbar-hide::-webkit-scrollbar {
    display: none;
  }

  /* Industrial/Terminal aesthetic utilities */
  .grid-bg {
    background-image: url('/grid.svg');
  }

  .noise-bg {
    background-image: url('/noise.svg');
  }

  .scanline {
    background: repeating-linear-gradient(
      0deg,
      transparent,
      transparent 2px,
      rgba(0, 0, 0, 0.3) 2px,
      rgba(0, 0, 0, 0.3) 4px
    );
  }

  /* Grayscale filter with instant toggle */
  .grayscale {
    filter: grayscale(100%);
  }

  .grayscale-0 {
    filter: grayscale(0%);
  }
}