/*
 * Theme Overrides for Bootstrap Dark Mode
 * Custom PARQ colors
 */

:root {
  /* PARQ Brand Colors */
  --color-brand: #ec3327;
  --color-gray-500: #aaa;
  --color-black: #0e0c0c;

  /* Override primary color to use brand red */
  --bs-primary: #ec3327;
  --bs-primary-rgb: 236, 51, 39;
}

/* Dark theme specific overrides */
[data-bs-theme="dark"] {
  /* Use PARQ colors */
  --bs-primary: #ec3327;
  --bs-primary-rgb: 236, 51, 39;

  /* Override dark mode backgrounds to use #0e0c0c */
  --bs-body-bg: #0e0c0c;
  --bs-body-bg-rgb: 14, 12, 12;

  --bs-dark: #0e0c0c;
  --bs-dark-rgb: 14, 12, 12;

  /* Card backgrounds */
  --bs-secondary-bg: #1a1818;
  --bs-tertiary-bg: #262424;

  /* Borders */
  --bs-border-color: #2a2828;

  /* Text colors */
  --bs-secondary-color: #aaa;
  --bs-secondary-color-rgb: 170, 170, 170;
}

/* Make primary elements use brand red */
.text-primary {
  color: var(--color-brand) !important;
}

.btn-primary {
  --bs-btn-bg: var(--color-brand);
  --bs-btn-border-color: var(--color-brand);
  --bs-btn-hover-bg: #d32d21;
  --bs-btn-hover-border-color: #d32d21;
  --bs-btn-active-bg: #ba281d;
  --bs-btn-active-border-color: #ba281d;
}

.btn-outline-primary {
  --bs-btn-color: var(--color-brand);
  --bs-btn-border-color: var(--color-brand);
  --bs-btn-hover-bg: var(--color-brand);
  --bs-btn-hover-border-color: var(--color-brand);
}

.bg-primary {
  background-color: var(--color-brand) !important;
}

.badge.bg-primary {
  background-color: var(--color-brand) !important;
}

.link-primary {
  color: var(--color-brand) !important;
}

.link-primary:hover,
.link-primary:focus {
  color: #d32d21 !important;
}

/* Fix any light backgrounds that don't work in dark mode */
.card-header.bg-white {
  background-color: var(--color-black) !important;
  color: var(--bs-light);
}

.alert-light {
  --bs-alert-bg: #1a1818;
  --bs-alert-color: var(--color-gray-500);
  --bs-alert-border-color: #2a2828;
}

/* Navbar background */
.navbar {
  background-color: var(--color-black) !important;
}

/* Card backgrounds */
.card {
  background-color: #1a1818;
  border-color: #2a2828;
}

.card-header {
  background-color: #1a1818;
  border-bottom-color: #2a2828;
}

/* Text muted uses gray */
.text-muted {
  color: var(--color-gray-500) !important;
}

/* List group items */
.list-group-item {
  background-color: #1a1818;
  border-color: #2a2828;
}

.list-group-item:hover {
  background-color: #262424;
}