/*
 * Salient default header only. Keep its logo variants, menu markup, cart,
 * transparent home hero, mobile breakpoint and navigation handlers intact.
 */
@media (min-width: 1000px) {
    body #header-outer[data-format="default"] #top > .container > .row {
        align-items: center;
    }

    body #header-outer[data-format="default"] #top .span_9 {
        flex: 1 1 0;
        min-width: 0;
    }

    body #header-outer[data-format="default"] #top nav {
        width: 100%;
        min-width: 0;
        align-items: center;
    }

    body #header-outer[data-format="default"] #top nav > ul.sf-menu:not(.buttons) {
        flex: 1 1 0;
        min-width: 0;
        height: auto;
        flex-wrap: wrap;
        justify-content: flex-end;
        align-content: center;
        padding: 10px 0;
    }

    body #header-outer[data-format="default"] #top nav > ul.sf-menu > li {
        flex: 0 0 auto;
        height: auto;
        min-height: 44px;
        align-items: center;
    }

    body #header-outer[data-format="default"] #top nav > ul.sf-menu > li:not(.button_social_group) > a {
        display: flex;
        align-items: center;
        min-height: 44px;
        white-space: nowrap;
    }

    body #header-outer[data-format="default"] #top nav > ul.buttons {
        flex: 0 0 auto;
        width: auto;
        height: auto;
        margin-left: 12px;
    }
}

/* The blog templates begin with real content, unlike the transparent home
 * hero. Reserve the measured height even when Salient hides its spacer.
 * Fallbacks also work before JS, with JS disabled, or with delayed scripts.
 */
body.odg-blog-header-clearance #header-space {
    display: block !important;
    height: var(--odg-shared-header-height, 170px) !important;
}

body.odg-blog-header-clearance #header-outer[data-format="default"].transparent {
    background-color: #0a2a52 !important;
}

/* Keep transparent Home/Contact branding, but put hero text below the
 * header's occupied area, including when the desktop menu wraps. */
body #ajax-content-wrap .odg-home__hero {
    padding-top: var(--odg-shared-header-height, 170px);
}

body #ajax-content-wrap .odg-c-hero__inner {
    padding-top: calc(var(--odg-shared-header-height, 170px) + 24px);
}

@media (max-width: 999px) {
    body.odg-blog-header-clearance #header-space {
        height: var(--odg-shared-header-height, 104px) !important;
    }

    body #ajax-content-wrap .odg-home__hero {
        padding-top: var(--odg-shared-header-height, 104px);
    }

    body #ajax-content-wrap .odg-home__hero-inner {
        padding-top: 16px;
    }

    body #ajax-content-wrap .odg-c-hero__inner {
        padding-top: calc(var(--odg-shared-header-height, 104px) + 24px);
    }
}

/* A long address in the shared Salient footer was wider than the viewport.
 * Wrap the text at its source, rather than clipping the entire document.
 */
body #footer-outer a {
    overflow-wrap: anywhere;
}

body #header-outer[data-format="default"] a:focus-visible,
body #slide-out-widget-area a:focus-visible,
body .slide_out_area_close:focus-visible {
    outline: 3px solid #FDB913;
    outline-offset: 3px;
    box-shadow: 0 0 0 6px #0a2a52;
}
