/* Konfigurasi warna kustom untuk Tailwind */
@tailwind base;
@tailwind components;
@tailwind utilities;

@layer utilities {
  .bg-spotify-base {
    background-color: #121212;
  }
  .text-spotify-green {
    color: #1DB954;
  }
  .bg-spotify-green {
    background-color: #1DB954;
  }
}

/* Custom Scrollbar biar proper mirip aplikasi desktop */
.custom-scrollbar::-webkit-scrollbar { 
    width: 10px; 
}
.custom-scrollbar::-webkit-scrollbar-track {
    background: transparent;
}
.custom-scrollbar::-webkit-scrollbar-thumb { 
    background: rgba(255, 255, 255, 0.3); 
    border-radius: 4px; 
}
.custom-scrollbar::-webkit-scrollbar-thumb:hover { 
    background: rgba(255, 255, 255, 0.5); 
}

/* Animasi halus untuk Play Button di Cards */
.card-play-btn {
    opacity: 0;
    transform: translateY(8px);
    transition: all 0.3s ease;
}
.playlist-card:hover .card-play-btn {
    opacity: 1;
    transform: translateY(0);
}