/* ============================================================
   MFV List View Toggle — mfv-list-view.css

   Card DOM after list-mode JS restructure:
     .lf-item-container [flex row]
       .lf-item              ← 200px image column
         a (abs fills column)
           .lf-background    ← cover image
         .lf-head            ← price badge at bottom of image
       .mfv-right-col        ← flex:1 right column
         a.mfv-card-link     ← title area (flex:1)
           .mfv-card-top     ← flex row: logo? + text block
             .mfv-logo       ← optional 44px avatar
             .mfv-card-text  ← flex col: title + tagline + meta
               .mfv-title
               .mfv-tagline  ← alternate template only
               ul.mfv-meta
         .mfv-footer-bar     ← fixed-height footer strip
           .c27-footer-section ×N  (details + actions)
   ============================================================ */

/* ── .fl-head: make flex so toggle sits alongside results count ── */
.fl-head {
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    padding: 4px 0 !important;
}

/* ── Toggle button bar ────────────────────────────────────── */
/* Normal state: lives inside .fl-head */
.mfv-view-toggle {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    margin-left: auto;  /* push to right edge */
    flex-shrink: 0;
}

/* Floating state: teleported into #finderMap when map is expanded.
   position:absolute so it anchors to the map panel, not the viewport,
   and never overlaps the site header or "Add Listing" button.        */
.mfv-view-toggle--floating {
    position: absolute !important;
    top: 10px !important;
    left: 10px !important;
    right: auto !important;
    z-index: 999 !important;
    margin-left: 0 !important;
    background: #fff !important;
    border-radius: 6px !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.18) !important;
    padding: 4px 6px !important;
    gap: 4px !important;
}

.mfv-view-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 26px;
    border: 1px solid #ddd;
    border-radius: 4px;
    background: #fff;
    color: #999;
    cursor: pointer;
    padding: 0;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.mfv-view-btn:hover {
    background: #f5f5f5;
    color: #555;
    border-color: #bbb;
}

.mfv-view-btn.active {
    background: var(--mfl-primary, #0e7490);
    color: #fff;
    border-color: var(--mfl-primary, #0e7490);
}

.mfv-view-btn svg { display: block; flex-shrink: 0; }

/* ── Cancel isotope sizing ───────────────────────────────── */
.finder-listings .results-view.mfv-view-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    height: auto !important;
}

.finder-listings .results-view.mfv-view-list [class*="col-md-"],
.finder-listings .results-view.mfv-view-list [class*="col-sm-"],
.finder-listings .results-view.mfv-view-list .grid-item {
    width: 100% !important;
    position: static !important;
    left: auto !important; top: auto !important;
    transform: none !important;
    padding: 0 !important;
    float: none !important;
}

/* ── Card shell ──────────────────────────────────────────── */
.finder-listings .results-view.mfv-view-list .lf-item-container {
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
    width: 100% !important;
    min-height: 140px !important;
    max-height: 140px !important;  /* uniform row height */
    border-radius: 8px !important;
    overflow: hidden !important;
    background: #fff !important;
    box-shadow: 0 1px 5px rgba(0,0,0,.09) !important;
    margin-bottom: 0 !important;
    position: relative !important;
    transform: none !important;
    transition: box-shadow 0.2s, transform 0.15s !important;
}

.finder-listings .results-view.mfv-view-list .lf-item-container:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,.13) !important;
    transform: translateY(-2px) !important;
}

/* ── Image column ────────────────────────────────────────── */
.finder-listings .results-view.mfv-view-list .lf-item {
    flex: 0 0 200px !important;
    width: 200px !important;
    min-width: 200px !important;
    height: auto !important;
    position: relative !important;
    overflow: hidden !important;
    background: #d8d8d8 !important;
    display: block !important;
}

.finder-listings .results-view.mfv-view-list .lf-item > a {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important; height: 100% !important;
    z-index: 2 !important;
}

.finder-listings .results-view.mfv-view-list .lf-item .lf-background {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important; height: 100% !important;
    background-size: cover !important;
    background-position: center !important;
}

.finder-listings .results-view.mfv-view-list .lf-item .overlay { display: none !important; }

/* Hide the original info block — content is rebuilt in .mfv-right-col */
.finder-listings .results-view.mfv-view-list .lf-item .lf-item-info,
.finder-listings .results-view.mfv-view-list .lf-item .lf-item-info-2 {
    display: none !important;
}

/* Hide image overlay strip entirely — price/category/status shown in right col */
.finder-listings .results-view.mfv-view-list .lf-item .lf-head {
    display: none !important;
}

/* ── (was) Price / featured badge at bottom of image — now hidden ─ */
.finder-listings .results-view.mfv-view-list .lf-item .lf-head-DISABLED {
    position: absolute !important;
    bottom: 0 !important; left: 0 !important; right: 0 !important; top: auto !important;
    z-index: 3 !important;
    background: rgba(0,0,0,.50) !important;
    padding: 4px 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
}

.finder-listings .results-view.mfv-view-list .lf-item .lf-head-btn {
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    background: none !important;
    border: none !important;
    padding: 0 !important; margin: 0 !important;
    position: static !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    max-width: 160px !important;
}

.finder-listings .results-view.mfv-view-list .lf-item .pc-slider,
.finder-listings .results-view.mfv-view-list .lf-item .gallery-nav { display: none !important; }

/* ── Right column ────────────────────────────────────────── */
.finder-listings .results-view.mfv-view-list .mfv-right-col {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
    background: #fff !important;
}

/* Title area link */
.finder-listings .results-view.mfv-view-list .mfv-card-link {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    padding: 10px 16px 10px !important;
    text-decoration: none !important;
    color: inherit !important;
    min-width: 0 !important;
    overflow: hidden !important;
}

.finder-listings .results-view.mfv-view-list .mfv-card-link:hover { background: #fafafa !important; }

/* Logo + text side by side */
.finder-listings .results-view.mfv-view-list .mfv-card-top {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 10px !important;
    min-width: 0 !important;
}

/* Logo circle */
.finder-listings .results-view.mfv-view-list .mfv-logo {
    flex-shrink: 0 !important;
    width: 38px !important;
    height: 38px !important;
    border-radius: 50% !important;
    background-size: cover !important;
    background-position: center !important;
    background-color: #eee !important;
    border: 2px solid #f0f0f0 !important;
}

/* Text block */
.finder-listings .results-view.mfv-view-list .mfv-card-text {
    flex: 1 !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 3px !important;
}

/* Title */
.finder-listings .results-view.mfv-view-list .mfv-title {
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    color: #242429 !important;
    margin: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* Tagline (alternate template: h6) */
.finder-listings .results-view.mfv-view-list .mfv-tagline {
    font-size: 12px !important;
    color: #888 !important;
    margin: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    font-style: italic !important;
}

/* Meta list (location, phone etc.) — single row in compact card */
.finder-listings .results-view.mfv-view-list .mfv-meta {
    display: flex !important;
    flex-wrap: nowrap !important;      /* single row */
    gap: 0 12px !important;
    list-style: none !important;
    padding: 0 !important; margin: 3px 0 0 !important;
    font-size: 12px !important;
    color: #666 !important;
    overflow: hidden !important;
}

.finder-listings .results-view.mfv-view-list .mfv-meta li {
    display: inline-flex !important;
    align-items: center !important;
    gap: 3px !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
}

.finder-listings .results-view.mfv-view-list .mfv-meta li i {
    font-size: 13px !important;
    flex-shrink: 0 !important;
    display: inline !important;
    color: var(--mfl-primary, #0e7490) !important;
}

/* ── Footer bar ──────────────────────────────────────────── */
.finder-listings .results-view.mfv-view-list .mfv-footer-bar {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    flex-wrap: nowrap !important;        /* single row — no vertical stacking */
    gap: 0 !important;
    background: #f7f7f7 !important;
    border-top: 1px solid #ececec !important;
    padding: 0 16px !important;
    height: 40px !important;            /* fixed footer height */
    flex-shrink: 0 !important;
    overflow: hidden !important;
    min-width: 0 !important;
}

/* Each footer section is inline, single row */
.finder-listings .results-view.mfv-view-list .mfv-footer-bar .c27-footer-section {
    position: static !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    height: 100% !important;
    overflow: hidden !important;
    flex-shrink: 1 !important;
    min-width: 0 !important;
}

/* Details section (price / status / date / open) */
.finder-listings .results-view.mfv-view-list .mfv-footer-bar .listing-details-3 {
    flex: 1 !important;
    min-width: 0 !important;
    overflow: hidden !important;
}

.finder-listings .results-view.mfv-view-list .mfv-footer-bar .details-list {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;       /* single row */
    align-items: center !important;
    gap: 0 12px !important;
    list-style: none !important;
    padding: 0 !important; margin: 0 !important;
    position: static !important;
    width: auto !important; float: none !important;
    overflow: hidden !important;
}

.finder-listings .results-view.mfv-view-list .mfv-footer-bar .details-list li {
    display: inline-flex !important;
    flex-direction: row !important;    /* icon + text always on same line */
    align-items: center !important;
    gap: 4px !important;
    font-size: 12px !important;
    color: #555 !important;
    width: auto !important;            /* override parent width:25% grid */
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;             /* override parent padding:10px */
    position: static !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
    flex-wrap: nowrap !important;
    line-height: 1.2 !important;
}

/* Icon: kill parent theme width:100% + margin-bottom:5px that stack it above text */
.finder-listings .results-view.mfv-view-list .mfv-footer-bar .details-list li > i,
.finder-listings .results-view.mfv-view-list .mfv-footer-bar .details-list li i {
    flex-shrink: 0 !important;
    font-size: 14px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;            /* override parent width:100% */
    min-width: 0 !important;
    height: auto !important;
    margin: 0 !important;              /* override parent margin-bottom:5px */
    padding: 0 !important;
    line-height: 1 !important;
    text-align: left !important;
    background: transparent !important;
    border: none !important;
    color: var(--mfl-primary, #0e7490) !important;
}

/* Text span: kill parent width:100% + text-align:center that push it under icon */
.finder-listings .results-view.mfv-view-list .mfv-footer-bar .details-list li > span,
.finder-listings .results-view.mfv-view-list .mfv-footer-bar .details-list li span {
    display: inline !important;
    width: auto !important;            /* override parent width:100% */
    max-width: 220px !important;
    text-align: left !important;       /* override parent text-align:center */
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.2 !important;
    vertical-align: middle !important;
}

/* Category list section */
.finder-listings .results-view.mfv-view-list .mfv-footer-bar .listing-details:not(.actions):not(.listing-details-3) {
    flex: 0 0 auto !important;         /* don't grow — category takes only what it needs */
    min-width: 0 !important;
    overflow: hidden !important;
    margin-right: 12px !important;
}

.finder-listings .results-view.mfv-view-list .mfv-footer-bar .c27-listing-preview-category-list {
    display: inline-flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;      /* single row — no wrapping */
    gap: 4px !important;
    list-style: none !important;
    padding: 0 !important; margin: 0 !important;
    font-size: 12px !important;
    overflow: hidden !important;
}

.finder-listings .results-view.mfv-view-list .mfv-footer-bar .c27-listing-preview-category-list li {
    display: inline-flex !important;
    align-items: center !important;
    flex-shrink: 0 !important;
}

.finder-listings .results-view.mfv-view-list .mfv-footer-bar .c27-listing-preview-category-list a {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    text-decoration: none !important;
}

.finder-listings .results-view.mfv-view-list .mfv-footer-bar .category-name {
    font-size: 12px !important;
    color: #555 !important;
    white-space: nowrap !important;
}

.finder-listings .results-view.mfv-view-list .mfv-footer-bar .cat-icon {
    width: 20px !important; height: 20px !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}

.finder-listings .results-view.mfv-view-list .mfv-footer-bar .cat-icon i {
    font-size: 12px !important;
    display: inline !important;
}

/* +N more categories badge */
.finder-listings .results-view.mfv-view-list .mfv-footer-bar .cat-more {
    background: #e5e7eb !important;
    color: #555 !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    padding: 0 5px !important;
    border-radius: 10px !important;
    width: auto !important;
}

/* Star ratings */
.finder-listings .results-view.mfv-view-list .mfv-footer-bar .listing-rating {
    display: inline-flex !important;
    align-items: center !important;
    flex-shrink: 0 !important;
}

/* Actions (bookmark / compare / quickview) — right edge */
.finder-listings .results-view.mfv-view-list .mfv-footer-bar .listing-details.actions {
    flex-shrink: 0 !important;
    margin-left: auto !important;
    padding-left: 12px !important;
}

.finder-listings .results-view.mfv-view-list .mfv-footer-bar .ld-info {
    position: static !important;
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    width: auto !important;
}

.finder-listings .results-view.mfv-view-list .mfv-footer-bar .ld-info ul {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    list-style: none !important;
    padding: 0 !important; margin: 0 !important;
}

/* Hide original footer sections (moved to .mfv-footer-bar by JS) */
.finder-listings .results-view.mfv-view-list .lf-item-container > .c27-footer-section {
    display: none !important;
}

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 640px) {
    .finder-listings .results-view.mfv-view-list .lf-item-container {
        flex-direction: column !important;
        min-height: auto !important;
        max-height: none !important;   /* stacked on mobile — no height cap */
    }

    .finder-listings .results-view.mfv-view-list .lf-item {
        flex: 0 0 150px !important;
        width: 100% !important; min-width: 100% !important;
        height: 150px !important;
    }

    .finder-listings .results-view.mfv-view-list .mfv-footer-bar {
        height: auto !important;
        flex-wrap: wrap !important;
        padding: 6px 12px !important;
    }
}