/* =========================================================
   Ekosphere Estate – Property Frontend Design Layer v1.0.1
   Basis: bereitgestellte EPF-CSS-Regeln.
   Scope: ekosphere-property-frontend Klassen (.epf-*)
   ========================================================= */

/* =========================================================
   Ekosphere Property Frontend
   Phase 6 CSS-Finalisierung
   Scope: .epf-property-list-wrap
   ========================================================= */

/* ---------------------------------------------------------
   1) Design Tokens
   Nutzt vorhandene ekosphere Tokens, falls eko.css geladen ist.
   Fallbacks sind identisch/nahe an ekosphere.
   --------------------------------------------------------- */

:root {
    --epf-primary: var(--ek-primary, #00DCFF);
    --epf-primary-dark: var(--ek-primary-dark, #00C0E0);
    --epf-secondary: var(--ek-secondary, #004F4D);

    --epf-whatsapp: var(--ek-whatsapp, #128C7E);
    --epf-whatsapp-hover: var(--ek-whatsapp-hover, #2F2F2F);

    --epf-btn-neutral: var(--ek-btn-neutral, #555555);
    --epf-btn-neutral-hover: var(--ek-btn-neutral-hover, #000000);

    --epf-ink: var(--ek-ink, #0F172A);
    --epf-muted: var(--ek-text-muted, #4E4E4E);

    --epf-bg: var(--ek-bg, #FFFFFF);
    --epf-card-bg: var(--ek-card-soft, #F3F4F6);
    --epf-card-bg-inner: #FFFFFF;

    --epf-border: var(--epf-primary);
    --epf-border-soft: rgba(0, 220, 255, 0.55);

    --epf-shadow: 0 10px 28px rgba(15, 23, 42, 0.08);
    --epf-shadow-hover: 0 14px 34px rgba(15, 23, 42, 0.12);

    --epf-radius: 0;
}

/* ---------------------------------------------------------
   2) Scope / Reset gegen Theme-CSS
   --------------------------------------------------------- */

.epf-property-list-wrap,
.epf-property-list-wrap *,
.epf-property-list-wrap *::before,
.epf-property-list-wrap *::after {
    box-sizing: border-box;
}

.epf-property-list-wrap {
    width: 100% !important;
    max-width: 100% !important;
    margin: 22px auto 0 !important;
    padding: 0 !important;
    color: var(--epf-ink);
    font-family: "Roboto", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
}

.epf-property-list-wrap a,
.epf-property-list-wrap a:link,
.epf-property-list-wrap a:visited,
.epf-property-list-wrap a:hover,
.epf-property-list-wrap a:focus {
    text-decoration: none !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
}

.epf-property-list-wrap img {
    max-width: 100%;
    height: auto;
}

.epf-property-list-wrap p,
.epf-property-list-wrap h2,
.epf-property-list-wrap dl,
.epf-property-list-wrap dt,
.epf-property-list-wrap dd {
    margin-top: 0;
}

/* ---------------------------------------------------------
   3) Grid
   --------------------------------------------------------- */

.epf-property-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 28px !important;
    width: 100% !important;
    align-items: stretch !important;
}

@media (min-width: 768px) {
    .epf-property-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (min-width: 1180px) {
    .epf-property-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

/* ---------------------------------------------------------
   4) Card
   --------------------------------------------------------- */

.epf-property-card {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 100% !important;
    overflow: hidden !important;
    background: var(--epf-card-bg) !important;
    border: 1px solid var(--epf-border) !important;
    border-radius: var(--epf-radius) !important;
    box-shadow: var(--epf-shadow) !important;
    color: var(--epf-ink) !important;

    /*
     * Bewusst minimal.
     * Keine schweren Animationen, kein Bild-Zoom.
     */
    transition: box-shadow 140ms ease, border-color 140ms ease !important;
}

.epf-property-card:hover {
    border-color: var(--epf-primary-dark) !important;
    box-shadow: var(--epf-shadow-hover) !important;
}

/* ---------------------------------------------------------
   5) Image
   --------------------------------------------------------- */

.epf-property-image {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    aspect-ratio: 16 / 10 !important;
    overflow: hidden !important;
    background: var(--epf-card-bg-inner) !important;
    border-bottom: 1px solid var(--epf-border-soft) !important;
}

.epf-property-image-img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover !important;
    object-position: center center !important;
}

.epf-property-image-placeholder {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 220px !important;
    padding: 24px !important;
    color: var(--epf-muted) !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    text-align: center !important;
}

/* ---------------------------------------------------------
   6) Badge
   --------------------------------------------------------- */

body:not(.wp-admin) .epf-property-list-wrap .epf-property-card .epf-property-image .epf-property-status-badge,
body:not(.wp-admin) .ml-property-shortcode-wrap .epf-property-status-badge,
body:not(.wp-admin) .epf-property-status-badge {
    position: absolute !important;
    left: 14px !important;
    top: 14px !important;
    z-index: 2 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 28px !important;
    padding: 6px 11px !important;
    background: #00DCFF !important;
    background-color: #00DCFF !important;
    border: 1px solid #333333 !important;
    border-color: #333333 !important;
    border-radius: 0 !important;
    color: #0F172A !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    text-decoration: none !important;
}

/* ---------------------------------------------------------
   7) Content
   --------------------------------------------------------- */

.epf-property-content {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    min-width: 0 !important;
    padding: 20px !important;
}

.epf-property-topline {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    min-height: 18px !important;
    margin-bottom: 10px !important;
}

.epf-property-type {
    display: inline-block !important;
    max-width: 58% !important;
    overflow: hidden !important;
    color: var(--epf-secondary) !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
    text-transform: uppercase !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    letter-spacing: 0.07em !important;
}

.epf-property-location-short {
    display: inline-block !important;
    max-width: 42% !important;
    overflow: hidden !important;
    color: var(--epf-muted) !important;
    font-size: 12px !important;
    line-height: 1.3 !important;
    text-align: right !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.epf-property-title {
    display: -webkit-box !important;
    min-height: 54px !important;
    max-height: 54px !important;
    margin: 0 0 12px !important;
    padding: 0 !important;
    overflow: hidden !important;
    color: var(--epf-ink) !important;
    font-size: 23px !important;
    font-weight: 700 !important;
    line-height: 1.18 !important;
    text-align: left !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

.epf-property-title a,
.epf-property-title a:link,
.epf-property-title a:visited {
    color: var(--epf-ink) !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    text-decoration: none !important;
    border-bottom: none !important;
}

.epf-property-title a:hover,
.epf-property-title a:focus {
    color: var(--epf-secondary) !important;
}

.epf-property-price {
    margin: 0 0 14px !important;
    color: var(--epf-ink) !important;
    font-size: 21px !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    text-align: left !important;
}

/* ---------------------------------------------------------
   8) Meta
   --------------------------------------------------------- */

.epf-property-meta {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    min-height: 33px !important;
    margin: 0 0 14px !important;
    padding: 0 !important;
}

.epf-property-meta-item {
    display: inline-flex !important;
    align-items: baseline !important;
    gap: 5px !important;
    margin: 0 !important;
    padding: 7px 10px !important;
    background: #ffffff !important;
    border: 1px solid rgba(0, 79, 77, 0.14) !important;
    border-radius: 0 !important;
    color: var(--epf-ink) !important;
    font-size: 13px !important;
    line-height: 1.2 !important;
}

.epf-property-meta dt {
    margin: 0 !important;
    padding: 0 !important;
    color: var(--epf-muted) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
}

.epf-property-meta dd {
    margin: 0 !important;
    padding: 0 !important;
    color: var(--epf-ink) !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
}

/* ---------------------------------------------------------
   9) Excerpt
   --------------------------------------------------------- */

.epf-property-excerpt {
    display: -webkit-box !important;
    min-height: 66px !important;
    max-height: 66px !important;
    margin: 0 0 18px !important;
    overflow: hidden !important;
    color: var(--epf-ink) !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
    text-align: left !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 3 !important;
}

/* ---------------------------------------------------------
   10) Buttons
   Layout stabil: Desktop zwei nebeneinander, Mobile untereinander.
   Farben an eko.css angelehnt.
   --------------------------------------------------------- */

.epf-property-action {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    width: 100% !important;
    margin-top: auto !important;
    padding-top: 6px !important;
}

.epf-property-button,
.epf-property-button:link,
.epf-property-button:visited {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 40px !important;
    padding: 9px 12px !important;
    border-radius: 0 !important;
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    text-align: center !important;
    text-decoration: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
}

.epf-property-button-details,
.epf-property-button-details:link,
.epf-property-button-details:visited {
    background: var(--epf-btn-neutral) !important;
    border: 1px solid var(--epf-btn-neutral) !important;
}

.epf-property-button-details:hover,
.epf-property-button-details:focus,
.epf-property-button-details:focus-visible {
    background: var(--epf-btn-neutral-hover) !important;
    border-color: var(--epf-btn-neutral-hover) !important;
    color: #ffffff !important;
}

.epf-property-button-whatsapp,
.epf-property-button-whatsapp:link,
.epf-property-button-whatsapp:visited {
    background: var(--epf-whatsapp) !important;
    border: 1px solid var(--epf-whatsapp) !important;
}

.epf-property-button-whatsapp:hover,
.epf-property-button-whatsapp:focus,
.epf-property-button-whatsapp:focus-visible {
    background: var(--epf-whatsapp-hover) !important;
    border-color: var(--epf-whatsapp-hover) !important;
    color: #ffffff !important;
}

/* ---------------------------------------------------------
   11) Empty / Diagnostic
   --------------------------------------------------------- */

.epf-property-empty,
.epf-diagnostic-box {
    padding: 24px !important;
    background: var(--epf-card-bg) !important;
    border: 1px solid var(--epf-border) !important;
    border-radius: 0 !important;
    color: var(--epf-ink) !important;
    box-shadow: var(--epf-shadow) !important;
}

.epf-diagnostic-box {
    max-width: 760px !important;
    margin: 24px auto !important;
}

.epf-diagnostic-title {
    margin: 0 0 12px !important;
    font-size: 24px !important;
    line-height: 1.25 !important;
}

.epf-diagnostic-list {
    margin: 16px 0 0 !important;
    padding-left: 20px !important;
}

.epf-diagnostic-list li {
    margin-bottom: 8px !important;
}

/* ---------------------------------------------------------
   12) Mobile
   --------------------------------------------------------- */

@media (max-width: 767px) {
    .epf-property-list-wrap {
        margin: 20px auto 0 !important;
        padding: 0 !important;
    }

    .epf-property-grid {
        gap: 22px !important;
    }

    .epf-property-content {
        padding: 18px !important;
    }

    .epf-property-title {
        min-height: auto !important;
        max-height: none !important;
        font-size: 22px !important;
    }

    .epf-property-excerpt {
        min-height: auto !important;
        max-height: none !important;
    }

    .epf-property-topline {
        align-items: flex-start !important;
        flex-direction: column !important;
        gap: 4px !important;
    }

    .epf-property-type,
    .epf-property-location-short {
        max-width: 100% !important;
        text-align: left !important;
    }

    .epf-property-action {
        grid-template-columns: 1fr !important;
    }
}

/* =========================================================
   Phase 7 – Property Single
   ========================================================= */

.epf-property-single {
    width: 100% !important;
    max-width: 1180px !important;
    margin: 40px auto !important;
    padding: 0 18px !important;
    color: var(--epf-ink, #0F172A) !important;
    font-family: "Roboto", system-ui, -apple-system, "Segoe UI", Arial, sans-serif !important;
}

.epf-property-single *,
.epf-property-single *::before,
.epf-property-single *::after {
    box-sizing: border-box !important;
}

.epf-property-single-back {
    margin: 0 0 22px !important;
}

.epf-property-single-back a {
    color: var(--epf-secondary, #004F4D) !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    border-bottom: 1px solid rgba(0, 79, 77, 0.28) !important;
}

.epf-property-single-back a:hover {
    color: #000000 !important;
    border-bottom-color: var(--epf-primary, #00DCFF) !important;
}

.epf-property-single-header {
    margin: 0 0 28px !important;
    padding: 26px !important;
    background: var(--epf-card-bg, #F3F4F6) !important;
    border: 1px solid var(--epf-border, #00DCFF) !important;
    border-radius: 0 !important;
}

.epf-property-single-kicker {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin: 0 0 12px !important;
}

.epf-property-single-kicker span {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 28px !important;
    padding: 6px 10px !important;
    background: #ffffff !important;
    border: 1px solid rgba(0, 79, 77, 0.16) !important;
    color: var(--epf-secondary, #004F4D) !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
}

.epf-property-single-title {
    margin: 0 0 14px !important;
    padding: 0 !important;
    color: var(--epf-ink, #0F172A) !important;
    font-size: clamp(32px, 4vw, 52px) !important;
    font-weight: 800 !important;
    line-height: 1.08 !important;
    text-align: left !important;
}

.epf-property-single-summary {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 14px 24px !important;
    align-items: baseline !important;
}

.epf-property-single-price {
    color: var(--epf-ink, #0F172A) !important;
    font-size: 28px !important;
    font-weight: 900 !important;
    line-height: 1.15 !important;
}

.epf-property-single-location {
    color: var(--epf-muted, #4E4E4E) !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
}

.epf-property-single-gallery {
    display: grid !important;
    grid-template-columns: minmax(0, 2fr) minmax(240px, 0.8fr) !important;
    gap: 16px !important;
    margin: 0 0 30px !important;
}

.epf-property-single-main-image,
.epf-property-single-thumb {
    overflow: hidden !important;
    background: #ffffff !important;
    border: 1px solid var(--epf-border, #00DCFF) !important;
}

.epf-property-single-main-image {
    aspect-ratio: 16 / 10 !important;
}

.epf-property-single-main-img,
.epf-property-single-thumb-img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover !important;
    object-position: center center !important;
}

.epf-property-single-thumbs {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
}

.epf-property-single-thumb {
    aspect-ratio: 1 / 1 !important;
}

.epf-property-single-layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 330px !important;
    gap: 28px !important;
    align-items: start !important;
}

.epf-property-single-main {
    min-width: 0 !important;
}

.epf-property-single-section {
    margin: 0 0 28px !important;
    padding: 24px !important;
    background: var(--epf-card-bg, #F3F4F6) !important;
    border: 1px solid var(--epf-border, #00DCFF) !important;
    border-radius: 0 !important;
}

.epf-property-single-section h2,
.epf-property-single-cta h2 {
    margin: 0 0 16px !important;
    padding: 0 !important;
    color: var(--epf-ink, #0F172A) !important;
    font-size: 24px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    text-align: left !important;
}

.epf-property-single-description,
.epf-property-single-description p {
    color: var(--epf-ink, #0F172A) !important;
    font-size: 16px !important;
    line-height: 1.7 !important;
    text-align: left !important;
}

.epf-property-single-description p:last-child {
    margin-bottom: 0 !important;
}

.epf-property-single-facts,
.epf-property-single-additional {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.epf-property-single-fact,
.epf-property-single-additional-item {
    padding: 14px !important;
    background: #ffffff !important;
    border: 1px solid rgba(0, 79, 77, 0.14) !important;
}

.epf-property-single-fact dt,
.epf-property-single-additional-item dt {
    margin: 0 0 5px !important;
    color: var(--epf-muted, #4E4E4E) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
}

.epf-property-single-fact dd,
.epf-property-single-additional-item dd {
    margin: 0 !important;
    color: var(--epf-ink, #0F172A) !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
}

.epf-property-single-features {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.epf-property-single-features li {
    position: relative !important;
    margin: 0 !important;
    padding: 10px 12px 10px 34px !important;
    background: #ffffff !important;
    border: 1px solid rgba(0, 79, 77, 0.14) !important;
    color: var(--epf-ink, #0F172A) !important;
    font-size: 15px !important;
    line-height: 1.35 !important;
}

.epf-property-single-features li::before {
    content: "" !important;
    position: absolute !important;
    left: 13px !important;
    top: 15px !important;
    width: 10px !important;
    height: 6px !important;
    border-left: 2px solid var(--epf-primary, #00DCFF) !important;
    border-bottom: 2px solid var(--epf-primary, #00DCFF) !important;
    transform: rotate(-45deg) !important;
}

.epf-property-single-sidebar {
    position: sticky !important;
    top: 110px !important;
}

.epf-property-single-cta {
    padding: 22px !important;
    background: var(--epf-card-bg, #F3F4F6) !important;
    border: 1px solid var(--epf-border, #00DCFF) !important;
    border-radius: 0 !important;
}

.epf-property-single-cta p {
    margin: 0 0 16px !important;
    color: var(--epf-ink, #0F172A) !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
}

.epf-property-single-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 44px !important;
    margin: 0 0 10px !important;
    padding: 10px 14px !important;
    border-radius: 0 !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    text-align: center !important;
    text-decoration: none !important;
    border-bottom: none !important;
}

.epf-property-single-button-whatsapp {
    background: var(--epf-whatsapp, #128C7E) !important;
    border: 1px solid var(--epf-whatsapp, #128C7E) !important;
}

.epf-property-single-button-whatsapp:hover {
    background: var(--epf-whatsapp-hover, #2F2F2F) !important;
    border-color: var(--epf-whatsapp-hover, #2F2F2F) !important;
}

.epf-property-single-button-contact {
    background: var(--epf-btn-neutral, #555555) !important;
    border: 1px solid var(--epf-btn-neutral, #555555) !important;
}

.epf-property-single-button-contact:hover {
    background: var(--epf-btn-neutral-hover, #000000) !important;
    border-color: var(--epf-btn-neutral-hover, #000000) !important;
}

@media (max-width: 1024px) {
    .epf-property-single-gallery {
        grid-template-columns: 1fr !important;
    }

    .epf-property-single-layout {
        grid-template-columns: 1fr !important;
    }

    .epf-property-single-sidebar {
        position: static !important;
    }
}

@media (max-width: 767px) {
    .epf-property-single {
        margin: 28px auto !important;
        padding: 0 14px !important;
    }

    .epf-property-single-header,
    .epf-property-single-section,
    .epf-property-single-cta {
        padding: 18px !important;
    }

    .epf-property-single-title {
        font-size: 31px !important;
    }

    .epf-property-single-facts,
    .epf-property-single-additional,
    .epf-property-single-features {
        grid-template-columns: 1fr !important;
    }

    .epf-property-single-thumbs {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

/* Phase 7.1 – klickbare Galerie */

.epf-property-single-thumb {
    appearance: none !important;
    cursor: pointer !important;
    padding: 0 !important;
    text-align: left !important;
}

.epf-property-single-thumb.is-active {
    outline: 3px solid var(--epf-primary, #00DCFF) !important;
    outline-offset: -3px !important;
}

.epf-property-single-main-link {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    border-bottom: 0 !important;
    text-decoration: none !important;
}

.epf-property-single-main-link:hover,
.epf-property-single-main-link:focus {
    border-bottom: 0 !important;
    text-decoration: none !important;
}

/* =========================================================
   Phase 7.2 – Galerie unter Hauptbild + Lightbox
   ========================================================= */

.epf-property-single-gallery {
    display: block !important;
    margin: 0 0 30px !important;
}

.epf-property-single-main-image {
    width: 100% !important;
    aspect-ratio: 16 / 9 !important;
    overflow: hidden !important;
    background: #ffffff !important;
    border: 1px solid var(--epf-border, #00DCFF) !important;
}

.epf-property-single-main-button {
    appearance: none !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    cursor: zoom-in !important;
}

.epf-property-single-main-img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover !important;
    object-position: center center !important;
}

.epf-property-single-thumbs {
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 8px !important;
    width: 100% !important;
    margin: 10px 0 0 !important;
}

.epf-property-single-thumb {
    appearance: none !important;
    display: block !important;
    width: 100% !important;
    aspect-ratio: 4 / 3 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: #ffffff !important;
    border: 1px solid var(--epf-border, #00DCFF) !important;
    border-radius: 0 !important;
    cursor: pointer !important;
    text-align: left !important;
}

.epf-property-single-thumb.is-active {
    outline: 3px solid var(--epf-secondary, #004F4D) !important;
    outline-offset: -3px !important;
}

.epf-property-single-thumb-img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover !important;
    object-position: center center !important;
}

.epf-property-lightbox[hidden] {
    display: none !important;
}

.epf-property-lightbox {
    position: fixed !important;
    inset: 0 !important;
    z-index: 999999 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 24px !important;
}

.epf-property-lightbox-backdrop {
    position: absolute !important;
    inset: 0 !important;
    background: rgba(2, 6, 23, 0.92) !important;
}

.epf-property-lightbox-inner {
    position: relative !important;
    z-index: 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: min(1180px, 100%) !important;
    height: min(760px, 86vh) !important;
}

.epf-property-lightbox-img {
    display: block !important;
    max-width: 100% !important;
    max-height: 100% !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    border: 1px solid var(--epf-primary, #00DCFF) !important;
    background: #ffffff !important;
}

.epf-property-lightbox-close,
.epf-property-lightbox-nav {
    appearance: none !important;
    position: absolute !important;
    z-index: 3 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    border-radius: 0 !important;
    color: #ffffff !important;
    background: rgba(0, 79, 77, 0.92) !important;
    border: 1px solid var(--epf-primary, #00DCFF) !important;
    cursor: pointer !important;
    line-height: 1 !important;
}

.epf-property-lightbox-close {
    top: 0 !important;
    right: 0 !important;
    width: 44px !important;
    height: 44px !important;
    font-size: 32px !important;
}

.epf-property-lightbox-nav {
    top: 50% !important;
    width: 52px !important;
    height: 70px !important;
    font-size: 48px !important;
    transform: translateY(-50%) !important;
}

.epf-property-lightbox-prev {
    left: 0 !important;
}

.epf-property-lightbox-next {
    right: 0 !important;
}

.epf-property-lightbox-close:hover,
.epf-property-lightbox-nav:hover {
    background: #000000 !important;
}

.epf-property-lightbox-counter {
    position: absolute !important;
    left: 50% !important;
    bottom: 0 !important;
    z-index: 3 !important;
    transform: translateX(-50%) !important;
    padding: 8px 12px !important;
    background: rgba(0, 79, 77, 0.92) !important;
    border: 1px solid var(--epf-primary, #00DCFF) !important;
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

html.epf-lightbox-open,
html.epf-lightbox-open body {
    overflow: hidden !important;
}

@media (max-width: 1024px) {
    .epf-property-single-thumbs {
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 767px) {
    .epf-property-single-thumbs {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .epf-property-lightbox {
        padding: 14px !important;
    }

    .epf-property-lightbox-inner {
        height: 82vh !important;
    }

    .epf-property-lightbox-nav {
        width: 42px !important;
        height: 58px !important;
        font-size: 38px !important;
    }

    .epf-property-lightbox-close {
        width: 40px !important;
        height: 40px !important;
        font-size: 30px !important;
    }
}

/* Phase 7.3 – YouTube Video */

.epf-property-single-video {
    position: relative !important;
    width: 100% !important;
    aspect-ratio: 16 / 9 !important;
    overflow: hidden !important;
    background: #000000 !important;
    border: 1px solid var(--epf-border, #00DCFF) !important;
}

.epf-property-single-video iframe {
    position: absolute !important;
    inset: 0 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    border: 0 !important;
}

/* =========================================================
   Phase 8 – Property Filter
   ========================================================= */

.epf-property-filter {
    width: 100% !important;
    max-width: 100% !important;
    margin: 18px auto 24px !important;
    padding: 0 !important;
    font-family: "Roboto", system-ui, -apple-system, "Segoe UI", Arial, sans-serif !important;
}

.epf-property-filter,
.epf-property-filter *,
.epf-property-filter *::before,
.epf-property-filter *::after {
    box-sizing: border-box !important;
}

.epf-property-filter-inner {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 14px !important;
    align-items: end !important;
    padding: 18px !important;
    background: var(--epf-card-bg, #F3F4F6) !important;
    border: 1px solid var(--epf-border, #00DCFF) !important;
    border-radius: 0 !important;
    box-shadow: var(--epf-shadow, 0 10px 28px rgba(15, 23, 42, 0.08)) !important;
}

.epf-property-filter-field {
    min-width: 0 !important;
}

.epf-property-filter-field label {
    display: block !important;
    margin: 0 0 6px !important;
    color: var(--epf-secondary, #004F4D) !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
}

.epf-property-filter-field select {
    display: block !important;
    width: 100% !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 8px 10px !important;
    background: #ffffff !important;
    border: 1px solid rgba(0, 79, 77, 0.24) !important;
    border-radius: 0 !important;
    color: var(--epf-ink, #0F172A) !important;
    font-size: 15px !important;
    line-height: 1.2 !important;
    box-shadow: none !important;
}

.epf-property-filter-field select:focus,
.epf-property-filter-field select:focus-visible {
    outline: 2px solid var(--epf-primary, #00DCFF) !important;
    outline-offset: 1px !important;
    border-color: var(--epf-primary, #00DCFF) !important;
}

.epf-property-filter-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
    min-width: 0 !important;
}

.epf-property-filter-submit,
.epf-property-filter-reset {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 9px 12px !important;
    border-radius: 0 !important;
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    text-align: center !important;
    text-decoration: none !important;
    border-bottom: none !important;
    cursor: pointer !important;
}

.epf-property-filter-submit {
    background: var(--epf-secondary, #004F4D) !important;
    border: 1px solid var(--epf-secondary, #004F4D) !important;
}

.epf-property-filter-submit:hover,
.epf-property-filter-submit:focus,
.epf-property-filter-submit:focus-visible {
    background: #000000 !important;
    border-color: #000000 !important;
}

.epf-property-filter-reset {
    background: var(--epf-btn-neutral, #555555) !important;
    border: 1px solid var(--epf-btn-neutral, #555555) !important;
}

.epf-property-filter-reset:hover,
.epf-property-filter-reset:focus,
.epf-property-filter-reset:focus-visible {
    background: var(--epf-btn-neutral-hover, #000000) !important;
    border-color: var(--epf-btn-neutral-hover, #000000) !important;
    color: #ffffff !important;
}

@media (max-width: 1024px) {
    .epf-property-filter-inner {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 767px) {
    .epf-property-filter {
        margin: 18px auto 20px !important;
        padding: 0 !important;
    }

    .epf-property-filter-inner {
        grid-template-columns: 1fr !important;
        padding: 16px !important;
    }

    .epf-property-filter-actions {
        grid-template-columns: 1fr !important;
    }
}

/* =========================================================
   Phase 8.1 – Filter Design Fix + Layout Harmonisierung
   ========================================================= */

/* Abstand zwischen Filter und Karten reduzieren */
body:not(.wp-admin) .epf-property-filter + .epf-property-list-wrap {
    margin-top: 0 !important;
}

/* Filter-Wrapper */
body:not(.wp-admin) .epf-property-filter {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 18px auto 24px !important;
    padding: 0 !important;
    font-family: "Roboto", system-ui, -apple-system, "Segoe UI", Arial, sans-serif !important;
}

/* Filter-Karte */
body:not(.wp-admin) .epf-property-filter-inner {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) auto !important;
    gap: 14px !important;
    align-items: end !important;
    width: 100% !important;
    padding: 18px !important;
    background: var(--epf-card-bg, #F3F4F6) !important;
    border: 1px solid var(--epf-border, #00DCFF) !important;
    border-radius: 0 !important;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08) !important;
}

/* Felder */
body:not(.wp-admin) .epf-property-filter-field {
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

body:not(.wp-admin) .epf-property-filter-field label {
    display: block !important;
    margin: 0 0 7px !important;
    padding: 0 !important;
    color: var(--epf-secondary, #004F4D) !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.07em !important;
}

/* Selects hart gegen Browser-/Theme-Defaults */
body:not(.wp-admin) .epf-property-filter-field select {
    appearance: none !important;
    -webkit-appearance: none !important;
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 46px !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 0 42px 0 12px !important;
    color: var(--epf-ink, #0F172A) !important;
    background-color: #ffffff !important;
    background-image:
        linear-gradient(45deg, transparent 50%, var(--epf-secondary, #004F4D) 50%),
        linear-gradient(135deg, var(--epf-secondary, #004F4D) 50%, transparent 50%);
    background-position:
        calc(100% - 18px) 19px,
        calc(100% - 12px) 19px;
    background-size: 6px 6px, 6px 6px;
    background-repeat: no-repeat;
    border: 1px solid rgba(0, 79, 77, 0.28) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-family: "Roboto", system-ui, -apple-system, "Segoe UI", Arial, sans-serif !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    line-height: 46px !important;
}

body:not(.wp-admin) .epf-property-filter-field select:focus,
body:not(.wp-admin) .epf-property-filter-field select:focus-visible {
    outline: 2px solid var(--epf-primary, #00DCFF) !important;
    outline-offset: 1px !important;
    border-color: var(--epf-primary, #00DCFF) !important;
}

/* Actions */
body:not(.wp-admin) .epf-property-filter-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
    align-items: end !important;
    min-width: 250px !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Buttons */
body:not(.wp-admin) .epf-property-filter-submit,
body:not(.wp-admin) .epf-property-filter-reset {
    appearance: none !important;
    -webkit-appearance: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 46px !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 0 14px !important;
    border-radius: 0 !important;
    color: #ffffff !important;
    font-family: "Roboto", system-ui, -apple-system, "Segoe UI", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    text-align: center !important;
    text-decoration: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
    cursor: pointer !important;
}

body:not(.wp-admin) .epf-property-filter-submit {
    background: var(--epf-secondary, #004F4D) !important;
    border: 1px solid var(--epf-secondary, #004F4D) !important;
}

body:not(.wp-admin) .epf-property-filter-submit:hover,
body:not(.wp-admin) .epf-property-filter-submit:focus,
body:not(.wp-admin) .epf-property-filter-submit:focus-visible {
    background: #000000 !important;
    border-color: #000000 !important;
    color: #ffffff !important;
}

body:not(.wp-admin) .epf-property-filter-reset {
    background: var(--epf-btn-neutral, #555555) !important;
    border: 1px solid var(--epf-btn-neutral, #555555) !important;
}

body:not(.wp-admin) .epf-property-filter-reset:hover,
body:not(.wp-admin) .epf-property-filter-reset:focus,
body:not(.wp-admin) .epf-property-filter-reset:focus-visible {
    background: var(--epf-btn-neutral-hover, #000000) !important;
    border-color: var(--epf-btn-neutral-hover, #000000) !important;
    color: #ffffff !important;
}

/* Karten optisch wieder etwas ruhiger */
body:not(.wp-admin) .epf-property-card {
    background: #F3F4F6 !important;
    border: 1px solid var(--epf-border, #00DCFF) !important;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08) !important;
}

body:not(.wp-admin) .epf-property-card:hover {
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.12) !important;
}

body:not(.wp-admin) .epf-property-meta-item {
    background: #ffffff !important;
    border: 1px solid rgba(0, 79, 77, 0.14) !important;
}

/* Buttons am Kartenende sicher sichtbar halten */
body:not(.wp-admin) .epf-property-action {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin-top: auto !important;
    padding-top: 12px !important;
}

/* Tablet */
@media (max-width: 1024px) {
    body:not(.wp-admin) .epf-property-filter-inner {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    body:not(.wp-admin) .epf-property-filter-actions {
        min-width: 0 !important;
    }
}

/* Mobile */
@media (max-width: 767px) {
    body:not(.wp-admin) .epf-property-filter {
        margin: 28px auto 22px !important;
        padding: 0 14px !important;
    }

    body:not(.wp-admin) .epf-property-filter-inner {
        grid-template-columns: 1fr !important;
        gap: 13px !important;
        padding: 16px !important;
    }

    body:not(.wp-admin) .epf-property-filter-actions {
        grid-template-columns: 1fr !important;
        min-width: 0 !important;
    }

    body:not(.wp-admin) .epf-property-action {
        grid-template-columns: 1fr !important;
    }
}


/* ---------------------------------------------------------
   v1.0.1 / Theme v2.0.11 – shortcode width and category intro alignment
   --------------------------------------------------------- */

body:not(.wp-admin) .ml-property-shortcode-wrap {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

body:not(.wp-admin) main#content.montenegro-listings-page .ml-listings-intro-text {
    text-align: center !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

body:not(.wp-admin) .ml-property-shortcode-wrap .epf-property-filter,
body:not(.wp-admin) .ml-property-shortcode-wrap .epf-property-list-wrap {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* ---------------------------------------------------------
   Pagination
   --------------------------------------------------------- */

body:not(.wp-admin) .epf-property-button-details {
    position: relative !important;
    z-index: 5 !important;
    pointer-events: auto !important;
}

body:not(.wp-admin) .epf-pagination {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    margin: 30px auto 0 !important;
}

body:not(.wp-admin) .epf-pagination-link,
body:not(.wp-admin) .epf-pagination-link:link,
body:not(.wp-admin) .epf-pagination-link:visited {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 40px !important;
    min-height: 40px !important;
    padding: 8px 13px !important;
    background: #ffffff !important;
    border: 1px solid var(--epf-border, #00DCFF) !important;
    color: var(--epf-ink, #004F4D) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

body:not(.wp-admin) .epf-pagination-link:hover,
body:not(.wp-admin) .epf-pagination-link:focus,
body:not(.wp-admin) .epf-pagination-link:focus-visible,
body:not(.wp-admin) .epf-pagination-current,
body:not(.wp-admin) .epf-pagination-link.epf-pagination-current,
body:not(.wp-admin) .epf-pagination-link.active,
body:not(.wp-admin) .epf-pagination-link.is-active,
body:not(.wp-admin) .epf-pagination-link[aria-current="page"],
body:not(.wp-admin) .epf-pagination-link.current,
body:not(.wp-admin) .epf-pagination-link[disabled],
body:not(.wp-admin) .epf-pagination .current,
body:not(.wp-admin) .epf-pagination .active,
body:not(.wp-admin) .epf-pagination [aria-current="page"],
body:not(.wp-admin) .epf-pagination .page-numbers.current {
    background: var(--epf-btn-neutral, #555555) !important;
    border-color: var(--epf-btn-neutral, #555555) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

body:not(.wp-admin) .epf-pagination-prev,
body:not(.wp-admin) .epf-pagination-next {
    min-width: 96px !important;
}

/* ---------------------------------------------------------
   v0.3.3 click-safety and English list labels
   --------------------------------------------------------- */

body:not(.wp-admin) .epf-property-card[data-epf-detail-url] {
    cursor: pointer !important;
}

body:not(.wp-admin) .epf-property-image,
body:not(.wp-admin) .epf-property-title a,
body:not(.wp-admin) .epf-property-button-details {
    position: relative !important;
    z-index: 10 !important;
    pointer-events: auto !important;
}

body:not(.wp-admin) .epf-property-button-whatsapp {
    position: relative !important;
    z-index: 11 !important;
    pointer-events: auto !important;
}

/* ---------------------------------------------------------
   v0.3.5 form-based navigation hardening
   --------------------------------------------------------- */

body:not(.wp-admin) .epf-property-open-form,
body:not(.wp-admin) .epf-pagination-form {
    display: contents !important;
    margin: 0 !important;
    padding: 0 !important;
}

body:not(.wp-admin) .epf-property-image-button,
body:not(.wp-admin) .epf-property-title-button,
body:not(.wp-admin) button.epf-property-button-details,
body:not(.wp-admin) button.epf-pagination-link {
    appearance: none !important;
    -webkit-appearance: none !important;
    cursor: pointer !important;
    font-family: inherit !important;
    text-align: inherit !important;
}

body:not(.wp-admin) .epf-property-image-button {
    padding: 0 !important;
    border: 0 !important;
    color: inherit !important;
}

body:not(.wp-admin) .epf-property-title-button {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    color: var(--epf-ink) !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    text-decoration: none !important;
}

body:not(.wp-admin) .epf-property-title-button:hover,
body:not(.wp-admin) .epf-property-title-button:focus,
body:not(.wp-admin) .epf-property-title-button:focus-visible {
    color: var(--epf-primary-dark) !important;
    outline: none !important;
}

body:not(.wp-admin) button.epf-property-button-details {
    width: 100% !important;
}

body:not(.wp-admin) button.epf-pagination-link {
    margin: 0 !important;
}

body:not(.wp-admin) button.epf-pagination-link.epf-pagination-current,
body:not(.wp-admin) button.epf-pagination-link.active,
body:not(.wp-admin) button.epf-pagination-link.is-active,
body:not(.wp-admin) button.epf-pagination-link.current,
body:not(.wp-admin) button.epf-pagination-link[disabled],
body:not(.wp-admin) button.epf-pagination-link[aria-current="page"] {
    background: var(--epf-btn-neutral, #555555) !important;
    border-color: var(--epf-btn-neutral, #555555) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


/* ---------------------------------------------------------
   v2.0.12 – EPF status badge hardening
   Purpose: force property status labels from the shortcode layer to the
   Montenegro Listings turquoise/grey badge system even when the EPF plugin
   prints additional status classes.
   --------------------------------------------------------- */

body:not(.wp-admin) .ml-property-shortcode-wrap .epf-property-card .epf-property-image .epf-property-status-badge,
body:not(.wp-admin) .epf-property-list-wrap .epf-property-card .epf-property-image .epf-property-status-badge,
body:not(.wp-admin) .epf-property-list-wrap .epf-property-status-badge,
body:not(.wp-admin) .ml-property-shortcode-wrap .epf-property-status-badge,
body:not(.wp-admin) .epf-property-list-wrap [class*="status"][class*="badge"],
body:not(.wp-admin) .ml-property-shortcode-wrap [class*="status"][class*="badge"],
body:not(.wp-admin) .epf-property-list-wrap [class*="status"][class*="label"],
body:not(.wp-admin) .ml-property-shortcode-wrap [class*="status"][class*="label"] {
    background: #00DCFF !important;
    background-color: #00DCFF !important;
    border: 1px solid #333333 !important;
    border-color: #333333 !important;
    color: #0F172A !important;
    -webkit-text-fill-color: #0F172A !important;
    box-shadow: none !important;
}


/* Montenegro Listings detail URL fallback — v2.0.15
   If a property detail view is opened inside a category page via URLs such as
   /apartments/?epf_property=35172&epf_type=apartments, hide all page framing
   and keep only the shortcode/detail output visible. */
body.ml-is-property-detail main.montenegro-listings-page.ml-category-page > section:not(.ml-shortcode-section),
html.ml-is-property-detail main.montenegro-listings-page.ml-category-page > section:not(.ml-shortcode-section) {
  display: none !important;
}

body.ml-is-property-detail main.montenegro-listings-page.ml-category-page .ml-shortcode-section,
html.ml-is-property-detail main.montenegro-listings-page.ml-category-page .ml-shortcode-section {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

body.ml-is-property-detail main.montenegro-listings-page.ml-category-page .ml-shortcode-section > .ek-container > h2,
body.ml-is-property-detail main.montenegro-listings-page.ml-category-page .ml-shortcode-section > .ek-container > .ml-listings-intro-text,
html.ml-is-property-detail main.montenegro-listings-page.ml-category-page .ml-shortcode-section > .ek-container > h2,
html.ml-is-property-detail main.montenegro-listings-page.ml-category-page .ml-shortcode-section > .ek-container > .ml-listings-intro-text {
  display: none !important;
}

body.ml-is-property-detail .ml-property-shortcode-wrap,
html.ml-is-property-detail .ml-property-shortcode-wrap {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.ml-is-property-detail .ml-property-detail-only,
html.ml-is-property-detail .ml-property-detail-only {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}