/* ===========================================================================
   TEMPORARY theming overlay — controlled by the theme bar (_theme_bar.html).
   Remaps the site's "blue" to the chosen main colors. Fully self-contained:
   to roll back, remove the {% include "_theme_bar.html" %} line in base.html.
   Defaults below equal the original look, so with no selection nothing changes.
   =========================================================================== */
:root {
  --theme-main1: #1a56db;        /* current primary */
  --theme-main1-rgb: 26, 86, 219;
  --theme-main2: #0e3a8a;        /* current hero gradient end */
  --theme-bg: #ffffff;
}

/* Re-point Bootstrap's primary + links at the chosen main color */
:root {
  --bs-primary: var(--theme-main1);
  --bs-primary-rgb: var(--theme-main1-rgb);
  --bs-link-color: var(--theme-main1);
  --bs-link-color-rgb: var(--theme-main1-rgb);
  --bs-link-hover-color: var(--theme-main1);
}

/* Primary buttons (Bootstrap 5.3 uses per-component vars) */
.btn-primary {
  --bs-btn-bg: var(--theme-main1);
  --bs-btn-border-color: var(--theme-main1);
  --bs-btn-hover-bg: var(--theme-main1);
  --bs-btn-hover-border-color: var(--theme-main1);
  --bs-btn-active-bg: var(--theme-main1);
  --bs-btn-active-border-color: var(--theme-main1);
  --bs-btn-disabled-bg: var(--theme-main1);
  --bs-btn-disabled-border-color: var(--theme-main1);
}
.btn-outline-primary {
  --bs-btn-color: var(--theme-main1);
  --bs-btn-border-color: var(--theme-main1);
  --bs-btn-hover-bg: var(--theme-main1);
  --bs-btn-hover-border-color: var(--theme-main1);
  --bs-btn-active-bg: var(--theme-main1);
  --bs-btn-active-border-color: var(--theme-main1);
}

/* Utilities / common blue spots */
.text-primary { color: var(--theme-main1) !important; }
.bg-primary   { background-color: var(--theme-main1) !important; }
.navbar.bg-primary { background-color: var(--theme-main1) !important; }
a { color: var(--theme-main1); }

/* Hero / banner: solid main color by default… */
.hero-section { background: var(--theme-main1); }
/* …and a main1→main2 gradient when the gradient toggle is on */
html.theme-grad .hero-section {
  background: linear-gradient(135deg, var(--theme-main1) 0%, var(--theme-main2) 100%);
}

/* Page background (independent of the gradient toggle) */
body { background-color: var(--theme-bg); }