/* Locations module — shared styles for finder + single-location pages. */

/* ==========================================================================
   Page wrapper — design tokens
   ========================================================================== */

.opa-locations-page,
.opa-location-single {
    --opa-loc-card-bg: #fff;
    --opa-loc-card-border: #e2e6ea;
    --opa-loc-card-radius: 6px;
    --opa-loc-pill-radius: 999px;
    --opa-loc-primary: #1e6cb4;
    --opa-loc-primary-text: #fff;
    --opa-loc-ghost: #e9ecef;
    --opa-loc-ghost-text: #1f2933;
    --opa-loc-text: #1f2933;
    --opa-loc-muted: #5d6b7a;
    --opa-loc-shadow: 0 1px 2px rgba(0, 0, 0, .04);
    --opa-loc-strip-bg: #efefef;
    color: var(--opa-loc-text);
}

.opa-locations-page__inner {
    max-width: 1280px;
    margin: 0 auto;
    padding: 2rem 1.25rem;
}

.opa-locations-page__intro {
    margin-bottom: 1.5rem;
}

/* Filter bar (finder page). */

.opa-loc-filters {
    margin-bottom: 1rem;
}

.opa-loc-filters__row {
    display: grid;
    grid-template-columns: 1fr 1fr 1.4fr auto;
    gap: .75rem;
    align-items: center;

    @media (max-width: 900px) {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
}

.opa-providers-filters .opa-loc-filters__row {
    grid-template-columns: 1fr 1fr 1fr auto;
}

/* Multi-select filter facet. */

.opa-loc-filter {
    position: relative;
}

.opa-loc-filter__trigger {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: .5rem;
    border: 1px solid var(--opa-loc-card-border);
    background: #fff;
    color: var(--charcoal);
    border-radius: 4px;
    padding: .6rem 2.25rem .6rem .9rem;
    font-size: 1rem;
    line-height: 1.2;
    cursor: pointer;
    text-align: left;
    position: relative;

    &:is(:hover, :focus) {
        outline: none;
        background-color: rgba(0, 0, 0, .03);
    }
}

.opa-loc-filter__label {
    flex: 1;
}

.opa-loc-filter__count {
    background: var(--moss);
    color: var(--white);
    font-size: .8rem;
    font-weight: 600;
    border-radius: 99px;
    padding: .05rem .55rem;
    line-height: 1.3;
}

.opa-loc-filter__chevron {
    position: absolute;
    right: 1rem;
    top: 50%;
    width: 8px;
    height: 8px;
    border-right: 2px solid var(--charcoal);
    border-bottom: 2px solid var(--charcoal);
    transform: translateY(-70%) rotate(45deg);
    transition: transform .15s ease;
}

.opa-loc-filter[data-opa-filter-panel].is-open .opa-loc-filter__chevron {
    transform: translateY(-30%) rotate(-135deg);
}

.opa-loc-filter__panel {
    position: absolute;
    top: calc(100% + .5rem);
    left: 0;
    min-width: 100%;
    max-width: 22rem;
    background: #fff;
    border: 1px solid var(--opa-loc-card-border);
    border-radius: 8px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .12);
    padding: .75rem;
    z-index: 20;
}

.opa-loc-filter__panel[hidden] {
    display: none;
}

.opa-loc-filter__list {
    list-style: none;
    margin: 0 0 .5rem;
    padding: 0;
    max-height: 16rem;
    overflow-y: auto;
}

.opa-loc-filter__option {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .3rem .25rem;
    cursor: pointer;
    font-size: .95rem;
    color: var(--charcoal);
    border-radius: 4px;

    &:hover {
        background: rgba(0, 0, 0, .04);
    }

    input[type="checkbox"] {
        margin: 0;
        width: 1rem;
        height: 1rem;
        accent-color: var(--moss);
    }
}

.opa-loc-filter__actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding-top: .25rem;
    border-top: 1px solid var(--opa-loc-card-border);
}

.opa-loc-filter__apply {
    color: var(--charcoal);
    background: transparent;
    border: 2px solid var(--moss);
    border-radius: 99px;
    padding: .35rem 1.25rem;
    font-size: .85rem;
    font-weight: 500;
    cursor: pointer;

    &:is(:hover, :focus) {
        background-color: var(--moss);
        color: var(--white);
    }
}

.opa-loc-filter__clear {
    background: none;
    border: 0;
    color: var(--charcoal);
    text-decoration: underline;
    font-size: .85rem;
    cursor: pointer;
    padding: .25rem .5rem;
}

/* Active-filter chips strip. */

.opa-loc-chips {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
    margin: 0 0 1rem;
    padding: .5rem 0;
    border-top: 1px solid var(--opa-loc-card-border);
    border-bottom: 1px solid var(--opa-loc-card-border);
}

.opa-loc-chips__count {
    font-weight: 600;
    color: var(--charcoal);
    font-size: .9rem;
}

.opa-loc-chips__list {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    margin: 0;
    padding: 0;
    flex: 1;
}

.opa-loc-chip {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    background: var(--moss);
    color: var(--white);
    border-radius: 99px;
    padding: .2rem .75rem;
    font-size: .85rem;
    text-decoration: none;

    &:hover,
    &:focus {
        filter: brightness(1.1);
        text-decoration: none;
        color: var(--white);
    }
}

.opa-loc-chip__x {
    font-size: 1.1em;
    line-height: 1;
}

.opa-loc-chips__clear {
    color: var(--charcoal);
    text-decoration: underline;
    font-size: .85rem;
    margin-left: auto;
}

/* Mobile drawer wrapper. */

.opa-loc-filters-drawer[hidden] {}

@media (max-width: 900px) {
    .opa-loc-filters-drawer {
        position: fixed;
        inset: 0;
        z-index: 1000;
        pointer-events: none;
    }

    .opa-loc-filters-drawer[hidden] {
        display: block; /* unhide so we can animate; pointer-events:none keeps it inert */
    }

    .opa-loc-filters-drawer__backdrop {
        position: absolute;
        inset: 0;
        background: rgba(0, 0, 0, .4);
        opacity: 0;
        transition: opacity .2s ease;
    }

    .opa-loc-filters-drawer__panel {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        width: min(90vw, 380px);
        background: #fff;
        box-shadow: -2px 0 12px rgba(0, 0, 0, .12);
        overflow-y: auto;
        transform: translateX(100%);
        transition: transform .25s ease;
        padding: 1rem;
    }

    .opa-loc-filters-drawer.is-open {
        pointer-events: auto;
    }

    .opa-loc-filters-drawer.is-open .opa-loc-filters-drawer__backdrop {
        opacity: 1;
    }

    .opa-loc-filters-drawer.is-open .opa-loc-filters-drawer__panel {
        transform: translateX(0);
    }

    .opa-loc-filters__drawer-header,
    .opa-loc-filters__drawer-footer {
        display: flex !important;
    }
    .opa-loc-filters__drawer-header[hidden],
    .opa-loc-filters__drawer-footer[hidden] {
        display: flex !important;
    }

    .opa-loc-filters__row {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
    }
    .opa-loc-filters__submit {
        display: none;
    }

    .opa-loc-filter__panel {
        position: static;
        box-shadow: none;
        border: 0;
        padding: 0;
        max-width: none;
    }
    .opa-loc-filter__panel[hidden] { display: block; }
    .opa-loc-filter__trigger { display: none; }
    .opa-loc-filter::before {
        content: attr(data-mobile-label);
    }
}

@media (min-width: 901px) {
    .opa-loc-filters__drawer-header,
    .opa-loc-filters__drawer-footer {
        display: none;
    }
    .opa-loc-filters-drawer[hidden] { display: block; }
}

.opa-loc-filters__drawer-header {
    align-items: center;
    justify-content: space-between;
    padding-bottom: .75rem;
    border-bottom: 1px solid var(--opa-loc-card-border);
    margin-bottom: 1rem;
}

.opa-loc-filters__drawer-title {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 700;
}

.opa-loc-filters__drawer-close {
    background: none;
    border: 0;
    font-size: 1.6rem;
    line-height: 1;
    color: var(--charcoal);
    cursor: pointer;
    padding: .25rem .5rem;
}

.opa-loc-filters__drawer-footer {
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 0;
    border-top: 1px solid var(--opa-loc-card-border);
    margin-top: 1rem;
    position: sticky;
    bottom: 0;
    background: #fff;
}

.opa-loc-filters__drawer-clear {
    color: var(--charcoal);
    text-decoration: underline;
    font-size: .9rem;
}

.opa-loc-filters__drawer-apply {
    flex: 1;
    background: var(--moss);
    color: var(--white);
    border: 2px solid var(--moss);
    border-radius: 99px;
    padding: .6rem 1rem;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
}

body.opa-drawer-open {
    overflow: hidden;
}

/* Google Places dropdown. */

.pac-container {
    margin-top: 4px;
    border-radius: 6px;
    border: 1px solid var(--opa-loc-card-border, #e2e6ea);
    box-shadow: 0 6px 18px rgba(0, 0, 0, .12);
    font-family: inherit;
    z-index: 10000; /* above the mobile filter drawer */
}

.pac-item {
    padding: .55rem .9rem;
    font-size: .9rem;
    line-height: 1.3;
    color: var(--charcoal);
    cursor: pointer;
    border-top: 1px solid var(--opa-loc-card-border, #e2e6ea);
}

.pac-item:first-child {
    border-top: 0;
}

.pac-item:hover,
.pac-item-selected {
    background-color: rgba(116, 127, 7, .08); /* moss at 8% */
}

.pac-item-query {
    color: var(--charcoal);
    font-weight: 600;
}

.pac-logo:after {
    padding-top: 4px;
    padding-bottom: 4px;
}

/* Map marker. */

.opa-marker {
    cursor: pointer;
    transform-origin: bottom center;
    transition: transform .2s ease;
}

.opa-marker svg {
    display: block;
}

.opa-marker.is-bouncing {
    animation: opa-marker-bounce .55s ease-in-out 2;
}

@keyframes opa-marker-bounce {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-10px); }
}

/* Map InfoWindow content. */

.opa-loc-iw {
    font-family: inherit;
    color: var(--charcoal);
    min-width: 200px;
    max-width: 280px;
    padding: .25rem .25rem 0;
}

.opa-loc-iw__title {
    margin: 0 0 .35rem;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.25;
    color: var(--charcoal);
}

.opa-loc-iw__address,
.opa-loc-iw__phone {
    margin: 0 0 .35rem;
    font-size: .9rem;
    line-height: 1.4;
    color: var(--charcoal);
}

.opa-loc-iw__phone a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.opa-loc-iw__actions {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    margin-top: .5rem;
}

.opa-loc-iw__btn {
    display: inline-block;
    color: var(--charcoal);
    background: transparent;
    border: 2px solid var(--moss);
    border-radius: 99px;
    padding: .3rem .9rem;
    font-size: .8rem;
    font-weight: 500;
    text-decoration: none;
    line-height: 1.2;
    cursor: pointer;
    transition: background-color .15s ease, color .15s ease;

    &:is(:hover, :focus) {
        background-color: var(--moss);
        color: var(--white);
        text-decoration: none;
    }
}

.opa-loc-iw__btn--ghost {
    border-color: var(--opa-loc-card-border);

    &:is(:hover, :focus) {
        background-color: var(--charcoal);
        border-color: var(--charcoal);
    }
}

@media (prefers-reduced-motion: reduce) {
    .opa-locations-fullbleed *,
    .opa-locations-fullbleed *::before,
    .opa-locations-fullbleed *::after {
        transition-duration: 0s !important;
        animation-duration: 0s !important;
        animation-iteration-count: 1 !important;
    }
    .opa-loc-filters-drawer__panel,
    .opa-loc-filters-drawer__backdrop {
        transition: none !important;
    }
}

body.opa-loc-loading .opa-locations-list,
body.opa-loc-loading .opa-providers-grid,
body.opa-loc-loading .opa-loc-chips,
body.opa-loc-loading .opa-locations-toolbar__count {
    opacity: .5;
    transition: opacity .15s ease;
    pointer-events: none;
}

.opa-loc-filters__field {
    display: block;
    position: relative;

    select,
    input[type="search"] {
        appearance: none;
        -webkit-appearance: none;
        width: 100%;
        border: 1px solid var(--opa-loc-card-border);
        background: #fff;
        border-radius: 4px;
        padding: .75rem 2.25rem .75rem .9rem;
        font-size: 1rem;
        line-height: 1.2;
        color: var(--opa-loc-text);
    }

    select {
        background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path fill='%231f2933' d='M0 0l6 8 6-8z'/></svg>");
        background-repeat: no-repeat;
        background-position: right .9rem center;
        background-size: 10px 7px;
    }

    input[type="search"]::-webkit-search-decoration,
    input[type="search"]::-webkit-search-cancel-button {
        -webkit-appearance: none;
    }
}

.opa-loc-filters__field--address {
    @media (max-width: 900px) {
        grid-column: 1 / -1;
    }
}

.opa-loc-filters__address-clear {
    position: absolute;
    right: .5rem;
    top: 50%;
    transform: translateY(-50%);
    width: 1.5rem;
    height: 1.5rem;
    padding: 0;
    border: 0;
    border-radius: 99px;
    background: transparent;
    color: var(--charcoal);
    font-size: 1.25rem;
    line-height: 1;
    cursor: pointer;
    display: none;
    align-items: center;
    justify-content: center;

    &:hover,
    &:focus-visible {
        background-color: rgba(0, 0, 0, .08);
        outline: none;
    }
}

.opa-loc-filters__field input[type="search"]:not(:placeholder-shown) ~ .opa-loc-filters__address-clear {
    display: flex;
}

.opa-loc-filters__field--address input[type="search"] {
    padding-right: 2.5rem;
}

.opa-loc-filters__autocomplete {
    display: block;
    width: 100%;
    position: relative;
    scroll-margin-top: 12px;
}

.opa-loc-filters__autocomplete gmp-place-autocomplete {
    display: block;
    width: 100%;
    height: 2.65rem; /* match filter trigger buttons */
    min-height: 2.65rem;
    border: 1px solid var(--opa-loc-card-border);
    background: #fff;
    border-radius: 4px;
    box-sizing: border-box;
    font-family: inherit;
    font-size: 1rem;
    color: var(--charcoal);

    --gmpx-color-surface: #fff;
    --gmpx-color-on-surface: var(--charcoal);
    --gmpx-color-on-surface-variant: var(--charcoal);
    --gmpx-color-primary: var(--moss);
    --gmpx-color-outline: transparent;
    --gmpx-font-family-base: inherit;
    --gmpx-font-family-headings: inherit;
}

.opa-loc-filters__autocomplete gmp-place-autocomplete::part(input) {
    height: 100% !important;
    box-sizing: border-box !important;
    border: 0 !important;
    background: transparent !important;
    font-size: 1rem !important;
    line-height: 1.2 !important;
    color: var(--charcoal) !important;
    width: 100% !important;
}

.opa-loc-filters__autocomplete input,
.opa-loc-filters__address-fallback {
    width: 100%;
    border: 0;
    background: transparent;
    border-radius: 4px;
    padding: .6rem 2.5rem .6rem .9rem;
    font-size: 1rem;
    line-height: 1.2;
    color: var(--charcoal);
    font-family: inherit;
    outline: none;
}

.opa-loc-filters__address-fallback {
    border: 1px solid var(--opa-loc-card-border);
    background: #fff;
}

.opa-loc-filters__submit,
.opa-providers-filters__submit,
.opa-locations-toolbar__filters-toggle,
.opa-loc-card__btn,
.opa-provider-card__btn {
    display: inline-block;
    color: var(--charcoal);
    background: transparent;
    text-decoration: none;
    border: 2px solid var(--moss);
    border-radius: 99px;
    padding: .5rem 2rem;
    font-size: .9rem;
    font-weight: 500;
    line-height: 1.2;
    cursor: pointer;
    transition: background-color .15s ease, color .15s ease;

    &:is(:hover, :focus) {
        background-color: var(--moss);
        color: var(--white);
        text-decoration: none;
    }
}

.opa-loc-filters__submit {
    @media (max-width: 900px) {
        grid-column: 1 / -1;
    }
}

/* Toolbar. */

.opa-locations-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: .5rem 0 1rem;
    font-size: .95rem;
}

.opa-locations-toolbar__count {
    color: var(--opa-loc-muted);
    font-weight: 500;
}

.opa-locations-toolbar__filters-toggle {
    @media (min-width: 901px) {
        display: none;
    }
}

/* Two-column layout (finder). */

.opa-locations-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
    gap: 1.5rem;
    align-items: start;

    @media (max-width: 900px) {
        grid-template-columns: 1fr;
    }
}

.opa-locations-list {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.opa-locations-empty {
    padding: 2rem;
    border: 1px dashed var(--opa-loc-card-border);
    border-radius: var(--opa-loc-card-radius);
    color: var(--opa-loc-muted);
    text-align: center;
}

/* Map. */

.opa-locations-map {
    position: sticky;
    top: 1.5rem;
    align-self: start;

    @media (max-width: 900px) {
        position: static;
        order: -1;
    }
}

.opa-locations-map__sticky {
    display: block;
}

.opa-locations-map__canvas {
    width: 100%;
    height: clamp(480px, 75vh, 820px);
    border-radius: var(--opa-loc-card-radius);
    background: #d9d9d9;
    overflow: hidden;

    @media (max-width: 900px) {
        height: clamp(320px, 60vh, 480px);
    }
}

/* Location cards. */

.opa-loc-card {
    background: var(--opa-loc-card-bg);
    border: 1px solid var(--opa-loc-card-border);
    border-left: 4px solid var(--opa-loc-card-border);
    border-radius: var(--opa-loc-card-radius);
    padding: 1.25rem 1.25rem 1rem;
    box-shadow: var(--opa-loc-shadow);
    cursor: pointer;
    transition: box-shadow .15s ease, border-left-color .15s ease;

    &.is-active,
    &:hover {
        box-shadow: 0 2px 6px rgba(0, 0, 0, .08);
    }

    &.is-active {
        border-left-color: var(--moss);
    }

    &:focus-visible {
        outline: 3px solid var(--moss);
        outline-offset: 2px;
    }

    &[hidden] {
        display: none !important;
    }
}

.opa-loc-card__header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: .75rem;
    margin-bottom: .5rem;
}

.opa-loc-card__title {
    font-size: 1.15rem;
    font-weight: 700;
    margin: 0;
    flex: 1;
}

.opa-loc-card__distance {
    background: var(--moss);
    color: var(--white);
    font-size: .78rem;
    font-weight: 600;
    padding: .15rem .55rem;
    border-radius: 99px;
    line-height: 1.3;
    white-space: nowrap;
    flex-shrink: 0;
}

.opa-locations-empty--radius {
    background: var(--warm-grey, #FAF8F3);
    border-style: solid;
    border-color: var(--opa-loc-card-border);
}

.opa-loc-card__meta {
    list-style: none;
    margin: 0 0 .75rem;
    padding: 0;
    color: var(--opa-loc-muted);
    font-size: .92rem;
    line-height: 1.5;
}

.opa-loc-card__meta-item {
    margin: 0 0 .15rem;
    padding-left: 1.5rem;
    position: relative;

    &::before {
        content: "";
        position: absolute;
        left: 0;
        top: .15rem;
        width: 1rem;
        height: 1rem;
        background-color: var(--moss);
        -webkit-mask: var(--opa-icon, none) no-repeat center / contain;
        mask: var(--opa-icon, none) no-repeat center / contain;
    }

    a {
        color: inherit;
        text-decoration: underline;
        text-underline-offset: 2px;
    }
}

.opa-loc-card__meta-item--address::before {
    --opa-icon: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><path d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 1118 0z'/><circle cx='12' cy='10' r='3'/></svg>");
}
.opa-loc-card__meta-item--phone::before {
    --opa-icon: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><path d='M2.25 6.75c0 8.284 6.716 15 15 15h2.25a2.25 2.25 0 002.25-2.25v-1.372c0-.516-.351-.966-.852-1.091l-4.423-1.106c-.44-.11-.902.055-1.173.417l-.97 1.293c-.282.376-.769.542-1.21.38a12.035 12.035 0 01-7.143-7.143c-.162-.441.004-.928.38-1.21l1.293-.97c.363-.271.527-.734.417-1.173L6.963 3.102a1.125 1.125 0 00-1.091-.852H4.5A2.25 2.25 0 002.25 4.5v2.25z'/></svg>");
}
.opa-loc-card__meta-item--hours::before {
    --opa-icon: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><path d='M12 6v6h4.5m4.5 0a9 9 0 11-18 0 9 9 0 0118 0z'/></svg>");
}

.opa-loc-card__services-title {
    font-size: 1rem;
    margin: .75rem 0 .25rem;
    font-weight: 600;
    color: var(--opa-loc-text);
}

.opa-loc-card__services-list {
    list-style: disc inside;
    margin: 0 0 1rem;
    padding: 0;
    columns: 2;
    column-gap: 1.25rem;
    font-size: .92rem;
    color: var(--opa-loc-muted);

    li {
        break-inside: avoid;
        margin: 0 0 .15rem;
        padding-left: .25rem;
    }
}

.opa-loc-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}


/* Full-bleed override. */

.opa-locations-fullbleed {
    overflow-x: clip;

    .opa-location-single,
    .opa-locations-page {
        width: 100vw;
        max-width: 100vw;
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw);
    }

    .inside-article {
        padding: 0;
        border: 0;
        background: transparent;
        box-shadow: none;
    }
}

/* Single-location detail header. */

.opa-location-single__head {
    background: #fff;
}

.opa-location-single__inner {
    max-width: 1280px;
    margin: 0 auto;
    padding: 2rem 1.25rem;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 2rem;
    align-items: start;

    @media (max-width: 900px) {
        grid-template-columns: 1fr;
    }
}

.opa-location-single__title {
    margin: 0 0 .75rem;
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--opa-loc-text);
    line-height: 1.2;
}

.opa-location-single__meta {
    list-style: none;
    margin: 0 0 1.25rem;
    padding: 0;
    color: var(--opa-loc-text);
    font-size: .95rem;
    line-height: 1.45;
}

.opa-location-single__meta-item {
    margin: 0 0 .25rem;
    padding-left: 1.5rem;
    position: relative;

    &::before {
        content: "";
        position: absolute;
        left: 0;
        top: .15rem;
        width: 1rem;
        height: 1rem;
        background-color: var(--moss);
        -webkit-mask: var(--opa-icon, none) no-repeat center / contain;
        mask: var(--opa-icon, none) no-repeat center / contain;
    }

    a {
        color: inherit;
        text-decoration: underline;
        text-underline-offset: 2px;
    }
}

.opa-location-single__meta-item--address::before {
    --opa-icon: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><path d='M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 1118 0z'/><circle cx='12' cy='10' r='3'/></svg>");
}
.opa-location-single__meta-item--phone::before {
    --opa-icon: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><path d='M2.25 6.75c0 8.284 6.716 15 15 15h2.25a2.25 2.25 0 002.25-2.25v-1.372c0-.516-.351-.966-.852-1.091l-4.423-1.106c-.44-.11-.902.055-1.173.417l-.97 1.293c-.282.376-.769.542-1.21.38a12.035 12.035 0 01-7.143-7.143c-.162-.441.004-.928.38-1.21l1.293-.97c.363-.271.527-.734.417-1.173L6.963 3.102a1.125 1.125 0 00-1.091-.852H4.5A2.25 2.25 0 002.25 4.5v2.25z'/></svg>");
}
.opa-location-single__meta-item--hours::before {
    --opa-icon: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'><path d='M12 6v6h4.5m4.5 0a9 9 0 11-18 0 9 9 0 0118 0z'/></svg>");
}

.opa-location-single__list-block {
    margin-bottom: 1.25rem;
}

.opa-location-single__list-title {
    font-size: 1rem;
    font-weight: 700;
    margin: 0 0 .35rem;
    color: var(--opa-loc-text);
}

.opa-location-single__list {
    list-style: disc inside;
    margin: 0;
    padding: 0;
    columns: 2;
    column-gap: 1.5rem;
    font-size: .95rem;
    color: var(--opa-loc-text);

    li {
        break-inside: avoid;
        margin: 0 0 .15rem;
    }

    @media (max-width: 540px) {
        columns: 1;
    }
}

.opa-location-single__actions {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-top: 1rem;
}

.opa-location-single__map-canvas {
    width: 100%;
    height: clamp(320px, 45vh, 460px);
}

/* Providers strip. */

.opa-location-providers {
    background: var(--opa-loc-strip-bg);
    padding: 2rem 0 3rem;
    margin-top: 1rem;
}

.opa-location-providers__inner {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 1.25rem;
}

.opa-location-providers__title {
    text-align: center;
    margin: 0 0 1.5rem;
    font-size: 1.35rem;
    font-weight: 700;
    color: var(--opa-loc-text);
}

.opa-providers-filters {
    margin: 0 0 1.5rem;
}

.opa-providers-filters__field {
    display: block;
    position: relative;

    select {
        appearance: none;
        -webkit-appearance: none;
        width: 100%;
        border: 1px solid var(--opa-loc-card-border);
        background: #fff;
        border-radius: 4px;
        padding: .6rem 2.25rem .6rem .9rem;
        font-size: 1rem;
        line-height: 1.2;
        color: var(--charcoal);
        background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1.5 L6 6 L11 1.5' stroke='%23333333' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>");
        background-repeat: no-repeat;
        background-position: right .9rem center;
        background-size: 12px 8px;
        cursor: pointer;
    }
}


/* Provider cards. */

.opa-providers-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 1rem;

    @media (max-width: 900px) {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    @media (max-width: 540px) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.opa-providers-grid__empty {
    grid-column: 1 / -1;
    text-align: center;
    padding: 0;
    color: var(--opa-loc-muted);
}

.opa-provider-card {
    background: var(--opa-loc-card-bg);
    border: 1px solid var(--opa-loc-card-border);
    border-radius: var(--opa-loc-card-radius);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.opa-provider-card__media {
    position: relative;
    display: block;
    aspect-ratio: 1 / 1;
    background: #d9d9d9;
    overflow: hidden;
    text-decoration: none;
    color: #fff;
}

.opa-provider-card__placeholder,
.opa-provider-card__img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.opa-provider-card__name {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: .4rem .6rem;
    font-size: .85rem;
    font-weight: 600;
    /* Stronger overlay + text-shadow so white text keeps ≥4.5:1
       against arbitrary photo backgrounds (WCAG 1.4.3). */
    background: linear-gradient(to top, rgba(0, 0, 0, .85) 0%, rgba(0, 0, 0, .6) 100%);
    color: #fff;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .55);
    line-height: 1.25;
}

.opa-provider-card__btn {
    display: block;
    text-align: center;
    margin: .5rem;
    padding: .35rem .75rem; /* tighter than the default — card real estate is tight */
    font-size: .85rem;
}