/**
 * Bootstrap Video Playlist — Minimal styles
 * Relies on Bootstrap 5.3 utilities for layout.
 */

/* Portrait aspect ratio (phone videos) — not built into Bootstrap */
.ratio-9x16 {
  --bs-aspect-ratio: 177.78%;
}

.video-playlist .vpl-tracklist {
  max-height: 280px;
}

.video-playlist .vpl-tracklist .list-group-item {
  padding: 0.5rem 0.75rem;
  font-size: 0.875rem;
  cursor: pointer;
}

.video-playlist .vpl-tracklist .list-group-item.active {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
  color: var(--bs-white);
}

.video-playlist .vpl-tracklist .list-group-item.active .vpl-badge {
  background-color: var(--bs-white) !important;
  color: var(--bs-primary);
}

.video-playlist .vpl-tracklist .list-group-item.active .text-body-secondary {
  color: rgba(255, 255, 255, 0.7) !important;
}

.video-playlist .vpl-toggle {
  padding: 0.2rem 0.4rem;
  line-height: 1;
}

.video-playlist video {
  background-color: #000;
}