/* Site search: the field on the brand row (an icon on small screens) and the results page. Tokens come from theme.css. */

/* ===== header ===== */
.site-search-box { position: relative; flex: none; }
.site-search svg, .site-search-toggle svg { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.site-search {
    display: flex; align-items: center;
    width: 21rem; max-width: 100%;
    background: var(--surface);
    border: 1px solid var(--blue-300);
    border-radius: 999px;
    box-shadow: var(--shadow-sm);
    transition: border-color .15s ease, box-shadow .15s ease;
}
.site-search:focus-within { border-color: var(--blue-600); box-shadow: 0 0 0 3px var(--blue-100); }
.site-search-input {
    flex: 1; min-width: 0;
    padding: .55rem .4rem .55rem 1.1rem;
    border: 0; background: transparent; outline: none;
    color: var(--ink); font: inherit; font-size: 1rem;
}
.site-search-input::placeholder { color: var(--muted); }
.site-search-submit {
    flex: none; display: grid; place-items: center;
    width: 2.4rem; height: 2.4rem; margin: .15rem;
    border: 0; border-radius: 50%;
    background: var(--navy-700); color: #fff; cursor: pointer;
    transition: background-color .15s ease;
}
.site-search-submit:hover, .site-search-submit:focus-visible { background: var(--blue-600); }
.site-search-toggle { display: none; }

@media (max-width: 991.98px) {
    .site-search-toggle {
        display: grid; place-items: center;
        width: 2.8rem; height: 2.8rem;
        border: 1px solid var(--line); border-radius: 50%;
        background: var(--surface); color: var(--navy-700); text-decoration: none;
        box-shadow: var(--shadow-sm);
    }
    .site-search-toggle:hover, .site-search-toggle:focus-visible { border-color: var(--blue-300); color: var(--navy-900); }
    /* closed: no field; open (search_controller.js): a panel under the icon, over the content */
    .site-search { display: none; }
    .site-search.is-open {
        display: flex;
        position: absolute; top: calc(100% + 1rem); right: 0; z-index: 1040;
        width: min(21rem, calc(100vw - 2rem));
        max-width: none; /* the box it is anchored to is only as wide as the icon */
        box-shadow: var(--shadow-md);
    }
}

/* ===== results page ===== */
.search-page-form { display: flex; gap: .6rem; margin: 0 0 1.4rem; }
.search-page-form .form-control { flex: 1; min-width: 0; }
.search-note, .search-summary { margin: 0 0 1.2rem; color: var(--muted); }
.search-results { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; }
.search-result {
    padding: 1rem 1.2rem 1.1rem;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
}
.search-type { display: inline-block; font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--blue-600); }
.site-panel-body .search-title { margin: .15rem 0 .1rem; font-size: 1.2rem; }
.search-title a { text-decoration: none; }
.search-title a:hover, .search-title a:focus-visible { text-decoration: underline; }
.search-section { color: var(--muted); font-size: .88rem; }
.search-snippet { margin: .5rem 0 0; line-height: 1.6; }
.search-result mark { padding: 0 .12em; border-radius: 3px; background: #fff0b8; color: inherit; }
.search-pager { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.5rem; color: var(--muted); }