/* ==========================================================
   ACF Map Filter  v4.0.0  —  acfmf.css
   ========================================================== */

/* ── Scope reset ─────────────────────────────────────────── */
.acfmf-wrap *,
.acfmf-results-wrap * {
    box-sizing: border-box;
}

/* Kill Tinysalt theme highlight/link styles bleeding in */
.entry-content .acfmf-wrap a,
.entry-content .acfmf-wrap a:hover,
.entry-content .acfmf-results-wrap a,
.entry-content .acfmf-results-wrap a:hover {
    background:      none !important;
    box-shadow:      none !important;
    text-shadow:     none !important;
    border:          none !important;
    text-decoration: none !important;
}
.entry-content .acfmf-wrap mark,
.entry-content .acfmf-wrap .highlight,
.entry-content .acfmf-results-wrap mark,
.entry-content .acfmf-results-wrap .highlight {
    background: none !important;
    color: inherit !important;
}

/* ── Filter bar ──────────────────────────────────────────── */
.acfmf-filter-bar {
    display:        flex;
    flex-wrap:      wrap;
    justify-content: center;
    gap:            8px;
    padding:        14px 18px;
    background:     #fff;
    border:         1px solid #e2e8f0;
    border-radius:  12px;
    box-shadow:     0 2px 10px rgba(0,0,0,.06);
    margin-bottom:  4px;
    font-family:    -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.acfmf-status {
    font-size:   12px;
    color:       #94a3b8;
    margin:      4px 0 12px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* ── Buttons ─────────────────────────────────────────────── */
.acfmf-btn {
    display:      inline-flex;
    align-items:  center;
    gap:          6px;
    padding:      8px 16px;
    border-radius:50px;
    border:       2px solid #e2e8f0;
    background:   #f8fafc;
    color:        #475569;
    font-size:    13px;
    font-weight:  600;
    cursor:       pointer;
    line-height:  1;
    transition:   border-color .15s, background .15s, color .15s, transform .1s;
    white-space:  nowrap;
    font-family:  inherit;
}
.acfmf-btn:hover {
    border-color: var(--cc, #334155);
    color:        var(--cc, #334155);
    background:   #fff;
    transform:    translateY(-1px);
    box-shadow:   0 3px 10px rgba(0,0,0,.09);
}
.acfmf-btn.is-active {
    background:   var(--cc, #334155);
    border-color: var(--cc, #334155);
    color:        #fff;
    box-shadow:   0 3px 12px rgba(0,0,0,.16);
}
.acfmf-btn.is-active:hover {
    transform:    translateY(-1px);
    box-shadow:   0 5px 16px rgba(0,0,0,.2);
}

.acfmf-badge {
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    min-width:       20px;
    height:          18px;
    padding:         0 5px;
    border-radius:   20px;
    font-size:       10px;
    font-weight:     700;
    background:      rgba(0,0,0,.1);
    color:           inherit;
    line-height:     1;
}
.acfmf-btn.is-active .acfmf-badge {
    background: rgba(255,255,255,.28);
}

/* ── Results panel ───────────────────────────────────────── */
.acfmf-results-wrap {
    margin-top:  20px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size:   14px;
    color:       #1e293b;
}

.acfmf-results-header {
    display:        flex;
    align-items:    baseline;
    gap:            10px;
    margin-bottom:  10px;
    padding-bottom: 8px;
    border-bottom:  2px solid #f1f5f9;
}
.acfmf-results-title {
    font-size:   15px;
    font-weight: 700;
    color:       #1e293b;
}
.acfmf-results-count {
    font-size:   12px;
    color:       #94a3b8;
    font-weight: 500;
}

/* ── List ────────────────────────────────────────────────── */
.acfmf-list {
    list-style:     none;
    margin:         0;
    padding:        0;
    display:        flex;
    flex-direction: column;
    gap:            1px;
    background:     #f1f5f9;
    border:         1px solid #e2e8f0;
    border-radius:  10px;
    overflow:       hidden;
}

.acfmf-list-msg {
    padding:    22px 20px;
    text-align: center;
    color:      #94a3b8;
    font-size:  13px;
    background: #fff;
}

.acfmf-list-item {
    display:    flex;
    align-items:center;
    gap:        12px;
    padding:    12px 14px;
    background: #fff;
    transition: background .1s;
}
.acfmf-list-item:hover { background: #f8fafc; }

.acfmf-list-num {
    flex:        0 0 24px;
    font-size:   11px;
    font-weight: 700;
    color:       #cbd5e1;
    text-align:  right;
}

.acfmf-list-body {
    flex:           1 1 auto;
    min-width:      0;
    display:        flex;
    flex-direction: column;
    gap:            3px;
}

.acfmf-list-badge {
    display:        inline-flex;
    align-items:    center;
    gap:            3px;
    padding:        2px 8px;
    border-radius:  20px;
    font-size:      10px;
    font-weight:    700;
    text-transform: uppercase;
    letter-spacing: .05em;
    color:          #fff;
    align-self:     flex-start;
    /* Override any theme background rule */
    background:     revert !important;
}
/* Restore inline background (theme !important wars) */
.acfmf-list-badge[style*="background"] {
    background: attr(style background, #555) !important;
}

.acfmf-list-title {
    font-size:     14px;
    font-weight:   700;
    color:         #1e293b !important;
    text-decoration: none !important;
    line-height:   1.3;
    white-space:   nowrap;
    overflow:      hidden;
    text-overflow: ellipsis;
    display:       block;
    background:    none !important;
}
.acfmf-list-title:hover {
    color:           #2563eb !important;
    text-decoration: underline !important;
}

.acfmf-list-loc {
    font-size: 12px;
    color:     #64748b;
}

.acfmf-list-pin {
    flex:            0 0 auto;
    width:           34px;
    height:          34px;
    border-radius:   8px;
    border:          1px solid #e2e8f0;
    background:      #f8fafc;
    font-size:       15px;
    cursor:          pointer;
    display:         flex;
    align-items:     center;
    justify-content: center;
    transition:      background .1s, border-color .1s, transform .1s;
    line-height:     1;
}
.acfmf-list-pin:hover {
    background:   #e0f2fe;
    border-color: #38bdf8;
    transform:    scale(1.08);
}

/* ── Pagination ──────────────────────────────────────────── */
.acfmf-pagination {
    display:         flex;
    align-items:     center;
    justify-content: space-between;
    gap:             12px;
    margin-top:      12px;
    padding:         8px 12px;
    background:      #f8fafc;
    border:          1px solid #e2e8f0;
    border-radius:   8px;
    font-family:     inherit;
}
.acfmf-page-btn {
    padding:      7px 16px;
    border-radius:6px;
    border:       1px solid #e2e8f0;
    background:   #fff;
    font-size:    13px;
    font-weight:  600;
    color:        #334155;
    cursor:       pointer;
    transition:   background .1s, color .1s;
    font-family:  inherit;
}
.acfmf-page-btn:hover:not(:disabled) {
    background: #334155;
    color:      #fff;
}
.acfmf-page-btn:disabled { opacity:.4; cursor:not-allowed; }
.acfmf-page-info { font-size:13px; color:#64748b; font-weight:500; }

/* ── Kim's Picks button — visual separator from cat buttons ── */
.acfmf-btn-picks {
    margin-left:  8px;
    padding-left: 14px;
    border-left:  2px solid #e2e8f0;
}
@media (max-width: 640px) {
    .acfmf-btn-picks { margin-left: 0; border-left: none; border-top: 2px solid #e2e8f0; padding-top: 8px; }
}

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 640px) {
    .acfmf-filter-bar  { padding: 10px 12px; }
    .acfmf-btn         { padding: 7px 12px; font-size: 12px; }
    .acfmf-list-item   { padding: 10px 12px; gap: 8px; }
    .acfmf-list-num    { display: none; }
    .acfmf-list-title  { white-space: normal; }
    .acfmf-pagination  { flex-wrap: wrap; justify-content: center; }
}

/* ── Google Maps infowindow — mobile ────────────────────── */
@media (max-width: 768px) {

    /* Override Gold's CSS variables so everything inside scales */
    .fc-infobox-root {
        --fc-infobox-max-width:        90vw !important;
        --fc-infobox-font-size:        clamp(11px, 3vw, 14px) !important;
        --fc-infobox-title-font-size:  clamp(13px, 3.8vw, 18px) !important;
        --fc-infobox-line-height:      1.4em !important;
        --fc-infobox-padding-x:        12px !important;
        --fc-infobox-padding-y:        12px !important;
    }

    /* Force the Google Maps wrapper to match */
    .gm-style-iw.gm-style-iw-c {
        max-width: 90vw !important;
        width:     90vw !important;
    }
    .gm-style-iw-d {
        max-width:  90vw !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        max-height: 60vh !important;
    }
}

/* ── Layout-14: img above title on screens smaller than 429px ── */
@media (max-width: 429px) {

    /* Stack children vertically instead of side-by-side */
    .fc-infobox-layout-14 .fc-infobox-inner {
        display:        flex !important;
        flex-direction: column !important;
        align-items:    flex-start !important;
    }

    /* Image: 50% wide, first in flow */
    .fc-infobox-layout-14 .fc-infobox-img {
        display: block !important;
        order:   1 !important;
        width:   50% !important;
        height:  auto !important;
    }

    /* Title: sits directly below the image */
    .fc-infobox-layout-14 .fc-infobox-title {
        order: 2 !important;
        width: 100% !important;
    }

    /* Content: below the title */
    .fc-infobox-layout-14 .fc-infobox-content {
        order: 3 !important;
        width: 100% !important;
    }
}

/* ── Infowindow close button — absolute top-right on all screens ── */
.gm-style .gm-style-iw-chr {
    position: absolute !important;
    top:      0 !important;
    right:    0 !important;
    height:   auto !important;
    width:    auto !important;
}
/* Grey close button */
.gm-style .gm-style-iw-chr button,
.gm-style .gm-style-iw-chr button span,
.gm-style .gm-style-iw-chr button img {
    color:   #666666 !important;
    opacity: 1 !important;
    filter:  none !important;
}
.gm-style .gm-style-iw-ch {
    padding-top: 0 !important;
}