/* Dark mode overrides for all non-song-details pages */

/* Set dark background for body and main container */
body {
  background-color: #121212 !important;
  color: rgba(255, 255, 255, 0.87) !important;
}

.container {
  background-color: #121212 !important;
}

/* Override light backgrounds in tables */
.table-responsive {
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  border-radius: 4px;
  background-color: rgba(18, 18, 18, 0.8) !important;
  overflow: auto;
}

/* Override light backgrounds in table headers */
thead tr {
  background-color: rgba(255, 255, 255, 0.05) !important;
}

/* Override light backgrounds in cards */
.album-card, .artist-card {
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  border-radius: 4px;
  padding: 1rem;
  background-color: rgba(255, 255, 255, 0.05) !important;
  text-align: center;
}

/* Override light text colors */
.profile-label {
  color: rgba(255, 255, 255, 0.7) !important;
}

/* Override Bootstrap card backgrounds */
.card {
  background-color: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
}

/* Override Bootstrap list group item backgrounds */
.list-group-item {
  background-color: rgba(255, 255, 255, 0.05) !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
}

/* Override text-muted to ensure it's visible on dark backgrounds */
.text-muted {
  color: rgba(255, 255, 255, 0.6) !important;
}

/* Override edit container styles for dark mode */
.edit-container, .edit-layout {
  background-color: rgba(33, 37, 41, 0.95) !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
  color: rgba(255, 255, 255, 0.87) !important;
}

/* Override body background in edit pages */
body[data-bs-theme="dark"] {
  background-color: #121212 !important;
}

/* Override fieldset styles in edit forms */
fieldset {
  border-color: rgba(255, 255, 255, 0.2) !important;
  background-color: rgba(255, 255, 255, 0.05) !important;
}

/* Override form control styles for dark mode */
.form-control, .form-select {
  background-color: rgba(33, 37, 41, 0.95) !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
  color: rgba(255, 255, 255, 0.87) !important;
}

.form-control:focus, .form-select:focus {
  background-color: rgba(33, 37, 41, 0.95) !important;
  border-color: rgba(13, 110, 253, 0.5) !important;
  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25) !important;
  color: rgba(255, 255, 255, 0.87) !important;
}

/* Override preview panel styles */
.preview-panel {
  background-color: rgba(33, 37, 41, 0.95) !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
}

/* Override modal styles for dark mode */
.modal-content {
  background-color: rgba(33, 37, 41, 0.95) !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
}

.modal-header, .modal-footer {
  border-color: rgba(255, 255, 255, 0.2) !important;
}

/* Override Bootstrap table striping for better visibility in dark mode */
.table-striped > tbody > tr:nth-of-type(odd) {
  background-color: rgba(255, 255, 255, 0.05) !important;
}

.table-striped > tbody > tr:nth-of-type(even) {
  background-color: rgba(18, 18, 18, 0.8) !important;
}

/* Override Bootstrap table-danger for deleted items */
.table-danger, .table-danger > td, .table-danger > th {
  background-color: rgba(220, 53, 69, 0.2) !important;
  color: rgba(255, 255, 255, 0.87) !important;
}

/* Override page-link for better visibility in dark mode */
.page-link {
  background-color: rgba(255, 255, 255, 0.05) !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
  color: rgba(255, 255, 255, 0.87) !important;
}

.page-item.active .page-link {
  background-color: var(--bs-primary) !important;
  border-color: var(--bs-primary) !important;
  color: white !important;
}