/* EstiCRM - Mapa Leaflet + style markerów + split layout (cards + map). */

body .esticrm-browser__results--with-map { width: 100% !important; max-width: none !important; }

body .esticrm-browser__split {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(380px, 38%) !important;
    gap: 24px !important;
    align-items: start !important;
}

body .esticrm-browser__cards-col { min-width: 0 !important; }

body .esticrm-browser__map-col {
    min-width: 0 !important;
    position: sticky !important;
    top: var(--esticrm-sticky-top, 80px) !important;
    align-self: start !important;
    /* v11.3.17 — wysokość uwzględnia sticky-top + 20px powietrza na dole */
    height: calc(100vh - (var(--esticrm-sticky-top, 80px) + 20px)) !important;
}
/* v12.3 — mapa w split layout (wyszukiwarka z mapą) wypełnia całą wysokość kolumny */
body .esticrm-browser__map-col .esticrm-map-wrap {
    height: 100% !important;
}
body .esticrm-browser__map-col .esticrm-map {
    height: 100% !important;
}

body .esticrm-map-wrap {
    position: relative !important;
    width: 100% !important;
    border-radius: var(--esticrm-radius-card) !important;
    overflow: hidden !important;
    background: #e8e4de !important;
}

body .esticrm-map-wrap.is-sticky { position: sticky !important; top: var(--esticrm-sticky-top, 80px) !important; }

body .esticrm-map {
    width: 100% !important;
    height: var(--esticrm-map-height, 600px) !important;
    background: #e8e4de !important;
}

/* Leaflet popup customization */
body .leaflet-popup-content-wrapper {
    border-radius: var(--esticrm-radius-card) !important;
    padding: 0 !important;
    overflow: hidden !important;
    box-shadow: 0 8px 28px rgba(0, 0, 0, .18) !important;
}
body .leaflet-popup-content {
    margin: 0 !important;
    width: auto !important;
    font-family: var(--esticrm-font-sans) !important;
}
/* v12.5 — popup-content width respektuje popup-multi/popup-card */
body .leaflet-popup-content:has(.esticrm-popup-multi) {
    width: 300px !important;
    max-width: calc(100vw - 40px) !important;
}
body .leaflet-popup-content:has(.esticrm-popup-multi:has(.esticrm-popup-card--images)) {
    width: 320px !important;
}
body .leaflet-popup-tip { background: #fff !important; }

body .esticrm-popup-card { display: block !important; color: var(--esticrm-text) !important; text-decoration: none !important; }
body .esticrm-popup-card__image {
    width: 100% !important; height: 140px !important; object-fit: cover !important;
    display: block !important; background: #e8e4de !important;
}
body .esticrm-popup-card__body { padding: 12px 14px 14px !important; }
body .esticrm-popup-card__badge {
    display: inline-block !important;
    padding: 3px 9px !important;
    border-radius: 12px !important;
    background: var(--esticrm-accent) !important;
    color: #fff !important;
    font-size: 9px !important;
    font-weight: 500 !important;
    letter-spacing: 1.2px !important;
    text-transform: uppercase !important;
    margin: 0 0 6px !important;
}
body .esticrm-popup-card__badge--wynajem { background: #5a3520 !important; color: #f5e8d8 !important; }
body .esticrm-popup-card__badge--sprzedaz { background: #1a2a3a !important; color: #c8dff5 !important; }
body .esticrm-popup-card__title {
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    color: var(--esticrm-text) !important;
    margin: 0 0 4px !important;
}
body .esticrm-popup-card__location {
    font-size: 11px !important;
    color: var(--esticrm-muted) !important;
    margin: 0 0 6px !important;
}
body .esticrm-popup-card__meta {
    display: flex !important;
    gap: 10px !important;
    font-size: 11px !important;
    color: var(--esticrm-muted) !important;
    margin: 0 0 6px !important;
}
body .esticrm-popup-card__price {
    font-weight: 600 !important;
    color: var(--esticrm-accent) !important;
    font-size: 13px !important;
}

/* MARKERS */
/* v12 FIX — usuń defaultowe tło Leaflet (.leaflet-div-icon { background:#fff; border:1px solid #666 })
   ALE wybiórczo. Pin-* mają SVG background-image i nie chcą koła pod spodem.
   Inne warianty (--multi/--grouped/--circle-*/etc.) mają WŁASNE background-color/border — nie tykamy. */
.leaflet-marker-icon.esticrm-marker--pin-default,
.leaflet-marker-icon.esticrm-marker--pin-gold {
    background-color: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}
/* v12.1 — markery zmniejszają się przy zoom in, żeby nakładające się markery były rozróżnialne.
   Skala przez width/height + font-size (nie transform, bo to przesuwa anchor Leafleta). */
.esticrm-map--zoom-mid .esticrm-marker--multi,
.esticrm-map--zoom-mid .esticrm-marker--grouped {
    min-width: 34px !important;
    min-height: 34px !important;
    width: 34px !important;
    height: 34px !important;
    font-size: 12px !important;
}
.esticrm-map--zoom-high .esticrm-marker--multi,
.esticrm-map--zoom-high .esticrm-marker--grouped {
    min-width: 38px !important;
    min-height: 38px !important;
    width: 38px !important;
    height: 38px !important;
    font-size: 12px !important;
    border-width: 2px !important;
}
.esticrm-map--zoom-mid .esticrm-marker--pin-default,
.esticrm-map--zoom-mid .esticrm-marker--pin-gold {
    width: 22px !important;
    height: 28px !important;
}
.esticrm-map--zoom-high .esticrm-marker--pin-default,
.esticrm-map--zoom-high .esticrm-marker--pin-gold {
    width: 18px !important;
    height: 24px !important;
}

/* Pozostałe warianty: zdejmij tylko default Leaflet border (zostaw własne background) */
.leaflet-marker-icon.esticrm-marker--multi,
.leaflet-marker-icon.esticrm-marker--grouped,
.leaflet-marker-icon.esticrm-marker--circle-dot,
.leaflet-marker-icon.esticrm-marker--circle-image,
.leaflet-marker-icon.esticrm-marker--square-tag,
.leaflet-marker-icon.esticrm-marker--letter,
.leaflet-marker-icon.esticrm-marker--house,
.leaflet-marker-icon.esticrm-marker--dollar,
.leaflet-marker-icon.esticrm-marker--numbered,
.leaflet-marker-icon.esticrm-marker--flag,
.leaflet-marker-icon.esticrm-marker--heart,
.leaflet-marker-icon.esticrm-marker--custom-svg,
.leaflet-marker-icon.esticrm-marker--pin-price-tag {
    border: 1px solid transparent !important;
}
.esticrm-marker--pin-default {
    width: 28px !important; height: 36px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='36' viewBox='0 0 28 36'%3E%3Cpath d='M14 0C6.27 0 0 6.27 0 14c0 9.5 14 22 14 22s14-12.5 14-22C28 6.27 21.73 0 14 0z' fill='%23111010'/%3E%3Ccircle cx='14' cy='13' r='5' fill='%23fff'/%3E%3C/svg%3E") !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}
.esticrm-marker--pin-gold {
    width: 28px !important; height: 36px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='36' viewBox='0 0 28 36'%3E%3Cpath d='M14 0C6.27 0 0 6.27 0 14c0 9.5 14 22 14 22s14-12.5 14-22C28 6.27 21.73 0 14 0z' fill='%23D6B068'/%3E%3Ccircle cx='14' cy='13' r='5' fill='%23fff'/%3E%3C/svg%3E") !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}
.esticrm-marker--circle-dot {
    width: 18px !important; height: 18px !important;
    border-radius: 50% !important;
    background: var(--esticrm-accent) !important;
    border: 3px solid #fff !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .25) !important;
}
.esticrm-marker--pin-price-tag {
    padding: 4px 10px !important;
    background: #fff !important;
    border-radius: 16px !important;
    border: 1.5px solid var(--esticrm-accent) !important;
    font: 600 11px/1.2 'Inter Tight', sans-serif !important;
    color: var(--esticrm-text) !important;
    white-space: nowrap !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .15) !important;
}

/* v12.5 — mobile/tablet (max-width: 1100px) only: toggle button visible, mapa hidden default.
   Desktop/laptop (>1100px) - zostaje split layout jak było. */
body button.esticrm-mobile-map-toggle.esticrm-btn,
body .esticrm-mobile-map-toggle {
    display: none !important;
}
@media (max-width: 1100px) {
    body .esticrm-browser__split {
        grid-template-columns: 1fr !important;
        display: block !important;
    }
    body button.esticrm-mobile-map-toggle.esticrm-btn,
    body .esticrm-mobile-map-toggle {
        display: inline-flex !important;
        margin: 0 0 16px !important;
        width: 100% !important;
        justify-content: center !important;
        gap: 8px !important;
    }
    /* Mapa w split - hidden by default (przed klikiem toggle) */
    body .esticrm-browser__split[data-mobile-map-collapsed="1"] .esticrm-browser__map-col {
        display: none !important;
    }
    /* v11.3.19 — Mapa po klik toggle: FULLSCREEN overlay z belką "Ukryj mapę" na górze */
    body .esticrm-browser__map-col--mobile-revealed {
        display: flex !important;
        flex-direction: column !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100vw !important;
        height: 100vh !important;
        max-height: none !important;
        margin: 0 !important;
        z-index: 999999 !important;
        background: #fff !important;
        animation: esticrm-map-reveal .25s ease-out !important;
    }
    body .esticrm-browser__map-col--mobile-revealed .esticrm-map-wrap {
        flex: 1 1 auto !important;
        width: 100% !important;
        height: auto !important;
        position: relative !important;
        top: 0 !important;
        border-radius: 0 !important;
    }
    body .esticrm-browser__map-col--mobile-revealed .esticrm-map {
        width: 100% !important;
        height: 100% !important;
    }
}

/* Header bar fullscreen mobile mapy — zawsze widoczny gdy mapa fullscreen */
body .esticrm-browser__map-col--mobile-revealed .esticrm-mobile-map-header {
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    padding: 10px 14px !important;
    background: #1A1716 !important;
    border-bottom: 1px solid #2A2421 !important;
    z-index: 2 !important;
}
body .esticrm-browser__map-col--mobile-revealed .esticrm-mobile-map-close {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    height: 40px !important;
    padding: 0 16px !important;
    background: transparent !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,0.25) !important;
    border-radius: 6px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
}
body .esticrm-browser__map-col--mobile-revealed .esticrm-mobile-map-close:hover {
    background: rgba(255,255,255,0.08) !important;
}
body .esticrm-browser__map-col--mobile-revealed .esticrm-mobile-map-close svg {
    flex: 0 0 auto !important;
}
/* Body lock scroll gdy mapa fullscreen */
body.esticrm-mobile-map-fullscreen-open {
    overflow: hidden !important;
}
@keyframes esticrm-map-reveal {
    from { opacity: 0; transform: translateY(-8px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ============================================================
   v6: MULTI-MARKER + POPUP CAROUSEL + CUSTOM MARKER STYLES + HIGHLIGHT
   ============================================================ */

/* v12.4 — multi marker color spójny z pin-style domyślnie:
   pin-default (czarny) → multi czarny; pin-gold (złoty) → multi złoty.
   Użytkownik może override przez kontrolkę "Kolor markera grupowego" w Elementor (--esticrm-marker-multi-bg).
   Selektor [data-marker-style="..."] dotyczy wrapping divIcon container .esticrm-map-wrap. */
body [data-marker-style="pin-default"] .esticrm-marker--multi {
    background-color: var(--esticrm-marker-multi-bg, #111010) !important;
}
body [data-marker-style="pin-gold"] .esticrm-marker--multi {
    background-color: var(--esticrm-marker-multi-bg, #D6B068) !important;
}

/* Multi-marker (grupa N ofert w jednej lokalizacji) */
body .esticrm-marker--multi {
    background: var(--esticrm-marker-multi-bg, var(--esticrm-accent)) !important;
    color: var(--esticrm-marker-multi-color, #fff) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    box-shadow: 0 4px 12px rgba(0,0,0,.3) !important;
    border: 3px solid #fff !important;
}
/* v11 — pulsing animation BEZ transform (Leaflet pin point) */
body .esticrm-marker.is-pulsing,
body .esticrm-marker--multi.is-pulsing {
    animation: esticrm-marker-pulse-ring 1s ease-in-out infinite !important;
}
@keyframes esticrm-marker-pulse-ring {
    0% { box-shadow: 0 0 0 0 rgba(214, 176, 104, .6); }
    100% { box-shadow: 0 0 0 16px rgba(214, 176, 104, 0); }
}

/* Marker: circle-image */
body .esticrm-marker--circle-image {
    width: 48px !important;
    height: 48px !important;
    border-radius: 50% !important;
    overflow: hidden !important;
    border: 3px solid var(--esticrm-marker-border, var(--esticrm-accent)) !important;
    box-shadow: 0 4px 10px rgba(0,0,0,.25) !important;
    background: #fff !important;
}
body .esticrm-marker--circle-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

/* Marker: square-tag (prostokąt z ceną) */
body .esticrm-marker--square-tag {
    background: var(--esticrm-marker-square-bg, var(--esticrm-text)) !important;
    color: var(--esticrm-marker-square-color, #fff) !important;
    padding: 6px 12px !important;
    border-radius: 4px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
    box-shadow: 0 4px 10px rgba(0,0,0,.25) !important;
}

/* Marker: letter (litera w kółku) */
body .esticrm-marker--letter {
    background: var(--esticrm-marker-letter-bg, var(--esticrm-accent)) !important;
    color: var(--esticrm-marker-letter-color, #fff) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: 600 !important;
    font-size: 16px !important;
    font-family: var(--esticrm-font-serif) !important;
    border: 2px solid #fff !important;
    box-shadow: 0 2px 6px rgba(0,0,0,.25) !important;
}

/* MULTI POPUP - karuzela ofert */
/* v11.3.17 — popup multi auto-height (content-sized), max-height safety.
   Wcześniej fixed height obcinał kartę (cena na dole nie była widoczna bez scrollowania).
   Teraz: header + viewport (sized to content) + nav, all visible without scroll dla typowej karty. */
body .esticrm-popup-multi {
    display: flex !important;
    flex-direction: column !important;
    width: 300px !important;
    /* v11.3.18 — limit szerokości do wąskiego viewport (mapa na mobile ma ~90vw szerokości — popup nie może wystawać poza) */
    max-width: min(calc(100vw - 60px), 320px) !important;
    /* v11.3.19 — Leaflet bindPopup ustawia maxHeight zależnie od wysokości mapy.
       Sam popup ma height:auto, ale Leaflet wrapper obcina nadmiar. */
    height: auto !important;
    background: var(--esticrm-popup-bg, #fff) !important;
    color: var(--esticrm-popup-color, var(--esticrm-text)) !important;
    padding: 12px 12px 10px !important;
    box-sizing: border-box !important;
}
body .esticrm-popup-multi:has(.esticrm-popup-card--images) {
    width: 320px !important;
}
/* v11.3.18 — leaflet popup container w obrębie mapy: ograniczyć do szerokości mapy + niewielki margin */
@media (max-width: 1100px) {
    body .esticrm-map-wrap .leaflet-popup-content-wrapper,
    body .esticrm-map-wrap .leaflet-popup-content {
        max-width: calc(100vw - 50px) !important;
    }
    body .esticrm-map-wrap .leaflet-popup {
        max-width: calc(100vw - 40px) !important;
    }
    body .esticrm-popup-multi {
        width: 280px !important;
        max-width: calc(100vw - 60px) !important;
    }
}
/* v12.5 — popup single (NIE multi) per-variant size — tylko gdy popup-multi NIE jest obecny.
   `:not(:has(.esticrm-popup-multi))` zapobiega konfliktowi z popup multi (który ma własne 320/340). */
body .leaflet-popup-content:not(:has(.esticrm-popup-multi)):has(.esticrm-popup-card--specs) {
    width: 300px !important;
}
body .leaflet-popup-content:not(:has(.esticrm-popup-multi)):has(.esticrm-popup-card--desc) {
    width: 300px !important;
}
body .leaflet-popup-content:not(:has(.esticrm-popup-multi)):has(.esticrm-popup-card--images) {
    width: 340px !important;
}
body .leaflet-popup-content:not(:has(.esticrm-popup-multi)):has(.esticrm-popup-card--compact) {
    width: 280px !important;
}
/* Slajdy w viewport — każdy o stałej szerokości */
body .esticrm-popup-multi__slide {
    width: 100% !important;
    box-sizing: border-box !important;
}
/* Karta popup wewnątrz slajdu — stała szerokość, obraz/title z ellipsis */
body .esticrm-popup-multi__slide .esticrm-popup-card {
    width: 100% !important;
    box-sizing: border-box !important;
}
body .esticrm-popup-multi__slide .esticrm-popup-card__image {
    width: 100% !important;
    height: 120px !important;
    object-fit: cover !important;
    display: block !important;
}
/* v11.3.17 — w popup multi karta ma mniejszy padding (więcej content w mniejszej wysokości) */
body .esticrm-popup-multi__slide .esticrm-popup-card__body {
    padding: 10px 12px 12px !important;
}
body .esticrm-popup-multi__slide .esticrm-popup-card__title {
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    min-height: 2.6em !important;
    word-wrap: break-word !important;
    word-break: break-word !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
}
/* Specs grid w popup multi — 3 kolumny ALE z `minmax(0, 1fr)` żeby cena mogła się zacisnąć */
body .esticrm-popup-multi__slide .esticrm-popup-card--specs .esticrm-popup-card__specs-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 6px !important;
}
body .esticrm-popup-multi__slide .esticrm-popup-card--specs .esticrm-popup-card__specs-grid > div {
    padding: 6px 4px !important;
    min-width: 0 !important;
    overflow: hidden !important;
}
body .esticrm-popup-multi__slide .esticrm-popup-card--specs .esticrm-popup-card__specs-grid strong {
    font-size: 13px !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
}
body .esticrm-popup-multi__slide .esticrm-popup-card--specs .esticrm-popup-card__specs-grid span {
    font-size: 9px !important;
}
body .esticrm-popup-multi__header {
    font-size: 13px !important;
    color: var(--esticrm-muted) !important;
    margin: 0 0 12px !important;
    /* padding-right żeby tekst nie nakładał z buttonem close (X) Leafleta */
    padding: 2px 32px 10px 0 !important;
    border-bottom: 1px solid var(--esticrm-border) !important;
    line-height: 1.35 !important;
    flex: 0 0 auto !important;
}
body .esticrm-popup-multi__viewport {
    position: relative !important;
    flex: 1 1 auto !important;
    overflow-y: visible !important;
    overflow-x: hidden !important;
}
/* v11.3.19 — gdy Leaflet ogranicza popup (maxHeight), nadaje wrapper class leaflet-popup-scrolled.
   Wewnętrzny popup-multi nie ma swojego scrollowania — to Leaflet wrap scrolluje. */
body .leaflet-popup-scrolled {
    overflow-y: auto !important;
    overflow-x: hidden !important;
}
body .esticrm-popup-multi__slide { display: none !important; }
body .esticrm-popup-multi__slide.is-active { display: block !important; }
body .esticrm-popup-multi__nav {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    margin-top: 12px !important;
    padding-top: 12px !important;
    border-top: 1px solid var(--esticrm-border) !important;
    flex: 0 0 auto !important;
    background: var(--esticrm-popup-bg, #fff) !important;
}
body .esticrm-popup-multi__arrow {
    /* v8 A12: fix proporcji — koło 32x32 nie rozciągane przez flex */
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    flex: 0 0 32px !important;
    padding: 0 !important;
    aspect-ratio: 1 / 1 !important;
    background: var(--esticrm-popup-arrow-bg, var(--esticrm-bg, #f9f7f4)) !important;
    color: var(--esticrm-popup-arrow-color, var(--esticrm-text)) !important;
    border-radius: 50% !important;
    border: 1px solid var(--esticrm-border) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    font-size: 16px !important;
    line-height: 1 !important;
    transition: background .15s, color .15s, border-color .15s !important;
}

/* v8 A13: popup variants */
body .esticrm-popup-card--specs {
    padding: 12px !important;
}
body .esticrm-popup-card--specs .esticrm-popup-card__specs-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px !important;
    margin: 8px 0 !important;
}
body .esticrm-popup-card--specs .esticrm-popup-card__specs-grid div {
    text-align: center !important;
    padding: 8px !important;
    background: var(--esticrm-bg) !important;
    border-radius: 6px !important;
}
body .esticrm-popup-card--specs .esticrm-popup-card__specs-grid strong {
    display: block !important;
    font-size: 16px !important;
    font-weight: 600 !important;
}
body .esticrm-popup-card--specs .esticrm-popup-card__specs-grid span {
    font-size: 10px !important;
    text-transform: uppercase !important;
    letter-spacing: .6px !important;
    color: var(--esticrm-muted) !important;
}
body .esticrm-popup-card--desc { padding: 12px !important; }
body .esticrm-popup-card--desc .esticrm-popup-card__desc {
    font-size: 13px !important;
    color: var(--esticrm-muted) !important;
    margin: 8px 0 !important;
    line-height: 1.5 !important;
}
body .esticrm-popup-card--images { padding: 0 !important; }
body .esticrm-popup-card--images .esticrm-popup-card__image {
    width: 100% !important;
    height: 180px !important;
    object-fit: cover !important;
}
body .esticrm-popup-card--images .esticrm-popup-card__title,
body .esticrm-popup-card--images .esticrm-popup-card__link {
    padding: 8px 12px !important;
    display: block !important;
}
body .esticrm-popup-card__link {
    margin-top: 8px !important;
    color: var(--esticrm-accent) !important;
    font-weight: 500 !important;
    text-decoration: none !important;
}
body .esticrm-popup-multi__arrow:hover {
    background: var(--esticrm-accent) !important;
    color: #fff !important;
    border-color: var(--esticrm-accent) !important;
}
body .esticrm-popup-multi__counter {
    font-size: 12px !important;
    color: var(--esticrm-muted) !important;
    flex: 1 1 auto !important;
    text-align: center !important;
}

/* v7 (A10): NOWE STYLE MARKERÓW */

body .esticrm-marker--house {
    width: 40px !important;
    height: 40px !important;
    background: var(--esticrm-marker-house-bg, var(--esticrm-accent)) !important;
    color: var(--esticrm-marker-house-color, #fff) !important;
    border-radius: 50% 50% 50% 0 !important;
    transform: rotate(-45deg) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 3px 8px rgba(0,0,0,.25) !important;
    border: 2px solid #fff !important;
}
body .esticrm-marker--house svg {
    transform: rotate(45deg) !important;
    width: 20px !important;
    height: 20px !important;
}

body .esticrm-marker--dollar {
    width: 38px !important;
    height: 38px !important;
    background: var(--esticrm-marker-dollar-bg, #2a5e2a) !important;
    color: var(--esticrm-marker-dollar-color, #fff) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    border: 3px solid #fff !important;
    box-shadow: 0 3px 8px rgba(0,0,0,.25) !important;
}

body .esticrm-marker--numbered {
    width: 36px !important;
    height: 36px !important;
    background: var(--esticrm-marker-numbered-bg, var(--esticrm-text)) !important;
    color: var(--esticrm-marker-numbered-color, #fff) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    border: 3px solid #fff !important;
    box-shadow: 0 3px 8px rgba(0,0,0,.25) !important;
    font-variant-numeric: tabular-nums !important;
}

body .esticrm-marker--flag {
    width: 32px !important;
    height: 36px !important;
    color: var(--esticrm-marker-flag-color, var(--esticrm-accent)) !important;
    filter: drop-shadow(0 2px 4px rgba(0,0,0,.3)) !important;
}
body .esticrm-marker--flag svg {
    width: 32px !important;
    height: 36px !important;
}

body .esticrm-marker--heart {
    width: 36px !important;
    height: 32px !important;
    color: var(--esticrm-marker-heart-color, #d63057) !important;
    filter: drop-shadow(0 2px 6px rgba(0,0,0,.35)) !important;
}
body .esticrm-marker--heart svg {
    width: 36px !important;
    height: 32px !important;
}

body .esticrm-marker--custom-svg {
    width: 40px !important;
    height: 40px !important;
    color: var(--esticrm-marker-custom-color, var(--esticrm-accent)) !important;
    filter: drop-shadow(0 2px 6px rgba(0,0,0,.3)) !important;
}

/* HIGHLIGHT karty po klik markera (edytowalna obramówka) */
body .esticrm-card.is-highlighted {
    outline: var(--esticrm-highlight-width, 2px) solid var(--esticrm-highlight-color, var(--esticrm-accent)) !important;
    outline-offset: var(--esticrm-highlight-offset, 2px) !important;
    transform: scale(var(--esticrm-highlight-scale, 1.01)) !important;
    transition: transform .2s, outline-color .2s !important;
}

/* v11 — animacje markera BEZ transform (Leaflet posizioniuje top/left w px,
   transform: scale przesuwa anchor → marker "odskakuje od myszki"). Tylko box-shadow + filter brightness. */
@keyframes esticrm-marker-pulse-shadow {
    0%, 100% { box-shadow: 0 0 0 0 var(--esticrm-accent, #d6b068); }
    50% { box-shadow: 0 0 0 8px rgba(214, 176, 104, 0); }
}
@keyframes esticrm-marker-glow {
    0%, 100% { filter: brightness(1); }
    50% { filter: brightness(1.25); }
}
body .esticrm-marker-anim-pulse .esticrm-marker { animation: esticrm-marker-pulse-shadow 2s ease-in-out infinite !important; }
body .esticrm-marker-anim-bounce .esticrm-marker { animation: esticrm-marker-glow 1.5s ease-in-out infinite !important; }
body .esticrm-marker-anim-shake .esticrm-marker { animation: esticrm-marker-glow 0.8s ease-in-out infinite !important; }
body .esticrm-marker {
    transition: box-shadow 0.2s, filter 0.2s, background-color 0.2s, border-color 0.2s !important;
}

/* v9 B21: popup layouts */
body .esticrm-map-popup__img {
    width: 100% !important;
    aspect-ratio: 4 / 3 !important;
    object-fit: cover !important;
    display: block !important;
    border-radius: 6px !important;
    margin-bottom: 8px !important;
}
body .esticrm-popup-layout-horizontal .esticrm-map-popup {
    display: flex !important;
    gap: 8px !important;
    align-items: stretch !important;
}
body .esticrm-popup-layout-horizontal .esticrm-map-popup__img {
    width: 120px !important;
    height: 100% !important;
    margin-bottom: 0 !important;
    flex-shrink: 0 !important;
}
body .esticrm-popup-layout-image-only .esticrm-map-popup__title,
body .esticrm-popup-layout-image-only .esticrm-map-popup__price,
body .esticrm-popup-layout-image-only .esticrm-map-popup__location,
body .esticrm-popup-layout-image-only .esticrm-map-popup__meta { display: none !important; }
body .esticrm-popup-layout-text-only .esticrm-map-popup__img { display: none !important; }

/* v12.2 — HARD RESET dla pin-* z wysoką specyfiką (przebija Elementor inline `box-shadow` na widget mapy).
   Hover: zero animacji, zero transition box-shadow, tylko brightness instant. */
body .leaflet-pane.leaflet-marker-pane .leaflet-marker-icon.esticrm-marker.esticrm-marker--pin-default,
body .leaflet-pane.leaflet-marker-pane .leaflet-marker-icon.esticrm-marker.esticrm-marker--pin-gold {
    box-shadow: none !important;
    filter: none !important;
    outline: none !important;
    background-color: transparent !important;
    border: 0 !important;
    animation: none !important;
    transition: filter .08s linear !important;
    width: 28px !important;
    height: 36px !important;
    background-position: center !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
}
body .leaflet-pane.leaflet-marker-pane .leaflet-marker-icon.esticrm-marker.esticrm-marker--pin-default:hover,
body .leaflet-pane.leaflet-marker-pane .leaflet-marker-icon.esticrm-marker.esticrm-marker--pin-gold:hover {
    filter: brightness(1.18) !important;
    box-shadow: none !important;
    z-index: 1000 !important;
}
/* Reset transition dla pozostałych wariantów żeby hover nie pulsował box-shadow w nieskończoność */
body .leaflet-pane.leaflet-marker-pane .leaflet-marker-icon.esticrm-marker {
    transition: filter .08s linear !important;
    pointer-events: auto !important;
    cursor: pointer !important;
}
body .leaflet-pane.leaflet-marker-pane .leaflet-marker-icon.esticrm-marker:hover {
    filter: brightness(1.15) !important;
    z-index: 1000 !important;
}

/* ============================================================
   v10 B14 — Marker grupowany (cluster) — domyślne style
   ============================================================ */
body .esticrm-marker--grouped {
    background: var(--esticrm-accent, #d6b068) !important;
    color: #fff !important;
    border: 2px solid #fff !important;
    border-radius: 50% !important;
    min-width: 40px !important;
    min-height: 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    box-shadow: 0 4px 12px rgba(0,0,0,.25) !important;
    cursor: pointer !important;
}
body .esticrm-marker--grouped:hover {
    box-shadow: 0 0 0 4px rgba(214, 176, 104, .35), 0 8px 20px rgba(0,0,0,.3) !important;
    filter: brightness(1.1) !important;
}
body .esticrm-marker--grouped::before {
    content: '' !important;
    position: absolute !important;
    inset: -6px !important;
    border-radius: 50% !important;
    background: var(--esticrm-accent, #d6b068) !important;
    opacity: .25 !important;
    z-index: -1 !important;
}

/* ============================================================
   v10 B13 — Karta zaznaczona po klik markera (default styles)
   ============================================================ */
body .esticrm-card.is-highlighted {
    outline-style: solid !important;
    outline-width: var(--esticrm-highlight-outline-width, 3px) !important;
    outline-color: var(--esticrm-highlight-outline-color, var(--esticrm-accent, #d6b068)) !important;
    outline-offset: var(--esticrm-highlight-outline-offset, 2px) !important;
    transition: outline-color .2s, box-shadow .2s, transform .2s !important;
    z-index: 1 !important;
    position: relative !important;
}
body .esticrm-card-highlight-anim-pulse.esticrm-card.is-highlighted,
body [class*="esticrm-card-highlight-anim-pulse"] .esticrm-card.is-highlighted {
    animation: esticrm-card-highlight-pulse 1.4s ease-in-out infinite !important;
}
body .esticrm-card-highlight-anim-glow.esticrm-card.is-highlighted,
body [class*="esticrm-card-highlight-anim-glow"] .esticrm-card.is-highlighted {
    animation: esticrm-card-highlight-glow 1.6s ease-in-out infinite !important;
}
@keyframes esticrm-card-highlight-pulse {
    0%, 100% { outline-color: var(--esticrm-highlight-outline-color, #d6b068); }
    50% { outline-color: rgba(214,176,104,.3); }
}
@keyframes esticrm-card-highlight-glow {
    0%, 100% { box-shadow: 0 0 12px 2px var(--esticrm-accent, #d6b068); }
    50% { box-shadow: 0 0 24px 6px var(--esticrm-accent, #d6b068); }
}

/* ============================================================
   v10 B15 — Popup grupowanych ofert (lista po klik clustera)
   ============================================================ */
body .esticrm-map-group-popup {
    background: #fff !important;
    border: 1px solid var(--esticrm-border, #e5e7eb) !important;
    border-radius: 10px !important;
    padding: 8px !important;
    box-shadow: 0 10px 30px rgba(0,0,0,.15) !important;
    min-width: 280px !important;
    max-width: 360px !important;
    max-height: 380px !important;
    overflow-y: auto !important;
}
body .esticrm-grouppopup-list .esticrm-map-group-popup__items {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
}
body .esticrm-grouppopup-grid .esticrm-map-group-popup__items {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
}
body .esticrm-grouppopup-carousel .esticrm-map-group-popup__items {
    display: flex !important;
    gap: 8px !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory !important;
}
body .esticrm-grouppopup-carousel .esticrm-map-group-popup__item {
    flex: 0 0 70% !important;
    scroll-snap-align: start !important;
}
body .esticrm-map-group-popup__item {
    display: flex !important;
    gap: 10px !important;
    padding: 8px !important;
    border-radius: 8px !important;
    background: #fff !important;
    border: 1px solid var(--esticrm-border, #e5e7eb) !important;
    cursor: pointer !important;
    text-decoration: none !important;
    color: inherit !important;
    transition: background .15s, border-color .15s !important;
}
body .esticrm-map-group-popup__item:hover {
    background: var(--esticrm-bg, #fafafa) !important;
    border-color: var(--esticrm-accent, #d6b068) !important;
}
body .esticrm-map-group-popup__item-img {
    width: 64px !important;
    height: 64px !important;
    border-radius: 6px !important;
    object-fit: cover !important;
    flex-shrink: 0 !important;
}
body .esticrm-map-group-popup__item-body {
    flex: 1 1 auto !important;
    min-width: 0 !important;
}
body .esticrm-map-group-popup__item-title {
    font-size: 13px !important;
    font-weight: 500 !important;
    margin: 0 0 4px !important;
    color: var(--esticrm-text) !important;
    line-height: 1.2 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}
body .esticrm-map-group-popup__item-price {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: var(--esticrm-accent, #d6b068) !important;
    margin: 0 !important;
}
body .esticrm-map-group-popup__item-meta {
    font-size: 11px !important;
    color: var(--esticrm-muted, #6b7280) !important;
    margin: 2px 0 0 !important;
}

/* v10 B22 — popup ZAWSZE widoczny (z-index + visibility) */
body .leaflet-popup,
body .esticrm-map-popup-leaflet,
body .leaflet-popup-pane {
    z-index: 9990 !important;
    pointer-events: auto !important;
}
body .leaflet-popup-content-wrapper {
    background: #fff !important;
    border-radius: 12px !important;
    box-shadow: 0 12px 36px rgba(0,0,0,.18) !important;
    padding: 0 !important;
    overflow: hidden !important;
}
body .leaflet-popup-content {
    box-sizing: border-box !important;
}
body .leaflet-popup-content {
    margin: 0 !important;
    line-height: 1.4 !important;
    min-width: 220px !important;
}
body .leaflet-popup-tip {
    background: #fff !important;
}
body .leaflet-popup .esticrm-popup-card {
    display: block !important;
    color: inherit !important;
    text-decoration: none !important;
}
body .leaflet-popup .esticrm-popup-card__image {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 4/3 !important;
    object-fit: cover !important;
}
body .leaflet-popup .esticrm-popup-card__body {
    padding: 12px !important;
}
body .leaflet-popup .esticrm-popup-card__title {
    font-size: 14px !important;
    font-weight: 600 !important;
    margin: 4px 0 6px !important;
    color: var(--esticrm-text, #1a1a1a) !important;
    line-height: 1.3 !important;
}
body .leaflet-popup .esticrm-popup-card__price {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: var(--esticrm-accent, #d6b068) !important;
    margin: 6px 0 0 !important;
}
body .leaflet-popup .esticrm-popup-card__location,
body .leaflet-popup .esticrm-popup-card__meta {
    font-size: 12px !important;
    color: var(--esticrm-muted, #6b7280) !important;
    margin: 2px 0 !important;
}
body .leaflet-popup .esticrm-popup-card__badge {
    display: inline-block !important;
    padding: 2px 8px !important;
    border-radius: 4px !important;
    background: var(--esticrm-accent, #d6b068) !important;
    color: #fff !important;
    font-size: 10px !important;
    text-transform: uppercase !important;
    letter-spacing: .5px !important;
}