/* Shared directory controls for category archives and Find saunagus. */
.sgg-directory-page { color:#171717; }
.sgg-directory-hero { align-items:flex-end; border-bottom:0; }
.sgg-directory-shortcuts {
    display:flex; align-items:center; gap:8px; flex-wrap:wrap;
    margin:-10px 0 28px; padding:0 0 8px; border-bottom:0;
}
.sgg-directory-shortcut {
    appearance:none; display:inline-flex; align-items:center; justify-content:center; gap:7px;
    min-height:40px; padding:9px 14px; border:1px solid #e3e2dd; border-radius:999px;
    background:#fff; color:#20201e; font-family:inherit; font-size:13px; font-weight:700;
    line-height:1; text-decoration:none; cursor:pointer; transition:.15s ease;
}
.sgg-directory-shortcut:hover,.sgg-directory-shortcut.is-active { border-color:#171717; background:#171717; color:#fff; }
.sgg-directory-shortcut span { min-width:20px; height:20px; display:inline-flex; align-items:center; justify-content:center; padding:0 5px; border-radius:999px; background:#171717; color:#fff; font-size:10px; }
.sgg-directory-shortcut:hover span,.sgg-directory-shortcut.is-active span { background:#fff; color:#171717; }
.sgg-directory-filter-trigger { margin-left:0; }
.sgg-directory-resultbar { margin-bottom:10px; }
.sgg-directory-resultbar h2 { font-size:18px; font-weight:800; letter-spacing:-.02em; }
.sgg-filtered-note { margin:5px 0 0; color:#777772; font-size:12px; }
.sgg-filtered-note a { color:#171717; font-weight:700; }
.sgg-directory-sort-form select {
    min-height:40px; padding:8px 36px 8px 13px; border:1px solid #e3e2dd; border-radius:999px;
    background:#fff; color:#171717; font:700 13px/1 'Figtree',sans-serif; cursor:pointer;
}
.sgg-filter-backdrop { position:fixed; inset:0; z-index:1998; background:rgba(17,17,17,.36); opacity:0; transition:opacity .2s ease; }
.sgg-filter-backdrop.is-open { display:block !important; opacity:1; }
.sgg-filter-drawer {
    position:fixed; inset:0 0 0 auto; z-index:1999; width:min(460px,100vw); height:100dvh;
    background:#fff; border-left:1px solid #deded9; box-shadow:-18px 0 50px rgba(0,0,0,.10);
    transform:translateX(102%); transition:transform .24s ease; visibility:hidden;
}
.sgg-filter-drawer.is-open { transform:translateX(0); visibility:visible; }
.sgg-filter-form { display:grid; grid-template-rows:auto minmax(0,1fr) auto; height:100%; min-height:0; margin:0; overflow:hidden; }
.sgg-filter-drawer-header { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; padding:24px 24px 20px; border-bottom:1px solid #e6e5e0; background:#fff; }
.sgg-filter-eyebrow { display:block; margin-bottom:5px; color:#85857f; font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.sgg-filter-drawer-header h2 { margin:0; color:#171717; font-size:28px; font-weight:800; letter-spacing:-.04em; }
.sgg-filter-close { width:38px; height:38px; display:inline-flex; align-items:center; justify-content:center; border:1px solid #dddcd7; border-radius:50%; background:#fff; color:#171717; }
.sgg-filter-drawer-body { min-height:0; overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; padding:4px 24px 24px; }
.sgg-filter-group { margin:0; padding:22px 0; border:0; border-bottom:1px solid #e6e5e0; }
.sgg-filter-group legend { margin:0 0 4px; color:#171717; font-size:16px; font-weight:800; }
.sgg-filter-group > p { margin:0 0 14px; color:#777772; font-size:12px; line-height:1.45; }
.sgg-filter-options,
.sgg-filter-options-grid {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:8px;
}
.sgg-filter-option { position:relative; flex:0 0 auto; cursor:pointer; margin:0; }
.sgg-filter-option input { position:absolute; opacity:0; pointer-events:none; }
.sgg-filter-option span {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:auto;
    min-height:40px;
    padding:9px 15px;
    border:1px solid #deded9;
    border-radius:999px;
    background:#fff;
    color:#292927;
    font:700 13px/1 'Figtree',sans-serif;
    white-space:nowrap;
    transition:background-color .14s ease,border-color .14s ease,color .14s ease,transform .14s ease;
}
.sgg-filter-option:hover span { border-color:#b9b8b2; background:#f7f7f4; }
.sgg-filter-option input:checked + span { border-color:#171717; background:#171717; color:#fff; }
.sgg-filter-option input:checked + span:hover { background:#171717; color:#fff; }
.sgg-filter-option input:focus-visible + span { outline:3px solid rgba(17,17,17,.12); outline-offset:2px; }
.sgg-filter-drawer-footer { display:grid; grid-template-columns:auto minmax(0,1fr); gap:10px; min-height:0 !important; height:auto !important; margin:0 !important; padding:16px 24px max(16px,env(safe-area-inset-bottom)); border-top:1px solid #e3e2dd; border-radius:0 !important; background:#fff; align-items:center; flex:0 0 auto; }
.sgg-filter-reset,.sgg-filter-apply { height:46px; min-height:46px; max-height:46px; display:flex; align-items:center; justify-content:center; align-self:center; margin:0; border-radius:999px; font:750 13px/1 'Figtree',sans-serif; text-decoration:none; }
.sgg-filter-reset { min-width:100px; padding:0 18px; border:1px solid #deded9; background:#fff; color:#171717; }
.sgg-filter-reset:hover { border-color:#b9b8b2; background:#f7f7f4; color:#171717; }
.sgg-filter-apply { width:100%; padding:0 22px; border:1px solid #171717; background:#171717; color:#fff; }
.sgg-filter-apply:hover { background:#000; border-color:#000; color:#fff; }
body.sgg-filter-open { overflow:hidden; }
@media (max-width:767px){
    .sgg-directory-shortcuts { overflow-x:auto; flex-wrap:nowrap; margin-top:0; padding-bottom:16px; scrollbar-width:none; }
    .sgg-directory-shortcuts::-webkit-scrollbar { display:none; }
    .sgg-directory-shortcut { flex:0 0 auto; }
    .sgg-directory-filter-trigger { margin-left:0; }
    .sgg-filter-drawer-header,.sgg-filter-drawer-body { padding-left:18px; padding-right:18px; }
    .sgg-filter-drawer-footer { padding-left:18px; padding-right:18px; }
}
.sgg-directory-editorial { border-top:1px solid #e8e7e2; }
.sgg-directory-editorial-shell { padding-top:54px; }
.sgg-directory-editorial-content { max-width:900px; margin:0 auto; color:#383834; font-size:17px; line-height:1.75; }
.sgg-directory-editorial-content h2 { margin:42px 0 14px; color:#171717; font-size:clamp(28px,3vw,38px); font-weight:800; letter-spacing:-.035em; }
.sgg-directory-editorial-content h3 { margin:30px 0 10px; color:#171717; font-size:22px; font-weight:800; letter-spacing:-.02em; }
.sgg-directory-editorial-content a { color:#171717; font-weight:700; }


/* Instant directory filtering: keep the user on the current page while the
   canonical server-rendered result set is refreshed. */
.sgg-directory-page.is-loading #sgg-directory-results {
    opacity:.48;
    pointer-events:none;
    transition:opacity .16s ease;
}
.sgg-directory-loading {
    position:fixed;
    z-index:2105;
    left:50%;
    top:max(92px,calc(env(safe-area-inset-top) + 76px));
    transform:translate(-50%,-8px);
    display:flex;
    align-items:center;
    gap:10px;
    max-width:calc(100vw - 32px);
    padding:11px 15px;
    border:1px solid #e5e5e2;
    border-radius:999px;
    background:#fff;
    box-shadow:0 12px 35px rgba(17,17,17,.14);
    color:#171717;
    font:750 13px/1.2 'Figtree',sans-serif;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .16s ease,transform .16s ease,visibility .16s ease;
}
.sgg-directory-loading.is-visible {
    opacity:1;
    visibility:visible;
    transform:translate(-50%,0);
}
.sgg-directory-spinner {
    width:17px;
    height:17px;
    flex:0 0 17px;
    border:2px solid #deded9;
    border-top-color:#171717;
    border-radius:50%;
    animation:sgg-directory-spin .7s linear infinite;
}
.sgg-directory-loading.is-error .sgg-directory-spinner { display:none; }
@keyframes sgg-directory-spin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce) {
    .sgg-directory-spinner { animation-duration:1.4s; }
    .sgg-directory-page.is-loading #sgg-directory-results,
    .sgg-directory-loading { transition:none; }
}

/* Location/category UX: quick actions directly below the page heading and a
   compact, non-intrusive local weather summary. */
.sgg-location-directory-page .fsg-facility-hero-copy { max-width:940px; }
.sgg-directory-shortcuts-hero {
    margin:20px 0 0;
    padding:0;
}
.sgg-city-weather {
    display:grid;
    grid-template-columns:42px minmax(0,1fr) auto;
    align-items:center;
    gap:12px;
    width:min(520px,100%);
    margin-top:14px;
    padding:11px 13px;
    border:1px solid #e5e4df;
    border-radius:14px;
    background:#fff;
    box-shadow:0 8px 24px rgba(17,17,17,.045);
}
.sgg-city-weather[hidden] { display:none !important; }
.sgg-city-weather-icon {
    width:42px;
    height:42px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:12px;
    background:#f5f5f2;
    color:#171717;
    font-size:19px;
    line-height:1;
}
.sgg-city-weather-icon i,
.sgg-city-weather-icon i::before { line-height:1; }
.sgg-city-weather-copy { min-width:0; display:flex; flex-direction:column; gap:2px; }
.sgg-city-weather-copy strong { color:#171717; font-size:13px; font-weight:800; line-height:1.2; }
.sgg-city-weather-copy span { color:#74746f; font-size:12px; line-height:1.35; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sgg-city-weather-temp { color:#171717; font-size:22px; font-weight:800; letter-spacing:-.04em; line-height:1; }
.sgg-mobile-map-toggle { display:none; }

@media (max-width:767.98px) {
    .sgg-directory-page .fsg-facility-shell { padding-bottom:92px; }
    .sgg-directory-page .sgg-directory-hero { padding-bottom:22px; }
    .sgg-directory-page .sgg-directory-shortcuts-hero {
        width:calc(100vw - 36px);
        margin-top:18px;
        padding-bottom:2px;
    }
    .sgg-location-directory-page .sgg-city-weather {
        width:100%;
        margin-top:13px;
        padding:10px 11px;
        border-radius:13px;
    }
    .sgg-location-directory-page .sgg-city-weather-icon { width:40px; height:40px; border-radius:11px; }
    .sgg-location-directory-page .sgg-city-weather-temp { font-size:20px; }

    /* Mobile is list-first. The map is completely removed from the normal
       document flow and cannot be seen until the fixed bottom toggle is used.
       It keeps viewport dimensions while hidden so Leaflet can initialise
       without the zero-size bugs that caused disappearing popups. */
    .sgg-directory-page .fsg-facility-map-column {
        position:fixed !important;
        top:var(--hdr,72px);
        right:0;
        bottom:0;
        left:0;
        z-index:-1;
        width:100vw;
        height:auto;
        min-height:0;
        max-height:none;
        margin:0;
        overflow:hidden;
        background:#fff;
        opacity:0;
        visibility:hidden;
        pointer-events:none;
    }
    .sgg-directory-page #map {
        width:100%;
        height:100%;
        border:0;
        border-radius:0;
    }
    .sgg-directory-page .fsg-map-fullscreen-control { display:none !important; }

    /* App-style list/map switch. Phone-only and fixed to the bottom safe area. */
    .sgg-mobile-map-toggle {
        position:fixed;
        left:50%;
        bottom:calc(14px + env(safe-area-inset-bottom));
        z-index:1910;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        gap:8px;
        min-width:122px;
        height:48px;
        padding:0 18px;
        border:1px solid #171717;
        border-radius:999px;
        background:#171717;
        color:#fff;
        box-shadow:0 10px 28px rgba(17,17,17,.24);
        font:800 13px/1 'Figtree',sans-serif;
        transform:translateX(-50%);
        -webkit-tap-highlight-color:transparent;
    }
    .sgg-mobile-map-toggle i,
    .sgg-mobile-map-toggle i::before { line-height:1; }
    .sgg-mobile-map-toggle:focus-visible { outline:3px solid rgba(17,17,17,.2); outline-offset:3px; }

    body.sgg-mobile-map-open { overflow:hidden; }
    body.sgg-mobile-map-open .sgg-directory-page .fsg-facility-map-column {
        z-index:1900;
        opacity:1;
        visibility:visible;
        pointer-events:auto;
    }
}

@media (max-width:359.98px) {
    .sgg-city-weather { grid-template-columns:38px minmax(0,1fr) auto; gap:9px; }
    .sgg-location-directory-page .sgg-city-weather-icon { width:38px; height:38px; }
    .sgg-city-weather-copy span { max-width:190px; }
}


/* Directory map UI: override MarkerCluster.Default.css reliably even though the
   vendor stylesheet is loaded later. */
.sgg-directory-page .leaflet-marker-icon.marker-cluster,
.sgg-directory-page .leaflet-marker-icon.marker-cluster-small,
.sgg-directory-page .leaflet-marker-icon.marker-cluster-medium,
.sgg-directory-page .leaflet-marker-icon.marker-cluster-large {
    width:40px !important;
    height:40px !important;
    margin-left:-20px !important;
    margin-top:-20px !important;
    border:0 !important;
    border-radius:999px !important;
    background:transparent !important;
}
.sgg-directory-page .leaflet-marker-icon.marker-cluster > div,
.sgg-directory-page .leaflet-marker-icon.marker-cluster-small > div,
.sgg-directory-page .leaflet-marker-icon.marker-cluster-medium > div,
.sgg-directory-page .leaflet-marker-icon.marker-cluster-large > div {
    width:40px !important;
    height:40px !important;
    margin:0 !important;
    padding:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    border:1px solid rgba(17,17,17,.14) !important;
    border-radius:999px !important;
    background:#fff !important;
    color:#171717 !important;
    box-shadow:0 8px 22px rgba(17,17,17,.18) !important;
    font:800 12px/1 'Figtree',sans-serif !important;
    text-align:center !important;
}
.sgg-directory-page .leaflet-marker-icon.marker-cluster:hover > div {
    border-color:#171717 !important;
    background:#171717 !important;
    color:#fff !important;
}
.sgg-directory-page .sgg-popup,
.sgg-directory-page .sgg-popup .leaflet-popup-content-wrapper,
.sgg-directory-page .sgg-popup .leaflet-popup-content {
    pointer-events:auto;
}