/* MRM brand overrides for the Georgetown theme on closure pages.
   This file is the theme's own (originally empty) customization hook, loaded
   after styles.css. Keep it small and commented. */

/* Teal graphics -> Morgan navy family. The color lives in the PNGs, not CSS:
   service-icon tiles, the heart outline (shape-01), the plus grid (shape-04).
   The dots (shape-02) and circles (shape-03) are warm-toned and left alone. */
.service-icon img,
.shape-01 img,
.shape-04 img {
    filter: hue-rotate(45deg) saturate(0.75);
}

/* Flatten the cream paper texture (Dan 2026-08-10): the 50%-opacity backdrop
   the theme paints behind the banner's rounded corners. The navbar and the
   requesting-records panel textures are template-level data-background
   attributes, removed in georgetown_template.py in the same change. */
.main-banner:before,
.page-title-bg:before {
    background-image: none;
}


/* --- Salmon accent removed (Dan 2026-09-02) ----------------------------------
   styles.css had the theme accent #f8a683 in 58 places; it is now #1f4b8e. Two
   consequences need fixing here rather than in the vendor sheet. */

/* 1. .butn's hover fill was already #1f4b8e, so with a navy base the hover read
      as no change at all. Darker navy keeps the interaction visible. */
.butn:before {
    background: #15335f;
}

/* 2. .butn.white never had a white background - it only recoloured hover text,
      which is why the hero call-to-action was salmon like everything else. On the
      dark hero overlay a white button with navy text is the correct contrast. */
.butn.white {
    background-color: #ffffff;
    color: #1f4b8e;
}
.butn.white:before {
    background: #1f4b8e;
}
.butn.white:hover,
.butn.white:focus,
.butn.white:active {
    color: #ffffff;
}

/* 3. The last warm elements: the dot grid (shape-02) and circles (shape-03).
      The 2026-08-10 patch deliberately left these "warm-toned" while the accent
      was still salmon, so they matched. With the accent now navy they are the
      only warm thing on the page. Targeted by src rather than container class so
      the rule holds wherever the theme places them.
      NOTE the existing hue-rotate(45deg) above is tuned for TEAL sources; these
      are warm (~17deg hue), so reaching navy (~217deg) needs ~200deg instead. */
img[src*="shape-02"],
img[src*="shape-03"] {
    filter: hue-rotate(200deg) saturate(0.9);
}

/* 4. WOW.js reveal is NOT reliable - force content visible (2026-09-03).
      Measured with real scroll events: 12 of 13 .wow sections sit at
      visibility:hidden on our v2 render, and 8 of 9 on the live original
      georgetownsleepcenter.com - so it is inherited theme behaviour, not ours.
      Either way the page BODY ("Requesting Your Records", "How it works") is
      invisible to a normally-scrolling visitor, and a patient looking for how to
      request their records must never depend on an animation library firing.
      This disables the fade-in rather than trying to repair WOW: content
      availability beats animation on an informational page.
      NOTE an earlier check using window.scrollTo() found 0 hidden and looked
      fine - the theme's smooth-scroll plugin swallows programmatic scrolls, so
      that test never actually scrolled. Measure with real scroll events. */
.wow,
.wow.fadeIn,
.wow.fadeInUp,
.wow.fadeInLeft,
.wow.fadeInRight {
    visibility: visible !important;
    animation-name: none !important;
    opacity: 1 !important;
}


/* --- Mobile menu toggle: the last salmon element (found 2026-09-04) ---------
   The 2026-09-02 palette sweep reported "0 elements still computing the salmon"
   and it was wrong in a way worth recording: it ran at desktop width, where
   `.navbar-toggler` is display:none, so the scan never saw it. At a phone or
   tablet width the hamburger was still #f8a683 - the accent Dan asked to have
   removed - on all 898 v2 pages.

   It also lives outside the sheet that sweep edited: the rule is in
   css/plugins/nav-menu.css, not styles.css, so a search of styles.css alone
   could never have found it either. Overridden here rather than in the vendor
   plugin sheet, which is the established pattern for this theme.

   Lesson for the next palette check: scan at a MOBILE viewport too, and search
   every sheet the page loads, not just the one you patched. */
.navbar-toggler {
    background: #1f4b8e;
}


/* --- Reserve the hero height (MRM-HERO-CLS, 2026-09-08) --------------------------
   The hero is wrapped in an Owl Carousel that holds ONE slide. `.main-banner`
   had no reserved height, so it painted at content height and then Owl's JS set
   700px at ~1.5-2.0s, shoving the whole page down in one frame. Measured CLS was
   0.7214 (poor is >0.25), reproduced 3/3 on both a closure page and a
   practice-hosted page under a mobile viewport with 4x CPU throttling.

   700px is the settled height at 390px, 768px AND 1366px - measured at each - so
   a single min-height matches the final layout everywhere and leaves nothing to
   shift. It does not fight the JS; it just means the JS confirms a size the
   browser already reserved.

   The CTA patients came to click lives in this hero, so the old behaviour moved a
   tap target ~570px mid-load. That, not the score, is why this matters. */
.main-banner {
    min-height: 700px;
}


/* --- Video callout: render it below 992px (MRM-VIDEO-SECTION, 2026-09-08) ----------
   The image column is one of two col-lg-6 flex columns. At >=992px its height
   comes from flex-stretch against the taller text sibling; below 992px the
   columns stack, flex-stretch stops applying, and its only child is
   position:absolute - so it collapsed to height 0 on every phone and tablet.

   Measured before this rule: 0px at 390 and 768, 758px at 1366.

   Hiding it was the other option and was rejected: the play button still painted
   (a 12x26 orphaned icon), and the 278KB background is fetched anyway because the
   column is display:block-with-no-height rather than display:none. So mobile was
   paying for the image and getting nothing. This makes the bytes deliver.

   Selected by data-background so it cannot affect any other col-lg-6. */
@media (max-width: 991px) {
    [data-background*="mrm-video-thumb-bg"] {
        min-height: 320px;
    }
}


/* --- Bootstrap buttons in ported content (MRM-PORTED-BTN, 2026-09-08) -----------
   The patient-journey pages carry hand-authored content across from the classic
   template, and that content uses Bootstrap's `.btn .btn-primary`. Classic's
   default.css recoloured those to brand navy; v2 does not load default.css, so
   after the port they rendered Bootstrap's stock blue rgb(13,110,253) - most
   visibly the "Request My Records" button, which is the action those pages exist
   for.

   Safe to define globally here: measured, the 898 v2 closure pages contain ZERO
   .btn/.btn-primary elements (they use the theme's own .butn), so this rule can
   only reach ported content. White on #1f4b8e is 8.45:1, well past WCAG AA. */
.btn-primary,
.btn-primary:not(:disabled):not(.disabled) {
    background-color: #1f4b8e;
    border-color: #1f4b8e;
    color: #fff;
}
.btn-primary:hover,
.btn-primary:focus {
    background-color: #15335f;
    border-color: #15335f;
    color: #fff;
}
