/* 273HQ brand: replaces the placeholder Trezo-theme blue (#1A73E8) with the steel blue from the
   273HQ logo (#5E7FA1 = rgb(94,127,161)); the logo's navy is #27405F. Loaded after style.css so the
   cascade wins for the same selectors - no Sass recompile needed (CI deploys the checked-in
   style.css as-is, and Node isn't always available where this repo is edited).

   --bs-primary/--bs-primary-rgb covers every Bootstrap utility derived from them (.text-primary,
   .bg-primary, .border-primary). .btn-primary / .btn-outline-primary and a handful of selectors that
   style.css hardcodes (nav link hover, hero accent word, stat numbers, "active" pricing card,
   back-to-top, preloader spinner) each need their own explicit override below. */
:root {
  --bs-primary: #5E7FA1;
  --bs-primary-rgb: 94, 127, 161;
}
.btn-primary {
  --bs-btn-bg: #5E7FA1;
  --bs-btn-border-color: #5E7FA1;
  --bs-btn-hover-bg: #52718F;
  --bs-btn-hover-border-color: #4D6B89;
  --bs-btn-focus-shadow-rgb: 118, 146, 175;
  --bs-btn-active-bg: #4D6B89;
  --bs-btn-active-border-color: #476480;
  --bs-btn-disabled-bg: #5E7FA1;
  --bs-btn-disabled-border-color: #5E7FA1;
}
.btn-outline-primary {
  --bs-btn-color: #5E7FA1;
  --bs-btn-border-color: #5E7FA1;
  --bs-btn-hover-bg: #5E7FA1;
  --bs-btn-hover-border-color: #5E7FA1;
  --bs-btn-focus-shadow-rgb: 94, 127, 161;
  --bs-btn-active-bg: #5E7FA1;
  --bs-btn-active-border-color: #5E7FA1;
  --bs-btn-disabled-color: #5E7FA1;
  --bs-btn-disabled-border-color: #5E7FA1;
}

.navbar .navbar-nav .nav-link:hover,
.navbar .navbar-nav .nav-link.active {
  color: #5E7FA1 !important;
}
.banner-content h2 span,
.banner-content .h2 span {
  color: #5E7FA1;
}
.about-trezo-single-item h2,
.about-trezo-single-item .h2 {
  color: #5E7FA1;
}
.pricing-single-item.active,
[data-theme=dark] .pricing-single-item.active {
  background-color: #27405F;
}
#backtotop {
  background-color: #5E7FA1;
}
#preloader .preloader .loader,
#preloader .preloader .loader div {
  border-top-color: #5E7FA1;
  border-border-bottom: #5E7FA1;
}
a:hover {
  color: #5E7FA1;
}

/* Brand lockup (navbar + footer): the logo mark is dark navy, so on the dark theme it is turned
   white to stay visible, same treatment as the oregon-poc sidebar. The wordmark is a plain <span>
   (not an h1-h6), so it needs an explicit color too. */
.brand-lockup { gap: 10px; }
.brand-lockup .brand-logo { height: 40px; width: auto; }
.brand-lockup .brand-name { font-weight: 700; font-size: 28px; letter-spacing: .5px; color: #27405F; }
[data-theme=dark] .brand-lockup .brand-name { color: #fff; }

/* Stand-in for a product screenshot until the real image is dropped in. Replace the
   <div class="screenshot-placeholder"> in index.html with an <img> to remove. */
.screenshot-placeholder {
  display: flex; align-items: center; justify-content: center;
  width: 100%; aspect-ratio: 16 / 10; min-height: 220px;
  background: linear-gradient(135deg, #27405F 0%, #3A5A80 100%);
  border: 1px dashed rgba(255, 255, 255, .35);
  color: rgba(255, 255, 255, .75); font-size: 18px; font-weight: 500;
}

/* Falling snow (home page only, see initSnow in custom.js). Sits above the page backgrounds but
   below the navbar, ignores the mouse, and is faint enough not to compete with the text. */
#snow {
  position: fixed; inset: 0; width: 100%; height: 100%;
  z-index: 5; pointer-events: none;
}

/* Screenshots open full size in the lightbox (fslightbox, data-fslightbox="screens"). */
.screenshot-link { display: block; cursor: zoom-in; }
.screenshot-link img { transition: filter .2s ease; }
.screenshot-link:hover img { filter: brightness(1.12); }