.volunteer-finder {
    --volunteer-border: #b8bec4;
    --volunteer-accent: var(--e-global-color-primary, #234e65);
    color: inherit;
    font: inherit;
}
.volunteer-finder, .volunteer-finder * { box-sizing: border-box; }
.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;
    box-shadow: 0 2px 8px rgb(0 0 0 / 8%);
}
.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 .volunteer-finder__options > li[role="option"] {
    margin: 0; list-style: none;
    padding: .75rem; min-height: 44px; cursor: pointer; overflow-wrap: anywhere;
}
.volunteer-finder .volunteer-finder__options > li[role="option"]::before {
    content: none;
    display: none;
}
.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: 1.25rem; margin-top: 1.5rem; }
.volunteer-finder .volunteer-finder__opportunity {
    display: flex; align-items: flex-start; gap: 1.5rem;
    margin: 0; padding: 1.5rem;
    border: 1px solid var(--volunteer-border); border-radius: 8px;
    box-shadow: 0 3px 12px rgb(0 0 0 / 6%);
    background: var(--e-global-color-astglobalcolor5, #fff);
}
.volunteer-finder .volunteer-finder__logo {
    flex: 0 0 112px; width: 112px; height: 88px; max-width: 112px;
    object-fit: contain; object-position: center; align-self: center;
}
.volunteer-finder__card-content { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.volunteer-finder .volunteer-finder__title {
    margin: 0 0 .5rem; font-size: 1.25em; font-weight: 600; line-height: 1.35;
    color: inherit;
}
.volunteer-finder .volunteer-finder__summary { margin: 0; line-height: 1.65; }
.volunteer-finder__actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.25rem; margin-top: 1rem; }
.volunteer-finder .volunteer-finder__website {
    display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
    min-height: 44px; padding: .5rem 1rem; border: 1px solid currentColor;
    border-radius: 4px; font-size: .875em; font-weight: 400; line-height: 1.4;
    color: var(--volunteer-accent); text-decoration: none;
}
/* Override theme link decoration only for this card's website action. */
.volunteer-finder .volunteer-finder__opportunity a.volunteer-finder__website,
.volunteer-finder .volunteer-finder__opportunity a.volunteer-finder__website:is(:hover, :focus, :active, :visited) {
    text-decoration: none !important;
}
.volunteer-finder__contacts { display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; min-width: 0; max-width: 100%; }
.volunteer-finder .volunteer-finder__contact {
    display: inline-flex; align-items: center; gap: .5rem;
    min-height: 44px; min-width: 0; max-width: 100%; color: inherit;
    font-size: .875em; font-weight: 400;
}
.volunteer-finder .volunteer-finder__contact span { min-width: 0; overflow-wrap: anywhere; }
.volunteer-finder .volunteer-finder__opportunity a.volunteer-finder__contact,
.volunteer-finder .volunteer-finder__opportunity a.volunteer-finder__contact:is(:hover, :focus, :active, :visited) {
    color: var(--volunteer-accent);
    text-decoration: none;
}
.volunteer-finder .volunteer-finder__icon { flex: 0 0 20px; width: 20px; height: 20px; }
.volunteer-finder .volunteer-finder__disclosure { margin: 1rem 0 0; border: 0; padding: 0; }
.volunteer-finder .volunteer-finder__toggle {
    display: inline-flex; align-items: center; gap: .5rem;
    min-height: 44px; padding: 0; cursor: pointer; list-style: none;
    color: var(--volunteer-accent); font-size: .875em; font-weight: 400;
}
.volunteer-finder .volunteer-finder__toggle::before,
.volunteer-finder .volunteer-finder__toggle::after { content: none; display: none; }
.volunteer-finder .volunteer-finder__toggle::marker { content: ''; }
.volunteer-finder .volunteer-finder__toggle::-webkit-details-marker { display: none; }
.volunteer-finder__disclosure[open] > .volunteer-finder__toggle .volunteer-finder__icon { transform: rotate(180deg); }
.volunteer-finder__body { padding-top: .75rem; overflow-wrap: anywhere; }
.volunteer-finder__body > :first-child { margin-top: 0; }
.volunteer-finder__body > :last-child { margin-bottom: 0; }
.volunteer-finder .volunteer-finder__body a,
.volunteer-finder .volunteer-finder__body a:hover { text-decoration: none; font-weight: 400; }
.volunteer-finder :is(input, button, summary, a):focus-visible {
    outline: 3px solid var(--volunteer-accent); outline-offset: 3px;
}
@media (max-width: 600px) {
    .volunteer-finder .volunteer-finder__opportunity { flex-direction: column; gap: 1rem; padding: 1.25rem; }
    .volunteer-finder .volunteer-finder__logo { flex: 0 0 auto; object-position: left center; align-self: flex-start; }
    .volunteer-finder__card-content { width: 100%; }
    .volunteer-finder__actions { align-items: flex-start; flex-direction: column; }
    .volunteer-finder__contacts { flex-direction: column; gap: .25rem; }
}
@media (max-width: 480px) {
    .volunteer-finder__search { flex-wrap: wrap; }
    .volunteer-finder__combobox { flex-basis: 100%; }
}
