.volunteer-finder {
    --volunteer-border: #b8bec4;
    --volunteer-accent: var(--e-global-color-primary, #234e65);
    color: inherit;
    font: inherit;
}
.volunteer-finder [hidden] { display: none !important; }
.volunteer-finder label { display: block; font-weight: 600; margin-bottom: .5rem; }
.volunteer-finder__search { display: flex; align-items: flex-start; gap: .75rem; }
.volunteer-finder__combobox { position: relative; flex: 1; min-width: 0; }
.volunteer-finder input[role="combobox"] {
    width: 100%; min-height: 48px; padding: .75rem;
    border: 1px solid var(--volunteer-border); border-radius: 4px;
    background: #fff; color: #222; font: inherit;
}
.volunteer-finder .volunteer-finder__options {
    position: absolute; z-index: 20; top: 100%; left: 0; right: 0;
    max-height: 18rem; overflow-y: auto; margin: .25rem 0 0; padding: .25rem;
    list-style: none; background: #fff; color: #222;
    border: 1px solid var(--volunteer-border); border-radius: 4px;
    box-shadow: 0 4px 12px #0002;
}
.volunteer-finder__options [role="option"] {
    padding: .75rem; min-height: 44px; cursor: pointer; overflow-wrap: anywhere;
}
.volunteer-finder__options [aria-selected="true"],
.volunteer-finder__options [role="option"]:hover { background: #edf2f5; color: #111; }
.volunteer-finder button { font: inherit; min-height: 44px; }
.volunteer-finder__help { font-size: .875em; margin-top: .5rem; }
.volunteer-finder__status { margin: 1rem 0; }
.volunteer-finder__results { display: grid; gap: 1rem; margin-top: 1rem; }
.volunteer-finder__opportunity { border: 1px solid var(--volunteer-border); border-radius: 4px; }
.volunteer-finder__opportunity summary { cursor: pointer; padding: 1rem; }
.volunteer-finder__title { display: inline; font-size: 1.15em; font-weight: 600; }
.volunteer-finder__summary { display: block; margin: .5rem 0 0; font-weight: 400; }
.volunteer-finder__body { padding: 0 1rem 1rem; overflow-wrap: anywhere; }
.volunteer-finder__body > :last-child { margin-bottom: 0; }
.volunteer-finder__body a { text-decoration: underline; }
.volunteer-finder :is(input, button, summary, a):focus-visible {
    outline: 3px solid var(--volunteer-accent); outline-offset: 3px;
}
@media (max-width: 480px) {
    .volunteer-finder__search { flex-wrap: wrap; }
    .volunteer-finder__combobox { flex-basis: 100%; }
}

.volunteer-finder__heading {
    display: inline-flex; align-items: center; gap: 1rem;
    width: calc(100% - 1.5rem); vertical-align: middle;
}
.volunteer-finder__heading-copy { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.volunteer-finder .volunteer-finder__logo {
    flex: 0 0 88px; width: 88px; height: 64px; max-width: 88px;
    object-fit: contain; object-position: center;
}
@media (max-width: 480px) {
    .volunteer-finder__heading { gap: .75rem; }
    .volunteer-finder .volunteer-finder__logo {
        flex-basis: 56px; width: 56px; height: 48px; max-width: 56px;
    }
}
