:root[data-bs-theme="dark"] {
  --bs-body-bg: #0a1619;
  --bs-body-color: #e0f0f0;
  --bs-primary: #00bcd4;
  --bs-primary-rgb: 0, 188, 212;
  --bs-success: #4caf50;
  --bs-success-rgb: 76, 175, 80;
  --bs-link-color: #00bcd4;
  --bs-navbar-bg: #061214;
  --bs-sidebar-bg: #071e22;
  --player-bg: #041014;
}

body {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.bg-navbar {
  background-color: var(--bs-navbar-bg) !important;
}

.sidebar {
  background-color: var(--bs-sidebar-bg);
  width: 240px;
  min-width: 240px;
}

.offcanvas.bg-sidebar {
  background-color: var(--bs-sidebar-bg);
}

.player-bar {
  background: var(--player-bg);
  border-top: 1px solid #1a3a3f;
}

.track-item {
  transition: background 0.2s;
}

.track-item:hover {
  background: rgba(0, 188, 212, 0.15) !important;
}

.tiny {
  font-size: 0.75rem;
}

#now-playing-artist {
  color: var(--bs-secondary-color);
}

/* Make audio player fit the dark theme */
audio {
  filter: invert(0.9) hue-rotate(180deg);
  height: 40px;
}

/* Offcanvas backdrop */
.offcanvas-backdrop {
  background-color: rgba(0,0,0,0.7);
}