.elementor-5849 .elementor-element.elementor-element-6d31126{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-5849 .elementor-element.elementor-element-95c1621{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:stretch;}.elementor-5849 .elementor-element.elementor-element-7c3976a > .elementor-widget-container > .jet-listing-grid > .jet-listing-grid__items, .elementor-5849 .elementor-element.elementor-element-7c3976a > .jet-listing-grid > .jet-listing-grid__items{--columns:1;}.elementor-5849 .elementor-element.elementor-element-7c3976a{width:100%;max-width:100%;top:0px;}body:not(.rtl) .elementor-5849 .elementor-element.elementor-element-7c3976a{left:0px;}body.rtl .elementor-5849 .elementor-element.elementor-element-7c3976a{right:0px;}:root{--page-title-display:none;}@media(max-width:767px){body:not(.rtl) .elementor-5849 .elementor-element.elementor-element-7c3976a{left:3px;}body.rtl .elementor-5849 .elementor-element.elementor-element-7c3976a{right:3px;}.elementor-5849 .elementor-element.elementor-element-7c3976a{top:2px;}}/* Start custom CSS *//* =========================================================
   ELEVA INTERACTIVE SITEPLAN - FINAL CLEAN CSS
   Hapus semua CSS siteplan lama, lalu pakai CSS ini saja.
========================================================= */


/* =========================================================
   1. MATIKAN MARKER LAMA
========================================================= */

.siteplan-marker,
button.siteplan-marker {
  display: none !important;
}


/* =========================================================
   2. WRAPPER UTAMA SITEPLAN
   Class pada container utama: eleva-siteplan-wrap
========================================================= */

.eleva-siteplan-wrap,
.eleva-siteplan-wrap.e-con,
.elementor .eleva-siteplan-wrap {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  max-width: 1400px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  min-height: 0 !important;
  line-height: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
}

.eleva-siteplan-wrap > .e-con-inner,
.elementor .eleva-siteplan-wrap > .e-con-inner {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  line-height: 0 !important;
  overflow: hidden !important;
}


/* =========================================================
   3. GAMBAR SITEPLAN
   Class pada Image Widget: eleva-siteplan-image
========================================================= */

.eleva-siteplan-image,
.eleva-siteplan-image.elementor-widget,
.elementor .eleva-siteplan-image {
  position: relative !important;
  z-index: 1 !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 0 !important;
}

.eleva-siteplan-image .elementor-widget-container,
.eleva-siteplan-image img,
.elementor .eleva-siteplan-image img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  vertical-align: top !important;
  line-height: 0 !important;
}


/* =========================================================
   4. SHORTCODE WIDGET SEBAGAI LAYER MARKER
   Class pada Shortcode Widget: eleva-marker-layer
========================================================= */

.eleva-marker-layer,
.eleva-marker-layer.elementor-widget,
.elementor .eleva-marker-layer {
  position: absolute !important;
  inset: 0 !important;
  z-index: 30 !important;

  display: block !important;
  width: 100% !important;
  height: 100% !important;

  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;

  line-height: 0 !important;
  overflow: visible !important;
  background: transparent !important;

  pointer-events: none !important;
}

.eleva-marker-layer .elementor-widget-container {
  position: static !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;

  margin: 0 !important;
  padding: 0 !important;

  line-height: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}


/* =========================================================
   5. MARKER DINAMIS UNIT KAVLING
   Data dari post:
   Drone X      -> --x
   Drone Y      -> --y
   Drone Width  -> --w
   Drone Height -> --h
   Drone Rotate -> --rot
========================================================= */

.eleva-marker-layer .eleva-lot-marker,
.eleva-marker-layer button.eleva-lot-marker {
  position: absolute !important;

  left: var(--x, 50%) !important;
  top: var(--y, 50%) !important;

  width: var(--w, 2.08%) !important;
  height: var(--h, 6.95%) !important;

  transform: rotate(var(--rot, 0deg)) !important;
  transform-origin: top left !important;

  z-index: 80 !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;

  background: #c98b22 !important;
  border: 1px solid #ffffff !important;
  border-radius: 0 !important;

  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  text-decoration: none !important;
  text-indent: 0 !important;
  white-space: nowrap !important;
  overflow: visible !important;

  cursor: pointer !important;
  pointer-events: auto !important;

  box-shadow: none !important;
  outline: none !important;

  appearance: none !important;
  -webkit-appearance: none !important;

  transition: filter 0.12s ease, opacity 0.12s ease !important;
}

.eleva-marker-layer .eleva-lot-marker:hover,
.eleva-marker-layer button.eleva-lot-marker:hover {
  filter: brightness(1.08) !important;
}


/* =========================================================
   6. LABEL NOMOR KAVLING
========================================================= */

.eleva-marker-layer .eleva-lot-marker::before,
.eleva-marker-layer button.eleva-lot-marker::before {
  content: attr(data-label) !important;

  position: absolute !important;
  left: 50% !important;
  top: 50% !important;

  transform: translate(-50%, -50%) !important;

  display: block !important;

  color: #ffffff !important;
  font-family: Arial, sans-serif !important;
  font-size: clamp(7px, 0.48vw, 10px) !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: -0.2px !important;
  text-align: center !important;
  white-space: nowrap !important;

  opacity: 1 !important;
  visibility: visible !important;
  z-index: 90 !important;
  pointer-events: none !important;
}


/* =========================================================
   7. WARNA MARKER BERDASARKAN STATUS UNIT
========================================================= */

/* TERSEDIA = HIJAU */
.eleva-marker-layer .eleva-lot-marker.status-tersedia,
.eleva-marker-layer .eleva-lot-marker[data-status="tersedia"],
.eleva-marker-layer .eleva-lot-marker[data-status="Tersedia"] {
  background: #2e7d32 !important;
  border-color: #ffffff !important;
}

/* BOOKING = OREN */
.eleva-marker-layer .eleva-lot-marker.status-booking,
.eleva-marker-layer .eleva-lot-marker[data-status="booking"],
.eleva-marker-layer .eleva-lot-marker[data-status="Booking"] {
  background: #c98b22 !important;
  border-color: #ffffff !important;
}

/* KEEP = ABU-ABU */
.eleva-marker-layer .eleva-lot-marker.status-keep,
.eleva-marker-layer .eleva-lot-marker[data-status="keep"],
.eleva-marker-layer .eleva-lot-marker[data-status="Keep"] {
  background: #8c8c8c !important;
  border-color: #ffffff !important;
}

/* SOLD / TERJUAL = MERAH */
.eleva-marker-layer .eleva-lot-marker.status-sold,
.eleva-marker-layer .eleva-lot-marker.status-terjual,
.eleva-marker-layer .eleva-lot-marker[data-status="sold"],
.eleva-marker-layer .eleva-lot-marker[data-status="Sold"],
.eleva-marker-layer .eleva-lot-marker[data-status="terjual"],
.eleva-marker-layer .eleva-lot-marker[data-status="Terjual"] {
  background: #b44735 !important;
  border-color: #ffffff !important;
}


/* =========================================================
   8. STATUS KOSONG / TIDAK TERBACA
   Default oren agar tetap terlihat
========================================================= */

.eleva-marker-layer .eleva-lot-marker:not([data-status]),
.eleva-marker-layer .eleva-lot-marker[data-status=""] {
  background: #c98b22 !important;
  border-color: #ffffff !important;
}


/* =========================================================
   9. FIX KHUSUS A-7
   A7 horizontal. Ukuran dasar tetap bisa dibaca dari post.
========================================================= */

.eleva-marker-layer .eleva-lot-marker[data-code="A-7"],
.eleva-marker-layer .eleva-lot-marker[data-code="A7"] {
  width: var(--w, 5.55%) !important;
  height: var(--h, 3.35%) !important;
  transform: rotate(var(--rot, 0deg)) !important;
  transform-origin: top left !important;
}

.eleva-marker-layer .eleva-lot-marker[data-code="A-7"]::before,
.eleva-marker-layer .eleva-lot-marker[data-code="A7"]::before {
  content: attr(data-label) !important;
}


/* =========================================================
   10. FIX FINAL KHUSUS G-10
   Posisi G10 dibuat eksplisit agar tidak kacau karena bentuknya khusus.
========================================================= */

.eleva-marker-layer .eleva-lot-marker[data-code="G-10"],
.eleva-marker-layer .eleva-lot-marker[data-code="G10"] {
  left: 66.72% !important;
  top: 76.98% !important;

  width: 3.65% !important;
  height: 3.42% !important;

  transform: rotate(0deg) !important;
  transform-origin: top left !important;

  clip-path: none !important;
  -webkit-clip-path: none !important;

  border: 1px solid #ffffff !important;
  border-radius: 0 !important;
  box-sizing: border-box !important;
  overflow: visible !important;
  z-index: 90 !important;
}

.eleva-marker-layer .eleva-lot-marker[data-code="G-10"]::before,
.eleva-marker-layer .eleva-lot-marker[data-code="G10"]::before {
  content: "G10" !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
}


/* =========================================================
   11. RESPONSIVE MOBILE - FULL SITEPLAN TANPA SCROLL HORIZONTAL
   Siteplan tetap tampil penuh satu gambar di mobile
========================================================= */

@media (max-width: 767px) {

  .eleva-siteplan-wrap,
  .eleva-siteplan-wrap.e-con,
  .elementor .eleva-siteplan-wrap {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    margin: 0 auto !important;
    padding: 0 !important;
  }

  .eleva-siteplan-wrap > .e-con-inner,
  .elementor .eleva-siteplan-wrap > .e-con-inner {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .eleva-siteplan-image,
  .eleva-siteplan-image.elementor-widget,
  .elementor .eleva-siteplan-image {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .eleva-siteplan-image .elementor-widget-container,
  .eleva-siteplan-image img,
  .elementor .eleva-siteplan-image img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .eleva-marker-layer,
  .eleva-marker-layer.elementor-widget,
  .elementor .eleva-marker-layer {
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    overflow: visible !important;
  }

  .eleva-marker-layer .elementor-widget-container {
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    overflow: visible !important;
  }

  .eleva-marker-layer .eleva-lot-marker,
  .eleva-marker-layer button.eleva-lot-marker {
    border-width: 0.55px !important;
    overflow: visible !important;
  }

  .eleva-marker-layer .eleva-lot-marker::before,
  .eleva-marker-layer button.eleva-lot-marker::before {
    font-size: clamp(3.8px, 1.02vw, 5.8px) !important;
    letter-spacing: -0.45px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    transform: translate(-50%, -50%) scale(0.88) !important;
    transform-origin: center center !important;
  }

  /* Label khusus kavling panjang */
  .eleva-marker-layer .eleva-lot-marker[data-code="G-10"]::before,
  .eleva-marker-layer .eleva-lot-marker[data-code="G10"]::before {
    font-size: clamp(3.6px, 0.95vw, 5.3px) !important;
    letter-spacing: -0.5px !important;
    transform: translate(-50%, -50%) scale(0.86) !important;
  }

  .eleva-marker-layer .eleva-lot-marker[data-code="A-7"]::before,
  .eleva-marker-layer .eleva-lot-marker[data-code="A7"]::before {
    font-size: clamp(4.5px, 1.05vw, 5.8px) !important;
    letter-spacing: -0.35px !important;
    transform: translate(-50%, -50%) scale(0.9) !important;
  }
}
/* =========================================================
   MARKER AKTIF SAAT DIKLIK
   Marker berubah biru dan tetap aktif
========================================================= */

.eleva-lot-marker.is-selected-unit,
.eleva-lot-marker.is-selected-unit:hover,
.eleva-lot-marker.is-selected-unit:focus {
  background: #2563eb !important;
  background-color: #2563eb !important;
  color: #ffffff !important;
  border-color: #ffffff !important;
  z-index: 998 !important;
  box-shadow:
    0 0 0 2px #ffffff,
    0 0 0 6px rgba(37, 99, 235, 0.42),
    0 8px 20px rgba(37, 99, 235, 0.45) !important;
}

.eleva-lot-marker.is-selected-unit::before {
  color: #ffffff !important;
}

/* Marker ungu saat tombol Tunjukkan di peta diklik dari popup */
.eleva-lot-marker.is-active-unit,
.eleva-lot-marker.is-active-unit:hover,
.eleva-lot-marker.is-active-unit:focus {
  background: #d8b4fe !important;
  background-color: #d8b4fe !important;
  color: #3b0764 !important;
  border-color: #ffffff !important;
  z-index: 999 !important;
  box-shadow:
    0 0 0 3px #ffffff,
    0 0 0 7px rgba(216, 180, 254, 0.78),
    0 10px 24px rgba(88, 28, 135, 0.38) !important;
}/* End custom CSS */