/* Header site search — a disclosure button in the white bar that opens a
   full-width panel under the header.

   The panel is absolutely positioned against header.scrollnav (the only
   positioned ancestor, because it is fixed), so it overlays page content
   instead of growing the header and shifting the layout. */

.yxc-search {
    display: flex;
    align-items: center;
}

.yxc-search__toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    /* 2.5.8 Target Size */
    min-height: 44px;
    min-width: 44px;
    padding: 0.4em 1em;
    border: 2px solid var(--contrast, #016778);
    border-radius: 33px;
    background-color: transparent;
    /* Buttons on this site are the italic-black brand face. */
    font-family: var(--gp-font--myriad-pro), Georgia, serif;
    font-weight: 900;
    font-style: italic;
    font-size: 1.125rem;
    line-height: 1;
    color: var(--contrast, #016778);
    cursor: pointer;
    transition: background-color 150ms ease, color 150ms ease;
}

.yxc-search__toggle:hover,
.yxc-search__toggle[aria-expanded="true"] {
    background-color: var(--contrast, #016778);
    color: #fff;
}

.yxc-search__toggle svg {
    width: 1.1em;
    height: 1.1em;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.4;
    stroke-linecap: round;
}

.yxc-search__panel {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 998;
    background-color: var(--darkblue, #003740);
    border-top: 3px solid var(--contrast-3, #aa272f);
    box-shadow: 0 18px 33px rgba(38, 37, 37, 0.24);
}

.yxc-search__form {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 11px;
    max-width: 1111px;
    margin: 0 auto;
    padding: 22px 33px;
}

.yxc-search__field {
    flex: 1 1 260px;
    min-width: 0;
    padding: 12px 16px;
    border: 2px solid #fff;
    border-radius: 7px;
    background-color: #fff;
    /* 16px minimum stops iOS zooming the whole page on focus. */
    font-size: 1.0625rem;
    color: var(--accent, #262525);
}

.yxc-search__field::placeholder {
    /* 4.6:1 on white. */
    color: #6b6b6b;
    opacity: 1;
}

.yxc-search__submit {
    flex: 0 0 auto;
    min-height: 44px;
    padding: 12px 28px;
    border: 2px solid #fff;
    border-radius: 7px;
    background-color: var(--contrast-3, #aa272f);
    font-family: var(--gp-font--myriad-pro), Georgia, serif;
    font-weight: 900;
    font-style: italic;
    font-size: 1.125rem;
    line-height: 1;
    color: #fff;
    cursor: pointer;
}

.yxc-search__submit:hover {
    background-color: var(--contrast, #016778);
}

.yxc-search__panel :focus-visible {
    outline: 3px solid var(--lightgreen, #bdd688);
    outline-offset: 2px;
    box-shadow: none;
}

@media (max-width: 768px) {
    /* Beside the hamburger there is no room for a word, so the button
       collapses to the icon. aria-label still names it. */
    .yxc-search__toggle {
        padding: 0.4em;
    }

    .yxc-search__toggle .yxc-search__label {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        clip-path: inset(50%);
        white-space: nowrap;
    }

    .yxc-search__form {
        padding: 16px 22px;
    }
}

/* The header hides itself on scroll-down; a panel left open would ride up with
   it, so sitesearch.js closes on scroll. Nothing to do here but make sure the
   panel never outlives a hidden header. */
.scrollnav.is-hidden .yxc-search__panel {
    display: none;
}

/* --------------------------------------------------------------------------
   Search results page (child theme search.php)
   -------------------------------------------------------------------------- */

.genex-search {
    max-width: 1111px;
    /* The fixed header is ~172px and the spacer under it is 128px, so a page
       that starts with text needs the difference back or its first line sits
       behind the navigation. */
    margin: 0 auto;
    padding: 77px 1.5rem clamp(4rem, 8vw, 7rem);
}

.genex-search__head {
    padding-bottom: 28px;
    margin-bottom: 33px;
    border-bottom: 3px solid var(--lightgreen, #bdd688);
}

.genex-search__eyebrow {
    margin: 0 0 0.875rem;
    font-family: var(--gp-font--gotham), system-ui, sans-serif;
    font-size: 0.8125rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--contrast, #016778);
}

.genex-search__title {
    margin: 0 0 0.5rem;
    font-size: clamp(2rem, 4.5vw, 3rem);
    color: var(--darkblue, #003740);
    overflow-wrap: anywhere;
}

.genex-search__count {
    margin: 0 0 1.25rem;
    color: var(--accent, #262525);
}

.genex-search__form {
    display: flex;
    flex-wrap: wrap;
    gap: 11px;
    max-width: 640px;
}

.genex-search__field {
    flex: 1 1 240px;
    min-width: 0;
    padding: 12px 16px;
    border: 2px solid var(--darkblue, #003740);
    border-radius: 7px;
    background-color: #fff;
    font-size: 1.0625rem;
    color: var(--accent, #262525);
}

.genex-search__submit {
    flex: 0 0 auto;
    min-height: 48px;
    padding: 12px 28px;
    border: 2px solid var(--darkblue, #003740);
    border-radius: 7px;
    background-color: var(--darkblue, #003740);
    font-family: var(--gp-font--myriad-pro), Georgia, serif;
    font-weight: 900;
    font-style: italic;
    font-size: 1.125rem;
    color: #fff;
    cursor: pointer;
}

.genex-search__submit:hover {
    background-color: var(--contrast, #016778);
    border-color: var(--contrast, #016778);
}

.genex-search__list {
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: none;
}

.genex-search__item {
    padding: 0 0 22px;
    margin: 0 0 22px;
    border-bottom: 1px solid rgba(139, 129, 121, 0.4);
}

.genex-search__item:last-child {
    border-bottom: 0;
}

.genex-search__item-title {
    margin: 0 0 0.25rem;
    font-size: clamp(1.25rem, 2vw, 1.5rem);
}

.genex-search__item-title a {
    color: var(--contrast, #016778);
    text-decoration: none;
}

.genex-search__item-title a:hover,
.genex-search__item-title a:focus-visible {
    text-decoration: underline;
    text-underline-offset: 4px;
}

.genex-search__crumb {
    margin: 0 0 0.5rem;
    font-size: 0.8125rem;
    /* 8.8:1 on white — --base would only be 3.8:1. */
    color: var(--darkgreen, #3b512b);
    overflow-wrap: anywhere;
}

.genex-search__excerpt {
    margin: 0;
    line-height: 1.6;
    color: var(--accent, #262525);
}

.genex-search__empty h2 {
    margin: 0 0 0.75rem;
    color: var(--darkblue, #003740);
}

.genex-search__suggestions {
    display: flex;
    flex-wrap: wrap;
    gap: 11px;
    margin: 1.25rem 0 0;
    padding: 0;
    list-style: none;
}

.genex-search__suggestions a {
    display: inline-block;
    padding: 11px 22px;
    border: 2px solid var(--contrast, #016778);
    border-radius: 33px;
    color: var(--contrast, #016778);
    text-decoration: none;
    font-weight: 700;
}

.genex-search__suggestions a:hover,
.genex-search__suggestions a:focus-visible {
    background-color: var(--contrast, #016778);
    color: #fff;
}

.genex-search .pagination {
    margin-top: 33px;
}

.genex-search .pagination .page-numbers {
    display: inline-block;
    min-width: 44px;
    min-height: 44px;
    padding: 11px 14px;
    margin-right: 6px;
    border: 2px solid var(--contrast, #016778);
    border-radius: 7px;
    color: var(--contrast, #016778);
    text-align: center;
    text-decoration: none;
}

.genex-search .pagination .page-numbers.current {
    background-color: var(--darkblue, #003740);
    border-color: var(--darkblue, #003740);
    color: #fff;
}