/* ========================================
   Enhanced Winamp Player Styles
   Authentic Classic Winamp UI
   ======================================== */

/* ===== MAIN WINAMP PLAYER CONTAINER ===== */
.winamp-yt-player {
  /* Position controlled by inline styles to avoid conflicts */
  z-index: 10000 !important;
  width: 340px;
  background: #232323 !important; /* Classic Winamp gray */
  border: 1px solid #000000 !important;
  border-radius: 0 !important;
  box-shadow: 
    2px 2px 0 rgba(255, 255, 255, 0.1),
    inset 1px 1px 0 rgba(255, 255, 255, 0.2),
    0 8px 32px rgba(0,0,0,0.6) !important;
  font-family: 'Pixelated MS Sans Serif', Arial, sans-serif !important;
  color: #00ff00 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  padding: 0 !important;
  user-select: none !important;
  /* Force visibility */
  visibility: visible !important;
  opacity: 1 !important;
  /* Ensure it's always on top */
  position: fixed !important;
  bottom: 30px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
}

/* ===== TITLEBAR ===== */
.winamp-yt-titlebar {
  background: linear-gradient(90deg, #0054aa, #0066cc) !important;
  color: white !important;
  font-weight: bold !important;
  font-size: 12px !important;
  padding: 3px 5px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  border-bottom: 1px solid #000 !important;
  height: 14px !important;
  line-height: 14px !important;
  text-shadow: 1px 1px 1px rgba(0,0,0,0.7) !important;
  user-select: none !important;
}

/* Winamp logo in titlebar */
.winamp-yt-titlebar::before {
  content: "▮▮▮" !important;
  color: white !important;
  font-size: 10px !important;
  margin-right: 5px !important;
  letter-spacing: -1px !important;
}

/* Winamp window controls */
.winamp-yt-titlebar::after {
  content: "_ □ ×" !important;
  font-size: 10px !important;
  color: white !important;
  letter-spacing: 2px !important;
}

/* ===== MAIN DISPLAY ===== */
.winamp-yt-controls {
  background: #232323 !important;
  padding: 4px !important;
  border-top: 1px solid rgba(255,255,255,0.1) !important;
  border-left: 1px solid rgba(255,255,255,0.1) !important;
  border-right: 1px solid #000 !important;
  border-bottom: 1px solid #000 !important;
}

/* ===== LCD DISPLAY ===== */
.winamp-yt-lcd {
  background: #000000 !important;
  color: #00ff00 !important;
  font-family: 'Digital-7', 'Share Tech Mono', monospace !important;
  padding: 4px 8px !important;
  margin-bottom: 4px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  border: 1px solid #444 !important;
  border-radius: 0 !important;
  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.8) !important;
  height: 18px !important;
  position: relative !important;
}

.winamp-yt-lcd-timer {
  font-size: 14px !important;
  font-weight: bold !important;
  text-shadow: 0 0 5px rgba(0, 255, 0, 0.7) !important;
}

.winamp-yt-lcd-title {
  font-size: 12px !important;
  color: #00ff00 !important;
  text-shadow: 0 0 5px rgba(0, 255, 0, 0.7) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  max-width: 220px !important;
  animation: scrollText 15s linear infinite !important;
}

@keyframes scrollText {
  0% { transform: translateX(100%); }
  100% { transform: translateX(-100%); }
}

/* ===== PLAYBACK CONTROLS ===== */
.winamp-external-play {
  background: linear-gradient(180deg, #444, #333) !important;
  color: #eeeeee !important;
  border: 1px outset #555 !important;
  border-radius: 0 !important;
  padding: 2px 8px !important;
  font-family: 'Pixelated MS Sans Serif', Arial, sans-serif !important;
  font-size: 11px !important;
  cursor: pointer !important;
  margin: 2px !important;
  box-shadow: 1px 1px 0 rgba(0,0,0,0.8) !important;
  text-transform: uppercase !important;
  font-weight: bold !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.winamp-external-play:hover {
  background: linear-gradient(180deg, #555, #444) !important;
}

.winamp-external-play:active {
  border-style: inset !important;
  background: linear-gradient(180deg, #333, #444) !important;
  box-shadow: inset 1px 1px 3px rgba(0,0,0,0.8) !important;
}

/* ===== EQUALIZER VISUALIZATION ===== */
.winamp-yt-spectrum {
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-end !important;
  height: 60px !important;
  background: #000000 !important;
  padding: 2px !important;
  margin: 4px 0 !important;
  border: 1px solid #444 !important;
  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.8) !important;
}

.winamp-yt-bar {
  width: 12px !important;
  background: linear-gradient(0deg, #00ff00, #99ff00, #ffff00, #ff9900, #ff0000) !important;
  height: 30px !important;
  animation: equalizerBounce 0.6s ease-in-out infinite alternate !important;
}

.winamp-yt-bar:nth-child(1) { animation-delay: -0.6s !important; }
.winamp-yt-bar:nth-child(2) { animation-delay: -0.5s !important; }
.winamp-yt-bar:nth-child(3) { animation-delay: -0.4s !important; }
.winamp-yt-bar:nth-child(4) { animation-delay: -0.3s !important; }
.winamp-yt-bar:nth-child(5) { animation-delay: -0.2s !important; }
.winamp-yt-bar:nth-child(6) { animation-delay: -0.1s !important; }
.winamp-yt-bar:nth-child(7) { animation-delay: 0s !important; }

@keyframes equalizerBounce {
  0% { height: 5px; }
  50% { height: 30px; }
  100% { height: 50px; }
}

/* ===== PLAYLIST BUTTON REMOVED ===== */

/* ===== STATUS BAR ===== */
.winamp-status-bar {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  background: #232323 !important;
  border-top: 1px solid #444 !important;
  padding: 4px 6px !important;
  font-size: 10px !important;
  color: #cccccc !important;
  height: 22px !important; /* Increased height */
  line-height: 22px !important; /* Added line height */
}

.status-text {
  font-size: 10px !important;
  color: #cccccc !important;
}

.status-time {
  font-family: 'Digital-7', 'Share Tech Mono', monospace !important;
  font-size: 10px !important;
  color: #cccccc !important;
}

/* ===== CURRENT SONG DISPLAY ===== */
.current-song {
  background: #000000 !important;
  color: #00ff00 !important;
  font-family: 'Share Tech Mono', monospace !important;
  padding: 8px !important;
  margin: 4px 0 !important;
  border: 1px solid #444 !important;
  text-align: center !important;
  font-size: 12px !important;
  text-shadow: 0 0 5px rgba(0, 255, 0, 0.7) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* ===== ADDITIONAL CLASSIC WINAMP ELEMENTS ===== */
/* Volume slider */
.winamp-volume-slider {
  width: 100% !important;
  height: 10px !important;
  background: #000000 !important;
  border: 1px solid #444 !important;
  margin: 4px 0 !important;
  position: relative !important;
}

.winamp-volume-slider::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  height: 100% !important;
  width: 75% !important; /* Default volume level */
  background: linear-gradient(90deg, #00ff00, #99ff00) !important;
}

/* Classic Winamp branding */
.winamp-branding {
  font-size: 8px !important;
  color: #666666 !important;
  text-align: right !important;
  padding: 2px 4px !important;
  font-family: Arial, sans-serif !important;
  letter-spacing: -0.5px !important;
}

/* Make sure buttons are visible and clickable */
.winamp-yt-player button,
.winamp-external-play {
  z-index: 10001 !important;
  position: relative !important;
  cursor: pointer !important;
  pointer-events: auto !important;
}
