/* Bootstrap theme color overrides for the my-home-est pages, scoped here (not
   style.css) so they only affect this page and don't touch the rest of rspusa.com.
   Every Bootstrap color utility reads the -rgb companion, not the hex var, so both
   are set for each slot. --bs-primary and its -rgb companion are left alone: they
   already equal the mockup's navy (#10303F) via style.css site-wide, so overriding
   them again here would just be a duplicate to drift. --bs-secondary is likewise
   left alone for buttons: the mockup's CTA color (#3C7C9A) already equals the
   site-wide default set in style.css, so .btn-secondary needs no override here -
   only the general teal accent used for text/icons (text-secondary, bg-secondary,
   etc.) differs from that default, which is why --bs-secondary/-rgb below use the
   mockup's teal (#0E7FA8) instead. */
:root {
  --bs-secondary: #0e7fa8;
  --bs-secondary-rgb: 14, 127, 168;
  --bs-secondary-color: #5c6b80;
  --bs-secondary-bg-subtle: #e9f1f6;
  --bs-tertiary-color: #94a3b8;
  --bs-success: #15803d;
  --bs-success-rgb: 21, 128, 61;
  --bs-success-bg-subtle: #f0fdf4;
  --bs-info: #336579;
  --bs-info-rgb: 51, 101, 121;
  /* The mockup's "amber" CTA slot (Pill CTA), which is Bootstrap's warning color */
  --bs-warning: #73a5bd;
  --bs-warning-rgb: 115, 165, 189;
  --bs-light: #f8fafc;
  --bs-light-rgb: 248, 250, 252;
  --bs-dark: #1f3f4e;
  --bs-dark-rgb: 31, 63, 78;

  /* Borders and radii from the mockup, so plain .border / .rounded-* classes match it.
     rspusa's Bootstrap build sets every radius to 25px, so each step is set here:
     rounded-1 = price tag, rounded-2 = inputs/stat cards/legend, rounded-3 = comp cards/
     chart/tiles, rounded-4 = trend/map cards, rounded-5 = estimate card/hero photo. */
  --bs-border-color: #e3e8ef;
  --bs-secondary-border-subtle: #dceaf1;
  --bs-success-border-subtle: #d3f0de;
  --bs-border-radius-sm: 7px;
  --bs-border-radius: 12px;
  --bs-border-radius-lg: 16px;
  --bs-border-radius-xl: 20px;
  --bs-border-radius-xxl: 24px;
  --bs-border-radius-pill: 50rem;
}

/* rspusa's Bootstrap build hardcodes .btn-warning's colors instead of reading --bs-warning,
   so its button vars are set to match (navy label, darker hover/active shades) */
.btn-warning {
  --bs-btn-color: #04213e;
  --bs-btn-bg: #73a5bd;
  --bs-btn-border-color: #73a5bd;
  --bs-btn-hover-color: #04213e;
  --bs-btn-hover-bg: #6895aa;
  --bs-btn-hover-border-color: #6895aa;
  --bs-btn-focus-shadow-rgb: 115, 165, 189;
  --bs-btn-active-color: #04213e;
  --bs-btn-active-bg: #5c8497;
  --bs-btn-active-border-color: #5c8497;
  --bs-btn-disabled-color: #04213e;
  --bs-btn-disabled-bg: #73a5bd;
  --bs-btn-disabled-border-color: #73a5bd;
}

/* Dark backgrounds use the deeper navy; set on .bg-dark only, since --bs-dark above is
   also the mockup's dark text color (text-dark) and shouldn't change */
.bg-dark {
  --bs-dark-rgb: 4, 33, 62;
}

/* Bootstrap dark color mode (data-bs-theme="dark"), e.g. the contact form on a navy card.
   rspusa's Bootstrap build leaves the dark mode set out, so the mockup's navy values are
   set here: body-bg is the input fill (form-control reads it), body-color the copy,
   secondary/tertiary the muted and faint text, border-color the input outline. */
[data-bs-theme=dark] {
  color-scheme: dark;
  --bs-body-color: #afc0d2;
  --bs-body-color-rgb: 175, 192, 210;
  --bs-body-bg: #0a2b4a;
  --bs-body-bg-rgb: 10, 43, 74;
  --bs-emphasis-color: #fff;
  --bs-emphasis-color-rgb: 255, 255, 255;
  --bs-secondary-color: #7e93aa;
  --bs-tertiary-color: #55708c;
  --bs-border-color: #22405c;
}