/* Maps the Sandoval palette (theme.css) onto Bootstrap 5's own CSS variables.
   Do not edit wwwroot/lib/bootstrap directly - override it here instead,
   per docs/branding/README.md's recommended pattern. */

:root {
  --bs-primary: var(--sandoval-color-navy);
  --bs-primary-rgb: 20, 33, 61;
  --bs-body-bg: var(--sandoval-bg);
  --bs-body-color: var(--sandoval-text);
  --bs-border-color: var(--sandoval-border);
  --bs-secondary-bg: var(--sandoval-surface);
  --bs-link-color: var(--sandoval-color-navy);
  --bs-link-color-rgb: 20, 33, 61;
  --bs-link-hover-color: var(--sandoval-color-orange);
  --bs-link-hover-color-rgb: 252, 163, 17;
}

.btn-primary {
  --bs-btn-color: var(--sandoval-color-white);
  --bs-btn-bg: var(--sandoval-color-navy);
  --bs-btn-border-color: var(--sandoval-color-navy);
  --bs-btn-hover-color: var(--sandoval-color-white);
  --bs-btn-hover-bg: #1c2f56;
  --bs-btn-hover-border-color: #1c2f56;
  --bs-btn-active-color: var(--sandoval-color-white);
  --bs-btn-active-bg: #0e1729;
  --bs-btn-active-border-color: #0e1729;
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  color: var(--sandoval-color-white);
  background-color: var(--sandoval-color-navy);
}

/* Bootstrap's .form-select dropdown caret is a fixed-color SVG (--bs-form-select-bg-img)
   that Bootstrap only swaps via its own [data-bs-theme="dark"] attribute, which this app
   never sets (dark mode here is prefers-color-scheme only) - so without this, the dark
   stroke (#343a40) is nearly invisible against the dark-mode background. */
@media (prefers-color-scheme: dark) {
  .form-select {
    --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23e5e5e5' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  }
}

/* Orange is a sparingly-used accent, kept separate from Bootstrap's semantic
   "primary" so buttons across the app default to navy and only calls-to-action
   (e.g. "Log In") opt into the accent. */
.btn-accent {
  --bs-btn-color: var(--sandoval-accent-ink);
  --bs-btn-bg: var(--sandoval-color-orange);
  --bs-btn-border-color: var(--sandoval-color-orange);
  --bs-btn-hover-color: var(--sandoval-accent-ink);
  --bs-btn-hover-bg: #ffb733;
  --bs-btn-hover-border-color: #ffb733;
  --bs-btn-active-color: var(--sandoval-accent-ink);
  --bs-btn-active-bg: #e0900a;
  --bs-btn-active-border-color: #e0900a;
  --bs-btn-focus-shadow-rgb: 252, 163, 17;
  color: var(--bs-btn-color);
  background-color: var(--bs-btn-bg);
  border-color: var(--bs-btn-border-color);
}
