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

:root {
  --background: #121212;
  --foreground: #FFFFFF;

  /* Spotify Colors */
  --spotify-base: #121212;
  --spotify-sidebar: #000000;
  --spotify-player: #000000;
  --spotify-highlight: #1DB954;
  --spotify-hover: #282828;
  --spotify-text-main: #FFFFFF;
  --spotify-text-muted: #B3B3B3;
  --spotify-text-subdued: #A7A7A7;
}

@layer utilities {
  .no-scrollbar::-webkit-scrollbar {
    display: none;
  }

  .no-scrollbar {
    -ms-overflow-style: none;
    /* IE and Edge */
    scrollbar-width: none;
    /* Firefox */
  }
}

body {
  background: var(--spotify-base);
  color: var(--spotify-text-main);
  /* font-family set in layout via className */
}