.elementor-17 .elementor-element.elementor-element-327fe9e9{--display:flex;--min-height:100vh;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:stretch;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-17 .elementor-element.elementor-element-6457701c{--display:flex;}.elementor-17 .elementor-element.elementor-element-6457701c.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-17 .elementor-element.elementor-element-2e1ec00{--display:flex;--min-height:100vh;--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;--gap:20px 0px;--row-gap:20px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-17 .elementor-element.elementor-element-2e1ec00:not(.elementor-motion-effects-element-type-background), .elementor-17 .elementor-element.elementor-element-2e1ec00 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-ed58931 );}.elementor-17 .elementor-element.elementor-element-427d452{--display:flex;border-style:none;--border-style:none;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:24px;--padding-bottom:12px;--padding-left:40px;--padding-right:40px;--z-index:5;}.elementor-17 .elementor-element.elementor-element-427d452:not(.elementor-motion-effects-element-type-background), .elementor-17 .elementor-element.elementor-element-427d452 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-ed58931 );}.elementor-17 .elementor-element.elementor-element-a5c9c59{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;--gap:0px 40px;--row-gap:0px;--column-gap:40px;}.elementor-17 .elementor-element.elementor-element-a5c9c59:not(.elementor-motion-effects-element-type-background), .elementor-17 .elementor-element.elementor-element-a5c9c59 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-ed58931 );}.elementor-17 .elementor-element.elementor-element-12b699e{--display:flex;--gap:4px 0px;--row-gap:4px;--column-gap:0px;}.elementor-17 .elementor-element.elementor-element-9cb4b85{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-17 .elementor-element.elementor-element-ac03c24{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );letter-spacing:var( --e-global-typography-text-letter-spacing );}.elementor-17 .elementor-element.elementor-element-e4e899a{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:flex-end;--align-items:center;--gap:0px 16px;--row-gap:0px;--column-gap:16px;}.elementor-17 .elementor-element.elementor-element-8f5f5b8 .e-search-input{font-family:"Plus Jakarta Sans", Sans-serif;font-size:0.925rem;font-weight:400;line-height:1.48em;border-style:solid;border-width:1px 1px 1px 1px;border-color:#DEDFE3;border-radius:999px 999px 999px 999px;}.elementor-17 .elementor-element.elementor-element-8f5f5b8{--e-search-placeholder-color:var( --e-global-color-bb716eb );--e-search-input-color:var( --e-global-color-bb716eb );--e-search-icon-label-color:#02010100;--e-search-input-padding-block-start:12px;--e-search-input-padding-inline-start:18px;--e-search-input-padding-block-end:12px;--e-search-input-padding-inline-end:18px;--e-search-icon-label-size:15px;--e-search-input-gap:8px;}.elementor-17 .elementor-element.elementor-element-31a9f4b.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-17 .elementor-element.elementor-element-48b48b0{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:24px;--padding-left:40px;--padding-right:40px;}.elementor-17 .elementor-element.elementor-element-e35f2c2{--grid-columns:3;}.elementor-17 .elementor-element.elementor-element-e35f2c2 .elementor-loop-container{grid-auto-rows:1fr;}.elementor-17 .elementor-element.elementor-element-e35f2c2 .e-loop-item > .elementor-section, .elementor-17 .elementor-element.elementor-element-e35f2c2 .e-loop-item > .elementor-section > .elementor-container, .elementor-17 .elementor-element.elementor-element-e35f2c2 .e-loop-item > .e-con, .elementor-17 .elementor-element.elementor-element-e35f2c2 .e-loop-item .elementor-section-wrap  > .e-con{height:100%;}@media(max-width:1366px){.elementor-17 .elementor-element.elementor-element-ac03c24{line-height:var( --e-global-typography-text-line-height );letter-spacing:var( --e-global-typography-text-letter-spacing );}}@media(min-width:768px){.elementor-17 .elementor-element.elementor-element-6457701c{--width:260px;}.elementor-17 .elementor-element.elementor-element-2e1ec00{--content-width:1200px;}}@media(max-width:1024px) and (min-width:768px){.elementor-17 .elementor-element.elementor-element-327fe9e9{--width:100%;}}@media(min-width:2400px){.elementor-17 .elementor-element.elementor-element-ac03c24{line-height:var( --e-global-typography-text-line-height );letter-spacing:var( --e-global-typography-text-letter-spacing );}}@media(max-width:1024px){.elementor-17 .elementor-element.elementor-element-327fe9e9{--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-17 .elementor-element.elementor-element-ac03c24{line-height:var( --e-global-typography-text-line-height );letter-spacing:var( --e-global-typography-text-letter-spacing );}.elementor-17 .elementor-element.elementor-element-e35f2c2{--grid-columns:2;}}@media(max-width:767px){.elementor-17 .elementor-element.elementor-element-327fe9e9{--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-17 .elementor-element.elementor-element-ac03c24{line-height:var( --e-global-typography-text-line-height );letter-spacing:var( --e-global-typography-text-letter-spacing );}.elementor-17 .elementor-element.elementor-element-e35f2c2{--grid-columns:1;}}/* Start custom CSS for loop-grid, class: .elementor-element-e35f2c2 *//* =========================================================
   BLOG CARD — Equal height: keep footer at bottom, gap above it
   ========================================================= */

/* Card fills the loop item */
.el-post-card{
  height: 100% !important;
}

/* Elementor wrapper is the real flex column parent */
.el-post-card > .e-con-inner{
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
}

/* Wrapper that contains body + footer should take remaining space */
.el-post-card .elementor-element-1733d1f{
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
}

/* Body absorbs extra height */
.el-post-body{
  flex: 1 1 auto !important;
  min-height: 0 !important;
}

/* Footer pinned to bottom + prevent Elementor stretch */
.el-post-footer{
  margin-top: auto !important;
  flex: 0 0 auto !important;
  height: auto !important;
  --container-widget-height: initial !important;
  --container-widget-flex-grow: 0 !important;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-327fe9e9 *//* =========================================================
   ELEVATED LISTINGS — FRONTEND ADMIN MODAL CSS
   =========================================================
   Structure:
   - LAYOUT VARIABLES — Easy-to-update measurements
   - MODAL OVERLAY — Full-screen backdrop
   - MODAL CARD — White container box
   - MODAL INNER — Layout wrapper
   - SCROLL CONTAINER — Scrollable area
   - FORM FIELDS CONTAINER — Holds all fields
   - FORM — Fill container height
   - CLOSE BUTTON — Position fix
   - HEADER — Sticky title area
   - HEADER TYPOGRAPHY — Title and subtitle styling
   - TABS — Sticky navigation
   - FOOTER — Sticky submit button
   - FORM FIELDS PADDING — Consistent spacing
   - FORM INPUTS — Base styling
   - FORM INPUTS — Placeholder styling
   - FORM INPUTS — Focus state
   - FORM INPUTS — Overflow fix
   - FIELD LABELS — Typography
   - FIELD DESCRIPTIONS — Helper text
   - TRUE/FALSE TOGGLE — Switch styling
   - SECTION HEADINGS — Message field dividers
   - REPEATER FIELDS — Table layout, inputs, buttons
   - WYSIWYG FIELDS — Editor container, toolbar, buttons
   - WYSIWYG LINK TOOLBAR — Insert/edit link popup
   - WP LINK MODAL — Full link options modal
   - PREPEND & APPEND INPUTS — Global fix for ACF prefix/suffix
   - PRICE FIELD — $ prefix
   - LIVING AREA FIELD — Sq.Ft suffix
   - SELECT2 — Custom dropdown styling
   - NATIVE SELECT — Dropdown arrow
   - FIELD LAYOUTS — Pairs and groups
   - SCROLLBAR — Custom styling
   - RESPONSIVE — Tablet and mobile
   ========================================================= */


/* ===== LAYOUT VARIABLES — Update these after styling ===== */
:root {
    /* Header height for sticky tabs */
    --el-fea-header-height-desktop: 99px;  /* Default: short subtitle (1 line) */
    --el-fea-header-height-mobile: 120px;  /* Default: wrapped subtitle (2 lines) */

    /* Padding variables */
    --el-fea-modal-padding-x: 24px;
    --el-fea-header-padding-y: 24px;
    --el-fea-footer-padding-y: 20px;
    --el-fea-field-padding-y: 12px;
}

/* =========================================================
   HEADER HEIGHT MANAGEMENT
   =========================================================
   
   Default: 99px (desktop), 120px (mobile ≤439px)
   
   Add class to the MESSAGE FIELD header ONLY when needed:
   
   - "el-fea-short-subtitle" — subtitle short, doesn't wrap on mobile
     Used for: Edit Listing Form (EXCEPTION to default)
   
   Most forms don't need any class - default works!
   ========================================================= */

/* ===== SMALL MOBILE — Default behavior (wrapping subtitle) ===== */
@media (max-width: 439px) {
    :root {
        --el-fea-header-height-desktop: var(--el-fea-header-height-mobile);
    }
    
    /* EXCEPTION: Short subtitles that DON'T wrap on mobile */
    .fea-modal.edit-modal:has(.acf-field-message.el-fea-short-subtitle) {
        --el-fea-header-height-desktop: 99px;
    }
}


/* ===== MODAL OVERLAY — Full-screen fixed backdrop ===== */
.fea-modal.edit-modal {
    position: fixed !important;
    inset: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    background: rgba(0, 0, 0, 0.5);
    z-index: 9999;
    /* DO NOT set display here — plugin controls open/close */
}

/* Only apply flex centering when plugin opens the modal */
.fea-modal.edit-modal[style*="display: block"],
.fea-modal.edit-modal[style*="display:block"] {
    display: flex !important;
}


/* ===== MODAL CARD — White container box ===== */
.fea-modal.edit-modal .fea-modal-content {
    width: 850px !important;
    max-width: 100% !important;
    height: 90vh !important;
    max-height: 810px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 24px;
    background: #FFFFFF;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    overflow: hidden;
}


/* ===== MODAL INNER — Layout wrapper ===== */
.fea-modal.edit-modal .fea-modal-inner {
    height: 100%;
    display: flex;
    flex-direction: column;
    position: relative;
}


/* ===== SCROLL CONTAINER — Scrollable area ===== */
.fea-modal.edit-modal .content-container {
    flex: 1 1 auto;
    overflow-y: auto;
    overflow-x: hidden;
    min-height: 0;
}


/* ===== FORM FIELDS CONTAINER — Holds all fields ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields {
    display: flex !important;
    flex-direction: column !important;
    min-height: 100% !important;
    flex: 1 1 auto !important;
}


/* ===== FORM — Fill container height ===== */
.fea-modal.edit-modal .content-container form.frontend-form {
    display: flex !important;
    flex-direction: column !important;
    min-height: 100% !important;
    flex: 1 1 auto !important;
}


/* ===== CLOSE BUTTON — Position and functionality fix ===== */
.fea-modal.edit-modal .fea-close {
    position: absolute !important;
    top: 20px;
    right: 20px;
    z-index: 500;
    cursor: pointer;
}


/* =========================================================
   IMPORTANT: When creating new FEA forms, add this class
   to the first Message field (the header field):
   
   Wrapper CSS Class: el-fea-modal-header
   
   This ensures the header is sticky and properly styled.
   ========================================================= */

/* ===== HEADER — Sticky title and subtitle ===== */
.fea-modal.edit-modal .acf-field-message.el-fea-modal-header {
    position: sticky;
    top: 0;
    z-index: 400;
    background: #FFFFFF;
    margin: 0;
    padding: var(--el-fea-header-padding-y) var(--el-fea-modal-padding-x);
    padding-right: 60px;
    border-bottom: 1px solid #DEDFE3;
}


/* ===== HEADER TYPOGRAPHY — Title and subtitle styling ===== */
.fea-modal.edit-modal .acf-field-message.el-fea-modal-header .acf-label {
    margin: 0 0 4px 0 !important;
}

.fea-modal.edit-modal .acf-field-message.el-fea-modal-header .acf-label label {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 600 !important;
    font-size: 1.25rem !important;
    line-height: 1.28em !important;
    letter-spacing: 0 !important;
    color: #000831 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.fea-modal.edit-modal .acf-field-message.el-fea-modal-header .acf-input .acf-message {
    font-size: 0.875rem !important;
    line-height: 1.48em !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ===== TABS — Sticky navigation under header ===== */
.fea-modal.edit-modal .acf-tab-wrap {
    position: sticky;
    top: var(--el-fea-header-height-desktop);
    z-index: 390;
    background: #FFFFFF;
    margin: 0;
    padding: 24px var(--el-fea-modal-padding-x) 0 var(--el-fea-modal-padding-x);
    overflow: visible !important;
    height: auto !important;
    max-height: none !important;
    border-bottom: none !important;
    border-top: none !important;
}

/* ===== TABS — Add space below tab bar ===== */
.fea-modal.edit-modal .acf-tab-wrap {
    margin-bottom: 20px !important;
}



/* ===== TABS — Remove scroll arrows ===== */
.fea-modal.edit-modal .acf-tab-wrap .acf-tab-scroll-up,
.fea-modal.edit-modal .acf-tab-wrap .acf-tab-scroll-down {
    display: none !important;
}


/* ===== TABS — List container with bottom border ===== */
.fea-modal.edit-modal .acf-tab-wrap .acf-tab-group {
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    border-bottom: 1px solid #DEDFE3 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0 !important;
}


/* ===== TABS — Individual tab items ===== */
.fea-modal.edit-modal .acf-tab-wrap .acf-tab-group li {
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
}


/* ===== TABS — Button base styling ===== */
.fea-modal.edit-modal .acf-tab-wrap .acf-tab-group li a.acf-tab-button {
    display: block;
    padding: 12px 24px !important;
    margin: 0 !important;
    font-family: 'Poppins', sans-serif !important;
    font-weight: 500 !important;
    font-size: 0.875rem !important;
    line-height: 1em !important;
    text-transform: capitalize !important;
    letter-spacing: 0.02em;
    color: #4D526F !important;
    background: transparent !important;
    border: none !important;
    border-bottom: 2px solid transparent !important;
    transition: color 0.2s ease, border-color 0.2s ease;
}

@media (max-width: 439px) {
    .fea-modal.edit-modal .acf-tab-wrap .acf-tab-group li a.acf-tab-button {
        padding: 16px 8px !important;
    }
}


/* ===== TABS — Hover state ===== */
.fea-modal.edit-modal .acf-tab-wrap .acf-tab-group li a.acf-tab-button:hover {
    color: #000831 !important;
}


/* ===== TABS — Active state ===== */
.fea-modal.edit-modal .acf-tab-wrap .acf-tab-group li.active a.acf-tab-button {
    color: #0047FF !important;
    border-bottom: 2px solid #0047FF !important;
}


/* ===== FOOTER — Sticky submit button at bottom ===== */
.fea-modal.edit-modal .acf-field-submit-button {
    order: 9999;
    margin-top: auto !important;
    position: sticky;
    bottom: 0;
    z-index: 400;
    background: #FFFFFF;
    padding: var(--el-fea-footer-padding-y) var(--el-fea-modal-padding-x);
    border-top: 1px solid #DEDFE3 !important;
}

/* ===== FOOTER — split layout (EDIT FORM ONLY) ===== */
.fea-modal.edit-modal .acf-fields:has(.el-fea-edit-form) .acf-field-submit-button.el-fea-footer-split{
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  gap: 12px !important;
  flex-wrap: nowrap !important;
}

/* Delete stays left (direct child) */
.fea-modal.edit-modal .acf-fields:has(.el-fea-edit-form) 
.acf-field-submit-button.el-fea-footer-split > .fea-delete-button{
  margin: 0 !important;
  flex: 0 0 auto !important;
}

/* Right group pinned right */
.fea-modal.edit-modal .acf-fields:has(.el-fea-edit-form) 
.acf-field-submit-button.el-fea-footer-split > .el-fea-footer-right{
  margin-left: auto !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 12px !important;
  flex-wrap: nowrap !important;
}

/* Ensure the right group’s children don’t stack */
.fea-modal.edit-modal .acf-fields:has(.el-fea-edit-form)
.acf-field-submit-button.el-fea-footer-split > .el-fea-footer-right > *{
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  flex: 0 0 auto !important;
}



/* =========================================================
   FOOTER BUTTON STYLES — EDIT LISTING ONLY
   ========================================================= */

.fea-modal.edit-modal .acf-fields:has(.el-fea-edit-form) .acf-field-submit-button .fea-delete-button,
.fea-modal.edit-modal .acf-fields:has(.el-fea-edit-form) .acf-field-submit-button .el-fea-cancel-btn,
.fea-modal.edit-modal .acf-fields:has(.el-fea-edit-form) .acf-field-submit-button .acf-submit-button {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 600 !important;
    font-size: 1rem !important;
    letter-spacing: -0.025em !important;
    line-height: 1.2 !important;
    text-transform: capitalize !important;
    padding: 12px 24px !important;
    border-radius: 999px !important;
    cursor: pointer !important;
    transition: all 0.35s ease !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 48px !important;
    box-sizing: border-box !important;
    text-decoration: none !important;
}

/* --- DELETE: shadow/ghost → red fill on hover --- */
.fea-modal.edit-modal .acf-fields:has(.el-fea-edit-form) .acf-field-submit-button .fea-delete-button {
    background: transparent !important;
    border: 1px solid transparent !important; /* keeps sizing stable */
    color: #DC2626 !important;
    gap: 4px !important; /* icon ↔ text */
    padding-left: 18px !important;  /* slight optical balance */
    padding-right: 18px !important;
}

.fea-modal.edit-modal .acf-fields:has(.el-fea-edit-form) .acf-field-submit-button .fea-delete-button:hover {
    background: #DC2626 !important;
    border-color: #DC2626 !important;
    color: #FFFFFF !important;
}

/* Make sure injected SVG follows text color */
.fea-modal.edit-modal .acf-fields:has(.el-fea-edit-form) .acf-field-submit-button .fea-delete-button svg {
    display: block !important;
}

/* --- CANCEL: white w/ border → light blue on hover --- */
.fea-modal.edit-modal .acf-fields:has(.el-fea-edit-form) .acf-field-submit-button .el-fea-cancel-btn {
    background: #FFFFFF !important;
    border: 1px solid #DEDFE3 !important;
    color: #000831 !important;
}

.fea-modal.edit-modal .acf-fields:has(.el-fea-edit-form) .acf-field-submit-button .el-fea-cancel-btn:hover {
    background: #E6EDFF !important;
    border-color: #E6EDFF !important;
    color: #000831 !important;
}

/* --- SAVE: blue fill + same-color border (size parity) --- */
.fea-modal.edit-modal .acf-fields:has(.el-fea-edit-form) .acf-field-submit-button .acf-submit-button {
    background: #0047FF !important;
    border: 1px solid #0047FF !important;
    color: #FFFFFF !important;
}

.fea-modal.edit-modal .acf-fields:has(.el-fea-edit-form) .acf-field-submit-button .acf-submit-button:hover {
    background: #1D4ED8 !important;
    border-color: #1D4ED8 !important;
    color: #FFFFFF !important;
}



/* =========================================================
   CONDITIONAL FIX — LOCATION TAB (DESKTOP & TABLET ONLY)
   ========================================================= 
   1. Detects if 'street_address' field is visible (Location Tab open)
   2. Packs rows to top to remove gaps
   3. Pins footer to bottom so it doesn't float up
   4. Ignored on Mobile (<768px) so footer remains sticky/thumb-accessible
   
   NOTE: This fix is only needed because Location tab has few fields.
   If you add more fields (e.g., Google Maps), this tab will be tall
   enough naturally. DELETE THIS ENTIRE SECTION when that happens.
   
   TROUBLESHOOTING: If this fix stops working (e.g. layout reverts to
   stretched), try replacing ':not(.acf-hidden)' with
   ':not([style*="display: none"])' in the .elementor-17 .elementor-element.elementor-element-327fe9e9s below.
   ========================================================= */
@media (min-width: 768px) {
    
    /* Pack rows to top when Location tab is open */
    .fea-modal.edit-modal .acf-fields.acf-form-fields:has(.acf-field[data-name="street_address"]:not(.acf-hidden)) {
        position: relative !important; /* Anchor for absolute footer */
        align-content: flex-start !important;
        padding-bottom: 100px !important; /* Space for the absolute footer */
    }

    /* Pin footer to bottom when Location tab is open */
    .fea-modal.edit-modal .acf-fields.acf-form-fields:has(.acf-field[data-name="street_address"]:not(.acf-hidden)) .acf-field-submit-button {
        position: absolute !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        margin: 0 !important;
    }
}


/* ===== FORM FIELDS PADDING — Consistent spacing ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields > .acf-field:not(.acf-field-message):not(.acf-field-submit-button) {
    padding-left: var(--el-fea-modal-padding-x) !important;
    padding-right: var(--el-fea-modal-padding-x) !important;
    padding-top: var(--el-fea-field-padding-y) !important;
    padding-bottom: var(--el-fea-field-padding-y) !important;
}


/* ===== FORM INPUTS — Base styling for all input types ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-input input[type="text"],
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-input input[type="email"],
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-input input[type="url"],
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-input input[type="password"],
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-input input[type="number"],
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-input input[type="search"],
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-input input[type="tel"],
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-input textarea,
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-input select {
    padding: 11px !important;
    border-radius: 12px !important;
    border: 1px solid #DEDFE3 !important;
    background: #FFFFFF !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 400 !important;
    font-size: 1rem !important;
    line-height: 1.48em !important;
    color: #4D526F !important;
    outline: none !important;
    box-shadow: none !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}


/* ===== FORM INPUTS — Textarea vertical resize ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-input textarea {
    resize: vertical;
}


/* ===== FORM INPUTS — Placeholder styling ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-input input::placeholder,
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-input textarea::placeholder {
    color: #9CA3AF !important;
    opacity: 1 !important;
}


/* ===== FORM INPUTS — Focus state with halo ring ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-input input:focus,
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-input textarea:focus,
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-input select:focus {
    border-color: #0047FF !important;
    box-shadow: 0 0 0 2px #CCDAFF !important;
    outline: none !important;
    position: relative !important;
    z-index: 50 !important;
}


/* ===== FORM INPUTS — Prevent focus halo clipping ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-field,
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-input,
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-input-wrap {
    overflow: visible !important;
}


/* ===== FIELD LABELS — Typography (excludes header message) ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-field:not(.acf-field-message) .acf-label {
    margin-bottom: 10px !important;
}

/* ===== FIELD LABELS — Tighter gap when description follows ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-field:not(.acf-field-message):has(.acf-input .description) .acf-label {
    margin-bottom: 4px !important;
}

.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-field:not(.acf-field-message) .acf-label label {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 500 !important;
    font-size: 0.875rem !important;
    line-height: 1.28em !important;
    letter-spacing: 0 !important;
    text-transform: capitalize !important;
    color: #000831 !important;
    margin: 0 !important;
}

/* ===== CANCEL FIELD — Hide label ===== */
.fea-modal.edit-modal .acf-field.el-fea-cancel-field .acf-label {
    display: none !important;
}


/* ===== CANCEL FIELD — Hide entire field wrapper (keeps buttons hidden until moved) ===== */
.fea-modal.edit-modal .acf-fields:has(.el-fea-edit-form) .acf-field.el-fea-cancel-field {
    display: none !important;
}

/* ===== DELETE FIELD — Hide entire field wrapper (keeps buttons hidden until moved) ===== */
.fea-modal.edit-modal .acf-fields:has(.el-fea-edit-form) .acf-field-delete-post {
    display: none !important;
}



/* ===== FIELD DESCRIPTIONS — Helper text styling ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-field:not(.acf-field-message) .description {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 400 !important;
    font-size: 0.775rem !important;
    line-height: 1.48em !important;
    color: #878A9E !important;
    margin-top: 0 !important;
    margin-bottom: 12px !important;
}


/* ===== TRUE/FALSE TOGGLE — Toggle switch styling ===== */
.fea-modal.edit-modal .acf-field-true-false.el-fea-toggle .acf-true-false label {
    display: inline-flex !important;
    align-items: center !important;
    cursor: pointer !important;
}

/* ===== TRUE/FALSE TOGGLE — Hide native checkbox ===== */
.fea-modal.edit-modal .acf-field-true-false.el-fea-toggle .acf-true-false input[type="checkbox"] {
    position: absolute !important;
    opacity: 0 !important;
    width: 1px !important;
    height: 1px !important;
    margin: 0 !important;
}

/* ===== TRUE/FALSE TOGGLE — Message text wrapper ===== */
.fea-modal.edit-modal .acf-field-true-false.el-fea-toggle .acf-true-false .message {
    position: relative !important;
    padding-left: 52px !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 400 !important;
    font-size: 1rem !important;
    line-height: 1.48em !important;
    color: #4D526F !important;
}

/* ===== TRUE/FALSE TOGGLE — Switch track ===== */
.fea-modal.edit-modal .acf-field-true-false.el-fea-toggle .acf-true-false .message::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 40px !important;
    height: 22px !important;
    border-radius: 999px !important;
    background: #DEDFE3 !important;
    transition: background 0.15s ease !important;
}

/* ===== TRUE/FALSE TOGGLE — Switch knob ===== */
.fea-modal.edit-modal .acf-field-true-false.el-fea-toggle .acf-true-false .message::after {
    content: "" !important;
    position: absolute !important;
    left: 2px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 18px !important;
    height: 18px !important;
    border-radius: 50% !important;
    background: #FFFFFF !important;
    box-shadow: 0 2px 6px rgba(0,0,0,0.15) !important;
    transition: transform 0.15s ease !important;
}

/* ===== TRUE/FALSE TOGGLE — Checked state track ===== */
.fea-modal.edit-modal .acf-field-true-false.el-fea-toggle .acf-true-false input[type="checkbox"]:checked + .message::before {
    background: #0047FF !important;
}

/* ===== TRUE/FALSE TOGGLE — Checked state knob ===== */
.fea-modal.edit-modal .acf-field-true-false.el-fea-toggle .acf-true-false input[type="checkbox"]:checked + .message::after {
    transform: translate(18px, -50%) !important;
}

/* ===== TRUE/FALSE TOGGLE — Focus ring for accessibility ===== */
.fea-modal.edit-modal .acf-field-true-false.el-fea-toggle .acf-true-false input[type="checkbox"]:focus-visible + .message::before {
    box-shadow: 0 0 0 2px #CCDAFF !important;
}


/* ===== SECTION HEADING/ (Message field inside form) ===== */
.fea-modal.edit-modal .acf-field.el-fea-section-heading {
    padding-left: var(--el-fea-modal-padding-x) !important;
    padding-right: var(--el-fea-modal-padding-x) !important;
    padding-top: 24px !important;
    padding-bottom: 12px !important;
}

/* Title */
.fea-modal.edit-modal .acf-field.el-fea-section-heading .acf-label label {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 600 !important;
    font-size: 1rem !important;
    line-height: 1.2em !important;
    color: #000831 !important;
}

/* Body text */
.fea-modal.edit-modal .acf-field.el-fea-section-heading .acf-message {
    margin: 0 !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 0.825rem !important;
    line-height: 1.48em !important;
    color: #878A9E !important;
	font-weight: 400 !important;
}


/* Border */
.fea-modal.edit-modal .acf-field.el-fea-section-heading--main-details {
    position: relative !important;
    margin-top: 28px !important; /* 12px space ABOVE the divider */
}

.fea-modal.edit-modal .acf-field.el-fea-section-heading--main-details::before {
    content: "" !important;
    position: absolute !important;
    left: var(--el-fea-modal-padding-x) !important;
    right: var(--el-fea-modal-padding-x) !important;
    top: 0 !important;
    height: 1px !important;
    background: #DEDFE3 !important;
}

/* ===== HIGHLIGHT FEATURES — Inset divider above repeater ===== */
.fea-modal.edit-modal .acf-field-repeater[data-name="highlight_features"] {
    position: relative !important;
    margin-top: 28px !important; /* space ABOVE the divider */
}

.fea-modal.edit-modal .acf-field-repeater[data-name="highlight_features"]::before {
    content: "" !important;
    position: absolute !important;
    left: var(--el-fea-modal-padding-x) !important;
    right: var(--el-fea-modal-padding-x) !important;
    top: 0 !important;
    height: 1px !important;
    background: #DEDFE3 !important;
}

/* ===== HIGHLIGHT FEATURES — Add top padding inside the field container ===== */
.fea-modal.edit-modal .acf-field-repeater[data-name="highlight_features"] {
    margin-top: 28px !important;
}

/* ===== HIGHLIGHT FEATURES — Extra space under divider before label ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields > .acf-field.acf-field-repeater[data-name="highlight_features"] {
    padding-top: 20px !important; /* increase/decrease until perfect */
}

/* ===== PROPERTY DESCRIPTION — Inset divider above WYSIWYG ===== */
.fea-modal.edit-modal .acf-field-wysiwyg[data-name="property_description"] {
    position: relative !important;
    margin-top: 28px !important; /* space ABOVE the divider */
}

.fea-modal.edit-modal .acf-field-wysiwyg[data-name="property_description"]::before {
    content: "" !important;
    position: absolute !important;
    left: var(--el-fea-modal-padding-x) !important;
    right: var(--el-fea-modal-padding-x) !important;
    top: 0 !important;
    height: 1px !important;
    background: #DEDFE3 !important;
}

/* ===== PROPERTY DESCRIPTION — Extra space under divider before label ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields > .acf-field.acf-field-wysiwyg[data-name="property_description"] {
    padding-top: 20px !important; /* increase/decrease until perfect */
}


/* =========================================================
   REPEATER FIELDS — Global styling for all repeaters
   =========================================================
   Targets all ACF repeater fields within the modal.
   Styles: container, headers, inputs, delete button, add button.
   ========================================================= */


/* ===== REPEATER — Main container with border ===== */
.fea-modal.edit-modal .acf-repeater.-table {
    padding: 16px 16px 16px 16px !important;
    border: 1px solid #DEDFE3 !important;
    border-radius: 12px !important;
    background: #FFFFFF !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}


/* ===== REPEATER — Table full width ===== */
.fea-modal.edit-modal .acf-repeater.-table table.acf-table {
    width: 100% !important;
    table-layout: auto !important;
    border: none !important;
    background: transparent !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    margin-bottom: 12px !important;
}


/* ===== REPEATER — Header row styling ===== */
.fea-modal.edit-modal .acf-repeater.-table table.acf-table thead {
    background: transparent !important;
    border: none !important;
}

.fea-modal.edit-modal .acf-repeater.-table table.acf-table thead tr {
    background: transparent !important;
    border: none !important;
    border-bottom: 1px solid #DEDFE3 !important;
}

.fea-modal.edit-modal .acf-repeater.-table table.acf-table thead th.acf-th {
    padding-bottom: 8px !important;
    border: none !important;
    background: transparent !important;
    vertical-align: bottom !important;
}

.fea-modal.edit-modal .acf-repeater.-table table.acf-table thead th.acf-th label {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 500 !important;
    font-size: 0.8rem !important;
    line-height: 1.28em !important;
    letter-spacing: 0 !important;
    color: #000831 !important;
    margin: 0 !important;
    padding: 0 !important;
}


/* ===== REPEATER — Hide header row handles (both left and right) ===== */
.fea-modal.edit-modal .acf-repeater.-table table.acf-table thead th.acf-row-handle {
    display: none !important;
}


/* ===== REPEATER — Body rows with space for bin icon ===== */
.fea-modal.edit-modal .acf-repeater.-table table.acf-table tbody {
    display: table-row-group !important;
}

.fea-modal.edit-modal .acf-repeater.-table table.acf-table tbody tr.acf-row {
    display: table-row !important;
    background: transparent !important;
    border: none !important;
    position: relative !important;
}

/* IMPORTANT: don't style .acf-clone rows — ACF needs them hidden or add-row breaks */
/* ===== REPEATER — Hide clone template row (used by ACF for adding new rows) ===== */
.fea-modal.edit-modal .acf-repeater.-table table.acf-table tbody tr.acf-row.acf-clone {
    display: none !important;
}

/* ===== REPEATER — Hide row number column (left handle) ===== */
.fea-modal.edit-modal .acf-repeater.-table table.acf-table tbody td.acf-row-handle.order {
    display: none !important;
}


/* ===== REPEATER — Body cells (Label and Value fields) ===== */
.fea-modal.edit-modal .acf-repeater.-table table.acf-table tbody td.acf-field {
    padding: 12px 0 0 0 !important;
    border: none !important;
    background: transparent !important;
    vertical-align: top !important;
    display: table-cell !important;
}


/* ===== REPEATER — Gap between columns (class-based, width-flexible) ===== */
/* Classes applied to sub-fields in ACF repeaters for consistent spacing.
   Widths are controlled via ACF field settings (not CSS).
   
   Current repeaters using these classes:
   - Listings: Highlight Features (49%/49%)
   - Listings: Interior Details (49%/49%)
   - Listings: Area and Lot (49%/49%)
   - Listings: Exterior Details (49%/49%)
   - Listings: Financial Details (49%/49%)
   - Agents: Social Media Links (30%/68%)
   
   Add these classes to any new 2-column repeaters for automatic gap styling. */

/* Left column body cells - add right padding for gap */
.fea-modal.edit-modal .acf-repeater.-table table.acf-table tbody td.acf-field.el-fea-repeater-left {
    padding-right: 6px !important;
}

/* Right column body cells - add left padding for gap */
.fea-modal.edit-modal .acf-repeater.-table table.acf-table tbody td.acf-field.el-fea-repeater-right {
    padding-left: 6px !important;
}

/* Left column headers - explicitly reset left padding to 0 */
.fea-modal.edit-modal .acf-repeater.-table table.acf-table thead th.acf-th[data-name="label"],
.fea-modal.edit-modal .acf-repeater.-table table.acf-table thead th.acf-th[data-name="platform"] {
    padding-left: 0px !important;
}

/* Right column headers - add left padding to align with inputs */
.fea-modal.edit-modal .acf-repeater.-table table.acf-table thead th.acf-th[data-name="value"],
.fea-modal.edit-modal .acf-repeater.-table table.acf-table thead th.acf-th[data-name="url"] {
    padding-left: 5px !important;
}


/* ===== REPEATER — Input fields with gray background ===== */
.fea-modal.edit-modal .acf-repeater.-table table.acf-table tbody td.acf-field input[type="text"] {
    background: #FAFAFA !important;
}


/* ===== REPEATER — Delete button column (right handle) ===== */
.fea-modal.edit-modal .acf-repeater.-table table.acf-table tbody td.acf-row-handle.remove {
    padding: 12px 0 0 8px !important;
    border: none !important;
    background: transparent !important;
    width: 27px !important;
    display: table-cell !important;
    vertical-align: middle !important;
    text-align: right !important;
}


/* ===== REPEATER — Hide plus and duplicate icons ===== */
.fea-modal.edit-modal .acf-repeater.-table table.acf-table tbody td.acf-row-handle.remove .acf-icon.-plus,
.fea-modal.edit-modal .acf-repeater.-table table.acf-table tbody td.acf-row-handle.remove .acf-icon.-duplicate {
    display: none !important;
}


/* ===== REPEATER — Delete button (trash icon) ===== */
.fea-modal.edit-modal .acf-repeater.-table table.acf-table tbody td.acf-row-handle.remove .acf-icon.-minus {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 20px !important;
    height: 20px !important;
    background-image: url('https://app.elevatedlistings.design/wp-content/uploads/2025/12/Bin-Icon-Grey.svg') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-color: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    cursor: pointer !important;
    margin: -4px 0 0 0 !important;
}


/* ===== REPEATER — Hide default minus icon content ===== */
.fea-modal.edit-modal .acf-repeater.-table table.acf-table tbody td.acf-row-handle.remove .acf-icon.-minus::before {
    display: none !important;
}


/* ===== REPEATER — Delete button hover state ===== */
.fea-modal.edit-modal .acf-repeater.-table table.acf-table tbody td.acf-row-handle.remove .acf-icon.-minus:hover {
    opacity: 0.7 !important;
}


/* ===== REPEATER — Actions row (Add button container) ===== */
.fea-modal.edit-modal .acf-repeater.-table .acf-actions {
    padding: 0px 0 16px 0 !important;
    margin: 0 0 0 0 !important;
    border: none !important;
    background: transparent !important;
    text-align: right !important;
    min-height: 16px !important;
}


/* ===== REPEATER — Add button styling ===== */
.fea-modal.edit-modal .acf-repeater.-table .acf-actions .acf-repeater-add-row {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 500 !important;
    font-size: 0.8rem !important;
    line-height: 1.28em !important;
    letter-spacing: 0 !important;
    color: #0047FF !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    cursor: pointer !important;
    text-decoration: none !important;
}


/* ===== REPEATER — Add button hover state ===== */
.fea-modal.edit-modal .acf-repeater.-table .acf-actions .acf-repeater-add-row:hover {
    color: #0035CC !important;
    background: transparent !important;
    text-decoration: none !important;
}


/* ===== REPEATER — Clear float fix ===== */
.fea-modal.edit-modal .acf-repeater.-table .acf-actions .clear {
    display: none !important;
}


/* =========================================================
   WYSIWYG FIELDS — Global styling for all WYSIWYG editors
   =========================================================
   Targets all ACF WYSIWYG fields within the modal.
   Styles: container, toolbar, buttons, edit area, status bar.
   ========================================================= */


/* ===== WYSIWYG — Hide empty editor tools container ===== */
.fea-modal.edit-modal .acf-field-wysiwyg .wp-editor-tools:empty,
.fea-modal.edit-modal .acf-field-wysiwyg .wp-editor-tools:not(:has(*)) {
    display: none !important;
}


/* ===== WYSIWYG — Main editor container ===== */
.fea-modal.edit-modal .acf-field-wysiwyg .wp-editor-container {
    border: 2px solid #DEDFE3 !important;
    border-radius: 12px 12px 12px 12px !important; /* top-left, top-right, bottom-right, bottom-left */
    background: #FFFFFF !important;
    overflow: hidden !important;
}


/* ===== WYSIWYG — TinyMCE panel reset ===== */
.fea-modal.edit-modal .acf-field-wysiwyg .mce-tinymce {
    border: none !important;
    visibility: visible !important;
}

/* ===== WYSIWYG — Remove all TinyMCE shadows (aggressive) ===== */
.fea-modal.edit-modal .acf-field-wysiwyg .mce-tinymce,
.fea-modal.edit-modal .acf-field-wysiwyg .mce-tinymce.mce-container,
.fea-modal.edit-modal .acf-field-wysiwyg .mce-tinymce.mce-panel,
.fea-modal.edit-modal .acf-field-wysiwyg div.mce-tinymce,
.fea-modal.edit-modal .acf-field-wysiwyg .mce-container.mce-panel,
.fea-modal.edit-modal .acf-field-wysiwyg .mce-panel,
.fea-modal.edit-modal .acf-field-wysiwyg .mce-container,
.fea-modal.edit-modal .acf-field-wysiwyg .mce-top-part,
.fea-modal.edit-modal .acf-field-wysiwyg .mce-stack-layout-item,
.fea-modal.edit-modal .acf-field-wysiwyg [class*="mce-"] {
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
}

/* ===== WYSIWYG — Remove borders that look like shadows ===== */
.fea-modal.edit-modal .acf-field-wysiwyg .mce-toolbar-grp {
    border-bottom: 1px solid #DEDFE3 !important;
}

.fea-modal.edit-modal .acf-field-wysiwyg .mce-edit-area {
    border: none !important;
    border-top: none !important;
}

.fea-modal.edit-modal .acf-field-wysiwyg .mce-statusbar {
    border: none !important;
    border-top: 1px solid #DEDFE3 !important;
}

/* ===== WYSIWYG — Reset any inline border styles ===== */
.fea-modal.edit-modal .acf-field-wysiwyg .mce-edit-area[style*="border"] {
    border: none !important;
}


/* ===== WYSIWYG — Toolbar container ===== */
.fea-modal.edit-modal .acf-field-wysiwyg .mce-toolbar-grp {
    padding: 6px 8px !important;
    background: #F6F7F7 !important;
    border: none !important;
    border-bottom: 1px solid #DEDFE3 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}


/* ===== WYSIWYG — Toolbar row ===== */
.fea-modal.edit-modal .acf-field-wysiwyg .mce-toolbar {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
}


/* ===== WYSIWYG — Button group ===== */
.fea-modal.edit-modal .acf-field-wysiwyg .mce-btn-group {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
}


/* ===== WYSIWYG — Toolbar buttons base ===== */
.fea-modal.edit-modal .acf-field-wysiwyg .mce-btn {
    margin: 0 2px !important;
    padding: 0 !important;
    border: none !important;
    border-radius: 6px !important;
    background: transparent !important;
    box-shadow: none !important;
    transition: background 0.15s ease !important;
}

/* ===== WYSIWYG — First button margin (no left margin) ===== */
.fea-modal.edit-modal .acf-field-wysiwyg .mce-btn.mce-first {
    margin-left: 0 !important;
    margin-right: 2px !important;
}

/* ===== WYSIWYG — Last button margin (no right margin) ===== */
.fea-modal.edit-modal .acf-field-wysiwyg .mce-btn.mce-last {
    margin-left: 2px !important;
    margin-right: 0 !important;
}

.fea-modal.edit-modal .acf-field-wysiwyg .mce-btn button {
    padding: 8px !important;
    margin: 0 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 6px !important;
    cursor: pointer !important;
}


/* ===== WYSIWYG — Toolbar button hover state ===== */
.fea-modal.edit-modal .acf-field-wysiwyg .mce-btn:hover:not(.mce-disabled) {
    background: #FFFFFF !important;
}

.fea-modal.edit-modal .acf-field-wysiwyg .mce-btn:hover:not(.mce-disabled) button {
    background: #FFFFFF !important;
}


/* ===== WYSIWYG — Toolbar button active state ===== */
.fea-modal.edit-modal .acf-field-wysiwyg .mce-btn.mce-active {
    background: #0047FF !important;
}

.fea-modal.edit-modal .acf-field-wysiwyg .mce-btn.mce-active button {
    background: #0047FF !important;
}

.fea-modal.edit-modal .acf-field-wysiwyg .mce-btn.mce-active .mce-ico {
    color: #FFFFFF !important;
    filter: brightness(0) invert(1) !important;
}

/* ===== WYSIWYG — Toolbar button active + hover state ===== */
.fea-modal.edit-modal .acf-field-wysiwyg .mce-btn.mce-active:hover {
    background: #0035CC !important;
}

.fea-modal.edit-modal .acf-field-wysiwyg .mce-btn.mce-active:hover button {
    background: #0035CC !important;
}

.fea-modal.edit-modal .acf-field-wysiwyg .mce-btn.mce-active:hover .mce-ico {
    color: #FFFFFF !important;
    filter: brightness(0) invert(1) !important;
}


/* ===== WYSIWYG — Toolbar button disabled state ===== */
.fea-modal.edit-modal .acf-field-wysiwyg .mce-btn.mce-disabled {
    opacity: 0.4 !important;
    cursor: not-allowed !important;
}

.fea-modal.edit-modal .acf-field-wysiwyg .mce-btn.mce-disabled button {
    cursor: not-allowed !important;
}


/* ===== WYSIWYG — Toolbar icons ===== */
.fea-modal.edit-modal .acf-field-wysiwyg .mce-ico {
    color: #4D526F !important;
	
}


/* ===== WYSIWYG — Edit area (iframe container) ===== */
.fea-modal.edit-modal .acf-field-wysiwyg .mce-edit-area {
    border: none !important;
    background: #FFFFFF !important;
}

.fea-modal.edit-modal .acf-field-wysiwyg .mce-edit-area iframe {
    background: #FFFFFF !important;
    display: block !important;
}


/* ===== WYSIWYG — Status bar (footer) ===== */
.fea-modal.edit-modal .acf-field-wysiwyg .mce-statusbar {
    padding: 8px 16px !important;
    background: #F6F7F7 !important;
    border: none !important;
    border-top: 1px solid #DEDFE3 !important;
}


/* ===== WYSIWYG — Status bar layout ===== */
.fea-modal.edit-modal .acf-field-wysiwyg .mce-statusbar .mce-container-body {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}


/* ===== WYSIWYG — Element path text ===== */
.fea-modal.edit-modal .acf-field-wysiwyg .mce-path {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 0.75rem !important;
    color: #878A9E !important;
}

.fea-modal.edit-modal .acf-field-wysiwyg .mce-path-item {
    color: #878A9E !important;
    background: transparent !important;
    padding: 0 !important;
}


/* ===== WYSIWYG — Resize handle styling ===== */
.fea-modal.edit-modal .acf-field-wysiwyg .mce-resizehandle {
    cursor: ns-resize !important;
}

.fea-modal.edit-modal .acf-field-wysiwyg .mce-resizehandle .mce-ico {
    color: #878A9E !important;
    font-size: 14px !important;
}

/* =========================================================
   WYSIWYG LINK TOOLBAR — Popup styling for insert/edit link
   ========================================================= */


/* ===== LINK TOOLBAR — Main container ===== */
.fea-modal.edit-modal .mce-inline-toolbar-grp,
.mce-inline-toolbar-grp.mce-container.mce-panel {
    border: 1px solid #DEDFE3 !important;
    border-radius: 8px !important;
    background: #FFFFFF !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
    padding: 12px !important;
}


/* ===== LINK TOOLBAR — Inner container reset ===== */
.fea-modal.edit-modal .mce-inline-toolbar-grp .mce-container-body,
.mce-inline-toolbar-grp .mce-container-body {
    background: transparent !important;
}

.fea-modal.edit-modal .mce-inline-toolbar-grp .mce-toolbar,
.mce-inline-toolbar-grp .mce-toolbar {
    background: transparent !important;
}

.fea-modal.edit-modal .mce-inline-toolbar-grp .mce-btn-group,
.mce-inline-toolbar-grp .mce-btn-group {
    background: transparent !important;
    border: none !important;
    display: flex !important;
    align-items: flex-end !important;
    gap: 0 !important;
}


/* ===== LINK TOOLBAR — Arrow styling ===== */
.fea-modal.edit-modal .mce-inline-toolbar-grp.mce-arrow-up::before,
.mce-inline-toolbar-grp.mce-arrow-up::before {
    border-bottom-color: #DEDFE3 !important;
    border-left-color: transparent !important;
    border-right-color: transparent !important;
}

.fea-modal.edit-modal .mce-inline-toolbar-grp.mce-arrow-up::after,
.mce-inline-toolbar-grp.mce-arrow-up::after {
    border-bottom-color: #FFFFFF !important;
    border-left-color: transparent !important;
    border-right-color: transparent !important;
}

.fea-modal.edit-modal .mce-inline-toolbar-grp.mce-arrow-down::before,
.mce-inline-toolbar-grp.mce-arrow-down::before {
    border-top-color: #DEDFE3 !important;
    border-left-color: transparent !important;
    border-right-color: transparent !important;
}

.fea-modal.edit-modal .mce-inline-toolbar-grp.mce-arrow-down::after,
.mce-inline-toolbar-grp.mce-arrow-down::after {
    border-top-color: #FFFFFF !important;
    border-left-color: transparent !important;
    border-right-color: transparent !important;
}


/* ===== LINK TOOLBAR — Input field container ===== */
.fea-modal.edit-modal .wp-link-input,
.mce-inline-toolbar-grp .wp-link-input {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
}


/* ===== LINK TOOLBAR — Label styling ===== */
.fea-modal.edit-modal .wp-link-input label,
.mce-inline-toolbar-grp .wp-link-input label {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 500 !important;
    font-size: 0.875rem !important;
    color: #4D526F !important;
    margin: 0 !important;
    padding: 0 !important;
}


/* ===== LINK TOOLBAR — Input field ===== */
.fea-modal.edit-modal .wp-link-input input[type="text"],
.mce-inline-toolbar-grp .wp-link-input input[type="text"] {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 0.875rem !important;
    color: #4D526F !important;
    background: #FFFFFF !important;
    border: 1px solid #DEDFE3 !important;
    border-radius: 6px !important;
    padding: 8px 12px !important;
    min-width: 250px !important;
    height: 36px !important;
    outline: none !important;
    box-sizing: border-box !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
	margin-right: 0px !important;
}

.fea-modal.edit-modal .wp-link-input input[type="text"]:focus,
.mce-inline-toolbar-grp .wp-link-input input[type="text"]:focus {
    border-color: #0047FF !important;
    box-shadow: 0 0 0 2px #CCDAFF !important;
}

.fea-modal.edit-modal .wp-link-input input[type="text"]::placeholder,
.mce-inline-toolbar-grp .wp-link-input input[type="text"]::placeholder {
    color: #878A9E !important;
}


/* ===== LINK TOOLBAR — Apply button (enter icon) ===== */
.fea-modal.edit-modal .mce-inline-toolbar-grp .mce-btn.mce-primary,
.mce-inline-toolbar-grp .mce-btn.mce-primary {
    background: #0047FF !important;
    border: none !important;
    border-radius: 6px !important;
    padding: 0 !important;
    margin: 0 2px 0 6px !important;
    min-width: 40px !important;
    height: 40px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    vertical-align: bottom !important;
    box-shadow: none !important;
}

.fea-modal.edit-modal .mce-inline-toolbar-grp .mce-btn.mce-primary button,
.mce-inline-toolbar-grp .mce-btn.mce-primary button {
    background: #0047FF !important;
    border: none !important;
    border-radius: 6px !important;
    padding: 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: none !important;
}

.fea-modal.edit-modal .mce-inline-toolbar-grp .mce-btn.mce-primary .mce-ico,
.mce-inline-toolbar-grp .mce-btn.mce-primary .mce-ico {
    color: #FFFFFF !important;
}

/* ===== LINK TOOLBAR — Apply button hover state ===== */
.fea-modal.edit-modal .mce-inline-toolbar-grp .mce-btn.mce-primary:hover,
.mce-inline-toolbar-grp .mce-btn.mce-primary:hover {
    background: #0035CC !important;
}

.fea-modal.edit-modal .mce-inline-toolbar-grp .mce-btn.mce-primary:hover button,
.mce-inline-toolbar-grp .mce-btn.mce-primary:hover button {
    background: transparent !important;
}


/* ===== LINK TOOLBAR — Settings button (gear icon) ===== */
.fea-modal.edit-modal .mce-inline-toolbar-grp .mce-btn:not(.mce-primary),
.mce-inline-toolbar-grp .mce-btn:not(.mce-primary) {
    background: #F6F7F7 !important;
    border: none !important;
    border-radius: 6px !important;
    padding: 0 !important;
    margin: 0 0 0 2px !important;
    min-width: 40px !important;
    height: 40px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    vertical-align: bottom !important;
    box-shadow: none !important;
}

.fea-modal.edit-modal .mce-inline-toolbar-grp .mce-btn:not(.mce-primary) button,
.mce-inline-toolbar-grp .mce-btn:not(.mce-primary) button {
    background: transparent !important;
    border: none !important;
    border-radius: 6px !important;
    padding: 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: none !important;
}

.fea-modal.edit-modal .mce-inline-toolbar-grp .mce-btn:not(.mce-primary) .mce-ico,
.mce-inline-toolbar-grp .mce-btn:not(.mce-primary) .mce-ico {
    color: #4D526F !important;
}

.fea-modal.edit-modal .mce-inline-toolbar-grp .mce-btn:not(.mce-primary):hover,
.mce-inline-toolbar-grp .mce-btn:not(.mce-primary):hover {
    background: #E8E9EB !important;
    border: none !important;
    box-shadow: none !important;
}

.fea-modal.edit-modal .mce-inline-toolbar-grp .mce-btn:not(.mce-primary):hover button,
.mce-inline-toolbar-grp .mce-btn:not(.mce-primary):hover button {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}


/* ===== WP LINK MODAL — Quick polish ===== */
#wp-link-wrap {
    border-radius: 12px !important;
    border: 1px solid #DEDFE3 !important;
}



/* =========================================================
   PREPEND & APPEND INPUTS — Global fix for ACF prefix/suffix
   =========================================================
   ACF renders .acf-input-prepend and .acf-input-append as
   separate divs. We hide them and use pseudo-elements instead
   for reliable positioning inside the input.
   ========================================================= */


/* ===== PREPEND/APPEND — Hide ACF default elements ===== */
.fea-modal.edit-modal .acf-input-prepend,
.fea-modal.edit-modal .acf-input-append {
    display: none !important;
}

/* ===== PREPEND/APPEND — Parent container setup ===== */
.fea-modal.edit-modal .acf-input:has(.acf-input-prepend),
.fea-modal.edit-modal .acf-input:has(.acf-input-append) {
    position: relative !important;
}

/* ===== PREPEND/APPEND — Input wrapper full width ===== */
.fea-modal.edit-modal .acf-input:has(.acf-input-prepend) .acf-input-wrap,
.fea-modal.edit-modal .acf-input:has(.acf-input-append) .acf-input-wrap {
    width: 100% !important;
}


/* =========================================================
   PRICE FIELD — $ prefix
   ========================================================= */

.fea-modal.edit-modal .acf-field[data-name="price"] .acf-input {
    position: relative !important;
}

/* Custom $ prefix that stays visible even on focus */
.fea-modal.edit-modal .acf-field[data-name="price"] .acf-input::before {
    content: "$" !important;
    position: absolute !important;
    left: 12px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;

    font-family: "Plus Jakarta Sans", sans-serif !important;
    font-size: 1rem !important;
    line-height: 1em !important;
    font-weight: 400 !important;
    color: #4D526F !important;

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

/* Force the input text to always start after the $ */
.fea-modal.edit-modal .acf-field[data-name="price"] .acf-input input[type="number"] {
    padding-left: 24px !important;
    position: relative !important;
    z-index: 1 !important;
}

.fea-modal.edit-modal .acf-field[data-name="price"] .acf-input input[type="number"]:focus,
.fea-modal.edit-modal .acf-field[data-name="price"] .acf-input input[type="number"]:focus-visible {
    padding-left: 24px !important;
}


/* =========================================================
   LIVING AREA FIELD — Sq.Ft suffix
   ========================================================= */


/* ===== LIVING AREA — Custom suffix via pseudo-element ===== */
.fea-modal.edit-modal .acf-field[data-name="living_area"] .acf-input-wrap::after {
    content: "Sq.Ft" !important;
    position: absolute !important;
    right: 34px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;

    font-family: "Plus Jakarta Sans", sans-serif !important;
    font-size: 0.8rem !important;
    line-height: 1em !important;
    font-weight: 400 !important;
    color: #9CA3AF !important;

    pointer-events: none !important;
    z-index: 3 !important;
}

/* ===== LIVING AREA — Input wrapper positioning ===== */
.fea-modal.edit-modal .acf-field[data-name="living_area"] .acf-input-wrap {
    position: relative !important;
}

/* ===== LIVING AREA — Input right padding to clear suffix ===== */
.fea-modal.edit-modal .acf-field[data-name="living_area"] input.acf-is-appended {
    padding-right: 92px !important;
}

/* ===== LIVING AREA — Number spinner gap ===== */
.fea-modal.edit-modal .acf-field[data-name="living_area"] input[type="number"]::-webkit-inner-spin-button {
    margin-right: 2px !important;
}


/* ===== SELECT2 — Base selection styling ===== */
.fea-modal.edit-modal .select2-container .select2-selection {
    padding: 11px !important;
    border-radius: 12px !important;
    border: 1px solid #DEDFE3 !important;
    background: #FFFFFF !important;
    outline: none !important;
    box-shadow: none !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

/* ===== SELECT2 — Text styling ===== */
.fea-modal.edit-modal .select2-container .select2-selection .select2-selection__rendered {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 400 !important;
    font-size: 1rem !important;
    line-height: 1.48em !important;
    color: #4D526F !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* ===== SELECT2 — Placeholder styling ===== */
.fea-modal.edit-modal .select2-container .select2-selection .select2-selection__placeholder {
    color: #9CA3AF !important;
}

/* ===== SELECT2 — Focus/open state with halo ring ===== */
.fea-modal.edit-modal .select2-container--focus .select2-selection,
.fea-modal.edit-modal .select2-container--open .select2-selection {
    border-color: #0047FF !important;
    box-shadow: 0 0 0 2px #CCDAFF !important;
}

/* ===== SELECT2 — Z-index for focus state ===== */
.fea-modal.edit-modal .select2-container--focus,
.fea-modal.edit-modal .select2-container--open {
    position: relative !important;
    z-index: 60 !important;
}

/* ===== SELECT2 — Z-index below sticky elements ===== */
.fea-modal.edit-modal .select2-container {
    z-index: 380 !important;
}

/* ===== SELECT2 — Single selection height fix ===== */
.fea-modal.edit-modal .select2-container .select2-selection--single {
    height: auto !important;
    min-height: 46px !important;
    display: flex !important;
    align-items: center !important;
}

.fea-modal.edit-modal .select2-container .select2-selection--single .select2-selection__rendered {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: 1.48em !important;
}

/* ===== SELECT2 — Dropdown arrow container ===== */
.fea-modal.edit-modal .select2-container .select2-selection--single .select2-selection__arrow {
    height: 100% !important;
    width: 34px !important;
    right: 8px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* ===== SELECT2 — Hide default triangle arrow ===== */
.fea-modal.edit-modal .select2-container .select2-selection--single .select2-selection__arrow b {
    display: none !important;
}

/* ===== SELECT2 — Custom chevron arrow ===== */
.fea-modal.edit-modal .select2-container .select2-selection--single .select2-selection__arrow::after {
    content: "" !important;
    display: block !important;
    width: 14px !important;
    height: 9px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9' fill='none'%3E%3Cpath d='M1 1L7 7L13 1' stroke='%234D526F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
}

/* ===== SELECT2 — Clear button styling ===== */
.fea-modal.edit-modal .select2-container .select2-selection__clear {
    margin-left: 2px !important;
    font-size: 1.25rem !important;
    line-height: 1 !important;
}


/* ===== NATIVE SELECT — Custom chevron arrow ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-input select {
    appearance: none !important;
    -webkit-appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9' fill='none'%3E%3Cpath d='M1 1L7 7L13 1' stroke='%234D526F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 12px center !important;
    background-size: 14px 9px !important;
    padding-right: 40px !important;
}


/* =========================================================
   FIELD LAYOUTS — Column system for multi-column rows
   =========================================================
   Classes:
   - el-fea-col-2: 50% width (2 columns per row)
   - el-fea-col-3: 33.333% width (3 columns per row)
   - el-fea-col-first: First column (uses left modal padding)
   - el-fea-col-middle: Middle column (10px padding both sides)
   - el-fea-col-last: Last column (uses right modal padding)
   - el-fea-lot-size-first/last: Special connected pair
   ========================================================= */


/* ===== FIELD LAYOUTS — Enable row wrapping ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields.-top {
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
}


/* ===== FIELD LAYOUTS — Default full width for all fields ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields.-top > .acf-field {
    width: 100% !important;
    flex: 0 0 100% !important;
}


/* ===== FIELD LAYOUTS — 2 column (50% width) ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields.-top > .acf-field.el-fea-col-2 {
    width: 50% !important;
    flex: 0 0 50% !important;
}


/* ===== FIELD LAYOUTS — 3 column (33.333% width) ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields.-top > .acf-field.el-fea-col-3 {
    width: 33.333% !important;
    flex: 0 0 33.333% !important;
}


/* ===== FIELD LAYOUTS — First column (left edge) ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields.-top > .acf-field.el-fea-col-first {
    padding-left: var(--el-fea-modal-padding-x) !important;
    padding-right: 10px !important;
}


/* ===== FIELD LAYOUTS — Middle column (10px both sides) ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields.-top > .acf-field.el-fea-col-middle {
    padding-left: 10px !important;
    padding-right: 10px !important;
}


/* ===== FIELD LAYOUTS — Last column (right edge) ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields.-top > .acf-field.el-fea-col-last {
    padding-left: 10px !important;
    padding-right: var(--el-fea-modal-padding-x) !important;
}


/* ===== FIELD LAYOUTS — Lot Size special pair (connected fields) ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields.-top > .acf-field.el-fea-lot-size-first {
    width: 32% !important;
    flex: 0 0 32% !important;
    padding-left: var(--el-fea-modal-padding-x) !important;
    padding-right: 0 !important;
}

.fea-modal.edit-modal .acf-fields.acf-form-fields.-top > .acf-field.el-fea-lot-size-last {
    width: 18% !important;
    flex: 0 0 18% !important;
    padding-left: 0 !important;
    padding-right: 10px !important;
}






/* ===== FIELD LAYOUTS — Remove ACF default divider lines ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields.-top > .acf-field[data-width] + .acf-field[data-width] {
    border-left: none !important;
}


/* ===== FIELD LAYOUTS — Mobile: Stack all columns ===== */
@media (max-width: 767px) {
    .fea-modal.edit-modal .acf-fields.acf-form-fields.-top > .acf-field.el-fea-col-2,
    .fea-modal.edit-modal .acf-fields.acf-form-fields.-top > .acf-field.el-fea-col-3 {
        width: 100% !important;
        flex: 0 0 100% !important;
        padding-left: var(--el-fea-modal-padding-x) !important;
        padding-right: var(--el-fea-modal-padding-x) !important;
    }
    
/* Lot Size pair stays side-by-side on mobile */
    .fea-modal.edit-modal .acf-fields.acf-form-fields.-top > .acf-field.el-fea-lot-size-first {
        width: 64% !important;
        flex: 0 0 64% !important;
        padding-left: var(--el-fea-modal-padding-x) !important;
        padding-right: 0 !important;
    }
    
    .fea-modal.edit-modal .acf-fields.acf-form-fields.-top > .acf-field.el-fea-lot-size-last {
        width: 36% !important;
        flex: 0 0 36% !important;
        padding-left: 0 !important;
        padding-right: var(--el-fea-modal-padding-x) !important;
    }
}


/* =========================================================
   LOT SIZE CONNECTED PAIR — Make fields look like one input
   ========================================================= */

/* ===== Hide Lot Size Unit label ===== */
.fea-modal.edit-modal .acf-field[data-name="lot_size_unit"] .acf-label {
    display: none !important;
}

/* ===== Push Lot Size Unit down to align with Lot Size input ===== */
/* Note: 28px = label height + margin. Update if label styles change. */
.fea-modal.edit-modal .acf-field[data-name="lot_size_unit"] .acf-input {
    margin-top: 28px !important;
}

/* ===== Remove gap between fields ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields.-top > .acf-field.el-fea-lot-size-first {
    padding-right: 0 !important;
}

.fea-modal.edit-modal .acf-fields.acf-form-fields.-top > .acf-field.el-fea-lot-size-last {
    padding-left: 0 !important;
}

/* ===== Lot Size input — right side flat (override general input styles) ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-field[data-name="lot_size"] .acf-input input[type="number"] {
    border-radius: 12px 0 0 12px !important;
}

/* ===== Lot Size Unit select — left side flat (override general input styles) ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-field[data-name="lot_size_unit"] .acf-input select {
    border-radius: 0 12px 12px 0 !important;
    border-left: 0px !important;
}

/* ===== Lot Size Unit select — show left border on focus ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-field[data-name="lot_size_unit"] .acf-input select:focus {
    border-left: 1px solid #0047FF !important;
}

/* ===== Mobile adjustments ===== */
@media (max-width: 767px) {
    .fea-modal.edit-modal .acf-fields.acf-form-fields.-top > .acf-field.el-fea-lot-size-first {
        padding-right: 0 !important;
    }
    
    .fea-modal.edit-modal .acf-fields.acf-form-fields.-top > .acf-field.el-fea-lot-size-last {
        padding-left: 0 !important;
    }
}


/* ===== SCROLLBAR — Custom styling (desktop only) ===== */
@media (min-width: 768px) {
    .fea-modal.edit-modal .content-container::-webkit-scrollbar {
        width: 8px;
    }

    .fea-modal.edit-modal .content-container::-webkit-scrollbar-track {
        background: #F4F4F5;
    }

    .fea-modal.edit-modal .content-container::-webkit-scrollbar-thumb {
        background: #DEDFE3;
        border-radius: 4px;
    }

    .fea-modal.edit-modal .content-container::-webkit-scrollbar-thumb:hover {
        background: #c5c6ca;
    }
}


/* ===== TABLET — Portrait adjustments ===== */
@media (max-width: 900px) {
    .fea-modal.edit-modal .fea-modal-content {
        width: 750px !important;
    }
}


/* ===== MOBILE — Full screen modal ===== */
@media (max-width: 767px) {
    :root {
        --el-fea-modal-padding-x: 16px;
        /* Header height is managed by 439px breakpoint below */
    }

    .fea-modal.edit-modal .fea-modal-content {
        width: 100% !important;
        height: 100vh !important;
        max-height: 100vh !important;
        border-radius: 0;
    }

    .fea-modal.edit-modal .acf-field-message[data-name="add_listing"] {
        padding-right: 52px;
    }
}

/* =========================================================
   MEDIA UPLOAD FIELDS — Featured Image & Gallery
   =========================================================
   Structure:
   - FEATURED IMAGE — Label and description
   - FEATURED IMAGE — Empty state (upload area)
   - FEATURED IMAGE — Filled state (image preview)
   - FEATURED IMAGE — Action buttons (edit/remove)
   - GALLERY — Label and description
   - GALLERY — Images container (sortable)
   - GALLERY — Individual image items
   - GALLERY — Remove button on images
   - GALLERY — Sortable helper (dragging)
   - GALLERY — Sortable placeholder (drop target)
   - GALLERY — Bottom toolbar
   - GALLERY — Hide unused elements
   ========================================================= */


/* =========================================================
   FEATURED IMAGE FIELD
   ========================================================= */


/* ===== FEATURED IMAGE — Label styling ===== */
.fea-modal.edit-modal .acf-field[data-name="fea_featured_image"] .acf-label label {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 500 !important;
    font-size: 0.875rem !important;
    line-height: 1.28em !important;
    color: #000831 !important;
    margin-bottom: 4px !important;
}


/* ===== FEATURED IMAGE — Description text ===== */
.fea-modal.edit-modal .acf-field[data-name="fea_featured_image"] .acf-input > p.description {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 0.775rem !important;
    line-height: 1.48em !important;
    color: #878A9E !important;
    margin-top: 0 !important;
    margin-bottom: 12px !important;
}


/* ===== FEATURED IMAGE — Upload area container (empty state) ===== */
/* Note: NO !important on display so ACF can hide it when .has-value is present */
.fea-modal.edit-modal .acf-field[data-name="fea_featured_image"] .acf-image-uploader .hide-if-value {
    position: relative !important;
    display: flex;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 200px !important;
    padding: 32px !important;
    border: 2px dashed #DEDFE3 !important;
    border-radius: 12px !important;
    background: #F9FAFB !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}

.fea-modal.edit-modal .acf-field[data-name="fea_featured_image"] .acf-image-uploader .hide-if-value:hover {
    border-color: #0047FF !important;
    background: #F0F4FF !important;
}


/* ===== FEATURED IMAGE — Hide upload area when image exists ===== */
.fea-modal.edit-modal .acf-field[data-name="fea_featured_image"] .acf-image-uploader.has-value .hide-if-value {
    display: none !important;
}


/* ===== FEATURED IMAGE — Inner paragraph wrapper ===== */
.fea-modal.edit-modal .acf-field[data-name="fea_featured_image"] .acf-image-uploader .hide-if-value > p {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 2px !important;
    margin: 0 !important;
    text-align: center !important;
}


/* ===== FEATURED IMAGE — Hide "No Image selected" text ===== */
.fea-modal.edit-modal .acf-field[data-name="fea_featured_image"] .acf-image-uploader .hide-if-value > p {
    font-size: 0 !important;
    line-height: 0 !important;
    color: transparent !important;
}

/* ===== FEATURED IMAGE — Upload icon (pseudo-element) ===== */
.fea-modal.edit-modal .acf-field[data-name="fea_featured_image"] .acf-image-uploader .hide-if-value > p::before {
    content: "" !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 56px !important;
    height: 56px !important;
    background-color: #E6EDFF !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 24 24' fill='none' stroke='%230047FF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpolyline points='17 8 12 3 7 8'/%3E%3Cline x1='12' y1='3' x2='12' y2='15'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    border-radius: 12px !important;
    margin-bottom: 8px !important;
    margin-top: 0 !important;
}


/* ===== FEATURED IMAGE — "Add Image" button styling ===== */
.fea-modal.edit-modal .acf-field[data-name="fea_featured_image"] .acf-image-uploader .hide-if-value a[data-name="add"] {
    position: static !important;
    display: inline-block !important;
    font-family: 'Poppins', sans-serif !important;
    font-weight: 500 !important;
    font-size: 0.9rem !important;
    color: #0047FF !important;
    text-decoration: none !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    cursor: pointer !important;
    transition: color 0.15s ease !important;
	margin-bottom: 2px !important;
}

.fea-modal.edit-modal .acf-field[data-name="fea_featured_image"] .acf-image-uploader .hide-if-value a[data-name="add"]:hover {
    color: #0035CC !important;
}

/* ===== FEATURED IMAGE — Clickable overlay for entire dropzone ===== */
.fea-modal.edit-modal .acf-field[data-name="fea_featured_image"] .acf-image-uploader .hide-if-value a[data-name="add"]::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 5 !important;
    cursor: pointer !important;
}


/* ===== FEATURED IMAGE — Helper text below button ===== */
.fea-modal.edit-modal .acf-field[data-name="fea_featured_image"] .acf-image-uploader .hide-if-value > p::after {
    content: "Click to upload cover photo" !important;
    display: block !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 0.8rem !important;
    font-weight: 400 !important;
    color: #878A9E !important;
    margin-top: 4px !important;
}


/* ===== FEATURED IMAGE — Image preview container (filled state) ===== */
.fea-modal.edit-modal .acf-field[data-name="fea_featured_image"] .acf-image-uploader .image-wrap {
    position: relative !important;
    max-width: 100% !important;
    width: fit-content !important;
    border-radius: 12px !important;
    overflow: hidden !important;
}


/* ===== FEATURED IMAGE — The preview image ===== */
.fea-modal.edit-modal .acf-field[data-name="fea_featured_image"] .acf-image-uploader .image-wrap img {
    display: block !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 300px !important;
    object-fit: cover !important;
    border-radius: 12px !important;
}


/* ===== FEATURED IMAGE — Action buttons container ===== */
.fea-modal.edit-modal .acf-field[data-name="fea_featured_image"] .acf-image-uploader .acf-actions.-hover {
    position: absolute !important;
    top: 8px !important;
    right: 8px !important;
    display: flex !important;
    gap: 8px !important;
    opacity: 0 !important;
    transition: opacity 0.2s ease !important;
}

.fea-modal.edit-modal .acf-field[data-name="fea_featured_image"] .acf-image-uploader .image-wrap:hover .acf-actions.-hover {
    opacity: 1 !important;
}


/* ===== FEATURED IMAGE — Edit and Remove button base ===== */
.fea-modal.edit-modal .acf-field[data-name="fea_featured_image"] .acf-image-uploader .acf-actions.-hover a.acf-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    background: #FFFFFF !important;
    border: 1px solid #DEDFE3 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12) !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
    text-decoration: none !important;
}


/* ===== FEATURED IMAGE — Center icons inside buttons ===== */
.fea-modal.edit-modal .acf-field[data-name="fea_featured_image"] .acf-image-uploader .acf-actions.-hover a.acf-icon::before {
    position: relative !important;
    left: 0 !important;
    top: 0 !important;
    margin: 0 !important;
}


/* ===== FEATURED IMAGE — Edit button (pencil) ===== */
.fea-modal.edit-modal .acf-field[data-name="fea_featured_image"] .acf-image-uploader .acf-actions.-hover a.acf-icon.-pencil {
    color: #0047FF !important;
	border-color: #ffffff !important;
}

.fea-modal.edit-modal .acf-field[data-name="fea_featured_image"] .acf-image-uploader .acf-actions.-hover a.acf-icon.-pencil:hover {
    background: #E9F0FF !important;
    border-color: #E9F0FF !important;
}


/* ===== FEATURED IMAGE — Remove button (X) ===== */
.fea-modal.edit-modal .acf-field[data-name="fea_featured_image"] .acf-image-uploader .acf-actions.-hover a.acf-icon.-cancel {
    color: #DC2626 !important;
	border-color: #ffffff !important;
}

.fea-modal.edit-modal .acf-field[data-name="fea_featured_image"] .acf-image-uploader .acf-actions.-hover a.acf-icon.-cancel:hover {
    background: #E9F0FF !important;
    border-color: #E9F0FF !important;
	
}

/* ===== FEATURED IMAGE — Center icons inside buttons ===== */
.fea-modal.edit-modal .acf-field[data-name="fea_featured_image"] .acf-image-uploader .acf-actions.-hover a.acf-icon::before {
    margin-left: 1px !important;
}

/* =========================================================
   GALLERY FIELD — V1 Minimal
   =========================================================
   Strategy: Let FEA handle everything except:
   - 6px border-radius on thumbnail images
   - Styled "Add Images" button
   ========================================================= */


/* ===== GALLERY — Label styling ===== */
.fea-modal.edit-modal .acf-field[data-name="gallery"] .acf-label label {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 500 !important;
    font-size: 0.875rem !important;
    line-height: 1.28em !important;
    color: #000831 !important;
    margin-bottom: 4px !important;
}


/* ===== GALLERY — Description text ===== */
.fea-modal.edit-modal .acf-field[data-name="gallery"] .acf-input > p.description {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 0.775rem !important;
    line-height: 1.48em !important;
    color: #878A9E !important;
    margin-top: 0 !important;
    margin-bottom: 12px !important;
}

/* ===== GALLERY — Image container border-radius and overflow ===== */
.fea-modal.edit-modal .acf-field[data-name="gallery"] .fea-uploads-attachment {
    border-radius: 6px !important;
    overflow: hidden !important;
}

/* ===== GALLERY — Image border-radius ===== */
.fea-modal.edit-modal .acf-field[data-name="gallery"] .fea-uploads-attachment .thumbnail img {
    border-radius: 6px !important;
}

/* ===== GALLERY — Image fill container ===== */
.fea-modal.edit-modal .acf-field[data-name="gallery"] .fea-uploads-attachment .thumbnail img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* ===== GALLERY — Main container bottom margin ===== */
.fea-modal.edit-modal .acf-field[data-name="gallery"] .fea-uploads-main {
    margin-bottom: 12px !important;
}

/* ===== GALLERY — "Add Images" button ===== */
.fea-modal.edit-modal .acf-field[data-name="gallery"] .fea-uploads-add {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 10px 20px !important;
    font-family: 'Poppins', sans-serif !important;
    font-weight: 500 !important;
    font-size: 0.875rem !important;
    color: #FFFFFF !important;
    background: #0047FF !important;
    border: none !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    text-decoration: none !important;
}

.fea-modal.edit-modal .acf-field[data-name="gallery"] .fea-uploads-add:hover {
    background: #0035CC !important;
    color: #FFFFFF !important;
}


/* ===== GALLERY — Hide bulk actions dropdown ===== */
.fea-modal.edit-modal .acf-field[data-name="gallery"] .fea-uploads-sort {
    display: none !important;
}


/* =========================================================
   GALLERY OVERFLOW FIX (Overrides "Focus Halo" Rule)
   =========================================================
   Restores overflow management specifically for the gallery
   to prevent drag-and-drop from shifting the layout.
   ========================================================= */

.fea-modal.edit-modal .acf-field[data-name="gallery"],
.fea-modal.edit-modal .acf-field[data-name="gallery"] .acf-input,
.fea-modal.edit-modal .acf-field[data-name="gallery"] .acf-input-wrap {
    overflow: hidden !important; 
    /* or use 'clip' if you want newer browser support */
}

/* ===== GALLERY — Remove button position fix ===== */
.fea-modal.edit-modal .acf-field[data-name="gallery"] .fea-uploads-attachment .actions {
    position: absolute !important;
    top: 4px !important;
    right: 4px !important;
}

/* ===== GALLERY — Remove button styling ===== */
.fea-modal.edit-modal .acf-field[data-name="gallery"] .fea-uploads-attachment .actions .fea-uploads-remove {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    height: 24px !important;
    border-radius: 50% !important;
    background: #000831 !important;
    border: none !important;
    cursor: pointer !important;
}

/* ===== GALLERY — Center X icon inside button ===== */
.fea-modal.edit-modal .acf-field[data-name="gallery"] .fea-uploads-attachment .actions .fea-uploads-remove::before {
    margin: 0 !important;
    position: relative !important;
    left: 0 !important;
    top: 0 !important;
}

/* ===== FILE UPLOAD — Style "Add File" link ===== */
.fea-modal.edit-modal .acf-field-upload-file .acf-file-uploader .hide-if-value a[data-name="add"] {
    color: #0047FF !important;
    font-family: 'Poppins', sans-serif !important;
    font-weight: 500 !important;
    text-decoration: none !important;
}

.fea-modal.edit-modal .acf-field-upload-file .acf-file-uploader .hide-if-value a[data-name="add"]:hover {
    color: #0035CC !important;
}


/* =========================================================
   WP MEDIA MODAL — Reset Elementor Button Overrides (Frontend Only)
   =========================================================
   Elementor's global button styles override the WP media modal.
   These resets restore the default WP appearance.
   ========================================================= */

/* ===== MEDIA MODAL — Close button reset ===== */
body:not(.wp-admin) .media-modal .media-modal-close {
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    color: inherit !important;
    font-family: inherit !important;
    font-weight: normal !important;
    font-size: inherit !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    line-height: normal !important;
    box-shadow: none !important;
    margin-top: 12px !important;
    margin-right: 12px !important;
}


/* =========================================================
   WP MEDIA MODAL — V1 Polish (Frontend Only)
   ========================================================= */

/* ===== Modal container — rounded corners ===== */
body:not(.wp-admin) .media-modal {
    border-radius: 12px !important;
    overflow: hidden !important;
}

body:not(.wp-admin) .media-modal .media-modal-content {
    border-radius: 12px !important;
}


/* ===== Typography — System font stack for body text ===== */
body:not(.wp-admin) .media-modal,
body:not(.wp-admin) .media-modal .media-frame,
body:not(.wp-admin) .media-modal .attachments-browser,
body:not(.wp-admin) .media-modal .media-toolbar,
body:not(.wp-admin) .media-modal .attachment-filters,
body:not(.wp-admin) .media-modal .description,
body:not(.wp-admin) .media-modal .attachment-details,
body:not(.wp-admin) .media-modal .attachment-info,
body:not(.wp-admin) .media-modal .attachment-info .details,
body:not(.wp-admin) .media-modal input,
body:not(.wp-admin) .media-modal textarea,
body:not(.wp-admin) .media-modal select {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !important;
    line-height: 1.48em !important;
}

/* ===== Typography — Tabs (no line-height override) ===== */
body:not(.wp-admin) .media-modal .media-router .media-menu-item {
    line-height: normal !important;
}

/* ===== Typography — Poppins for headings, tabs, and buttons ===== */
body:not(.wp-admin) .media-modal .media-frame-title h1,
body:not(.wp-admin) .media-modal .media-attachments-filter-heading,
body:not(.wp-admin) .media-modal .attachment-details h2,
body:not(.wp-admin) .media-modal .media-sidebar h2,
body:not(.wp-admin) .media-modal h2,
body:not(.wp-admin) .media-modal h3,
body:not(.wp-admin) .media-modal .media-router .media-menu-item,
body:not(.wp-admin) .media-modal .button-primary,
body:not(.wp-admin) .media-modal button {
    font-family: 'Poppins', sans-serif !important;
}

/* ===== Filter Media heading — smaller text ===== */
body:not(.wp-admin) .media-modal .media-attachments-filter-heading {
    font-size: 1rem !important;
}


/* ===== Filter dropdown — wider width, padding, arrow position ===== */
body:not(.wp-admin) .media-modal .attachment-filters {
    min-width: 150px !important;
    width: auto !important;
    padding-left: 8px !important;
    padding-right: 24px !important;
    background-position: right 8px center !important;
}


/* ===== Tabs — square corners and medium weight ===== */
body:not(.wp-admin) .media-modal .media-router .media-menu-item {
    border-radius: 0 !important;
    font-weight: 500 !important;
}


/* ===== Tabs — active state text color (not blue) ===== */
body:not(.wp-admin) .media-modal .media-router .media-menu-item.active {
    color: #1e1e1e !important;
}


/* ===== Expand Details — grey color ===== */
body:not(.wp-admin) .media-modal .acf-expand-details {
    color: #646970 !important;
}

body:not(.wp-admin) .media-modal .acf-expand-details:hover {
    color: #1e1e1e !important;
}


/* ===== Right sidebar text — sizing and line-height ===== */
body:not(.wp-admin) .media-modal .attachment-details,
body:not(.wp-admin) .media-modal .attachment-info,
body:not(.wp-admin) .media-modal .attachment-info .details,
body:not(.wp-admin) .media-modal .attachment-info .details *,
body:not(.wp-admin) .media-modal .attachment-details .setting,
body:not(.wp-admin) .media-modal .attachment-details .setting * {
    font-size: 0.8rem !important;
    line-height: 1.28em !important;
}


/* ===== Attachment info — normal weight text ===== */
body:not(.wp-admin) .media-modal .attachment-info,
body:not(.wp-admin) .media-modal .attachment-info .details,
body:not(.wp-admin) .media-modal .attachment-info .details *,
body:not(.wp-admin) .media-modal .attachment-info .filename,
body:not(.wp-admin) .media-modal .delete-attachment {
    font-weight: 400 !important;
}


/* ===== Alt text description — normal weight and line-height ===== */
body:not(.wp-admin) .media-modal .attachment-details .description {
    font-weight: 400 !important;
    line-height: 1.28em !important;
}


/* ===== Delete permanently — smaller text, red color ===== */
body:not(.wp-admin) .media-modal .delete-attachment {
    font-size: 0.8rem !important;
    color: #DC2626 !important;
}


/* ===== Accent color — links ===== */
body:not(.wp-admin) .media-modal a,
body:not(.wp-admin) .media-modal .attachment-details .setting a,
body:not(.wp-admin) .media-modal .edit-attachment,
body:not(.wp-admin) .media-modal .description a {
    color: #0047FF !important;
}


/* ===== Primary buttons — pill shape and font size ===== */
body:not(.wp-admin) .media-modal .button-primary {
    border-radius: 999px !important;
    font-size: 0.925rem !important;
}


/* ===== Primary buttons — grey when disabled ===== */
body:not(.wp-admin) .media-modal .button-primary:disabled,
body:not(.wp-admin) .media-modal .button-primary[disabled] {
    background-color: #dcdcde !important;
    border-color: #dcdcde !important;
    color: #a7aaad !important;
}

body:not(.wp-admin) .media-modal .button-primary:disabled:hover,
body:not(.wp-admin) .media-modal .button-primary[disabled]:hover {
    background-color: #dcdcde !important;
    border-color: #dcdcde !important;
}


/* ===== Primary buttons — blue when active ===== */
body:not(.wp-admin) .media-modal .button-primary:not(:disabled) {
    background-color: #0047FF !important;
    border-color: #0047FF !important;
}

body:not(.wp-admin) .media-modal .button-primary:not(:disabled):hover {
    background-color: #0035CC !important;
    border-color: #0035CC !important;
}

body:not(.wp-admin) .media-modal .button-primary:not(:disabled):focus {
    box-shadow: 0 0 0 2px #CCDAFF !important;
}


/* ===== Selected image border — accent color ===== */
body:not(.wp-admin) .media-modal .attachment.selected,
body:not(.wp-admin) .media-modal .attachment.details {
    box-shadow: inset 0 0 0 3px #0047FF !important;
}


/* ===== Checkmark on selected images — accent color ===== */
body:not(.wp-admin) .media-modal .attachment .check {
    background-color: #0047FF !important;
    border-color: #0047FF !important;
}

/* ===== Input fields — vertical padding ===== */
body:not(.wp-admin) .media-modal .attachment-details input[type="text"],
body:not(.wp-admin) .media-modal .attachment-details textarea {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
}

/* ===== Hide File URL field ===== */
body:not(.wp-admin) .media-modal .attachment-details .setting[data-setting="url"] {
    display: none !important;
}

/* ===== Hide Edit Image link (leads to wp-admin) ===== */
body:not(.wp-admin) .media-modal .attachment-info .edit-attachment {
    display: none !important;
}

/* ===== Hide Original image link ===== */
body:not(.wp-admin) .media-modal .attachment-info .word-wrap-break-word {
    display: none !important;
}

/* ===== Hide Delete permanently button ===== */
body:not(.wp-admin) .media-modal .delete-attachment {
    display: none !important;
}

/* =========================================================
   FILE UPLOAD — Edit/Remove button styling
   ========================================================= */

/* ===== FILE UPLOAD — Action buttons container ===== */
.fea-modal.edit-modal .acf-field-upload-file .acf-file-uploader .acf-actions.-hover {
    display: flex !important;
    gap: 8px !important;
}

/* ===== FILE UPLOAD — Edit and Remove button base ===== */
.fea-modal.edit-modal .acf-field-upload-file .acf-file-uploader .acf-actions.-hover a.acf-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    background: #000831 !important;
    border: none !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
    text-decoration: none !important;
}

/* ===== FILE UPLOAD — Keep circle on hover ===== */
.fea-modal.edit-modal .acf-field-upload-file .acf-file-uploader .acf-actions.-hover a.acf-icon:hover {
    border-radius: 50% !important;
}

/* ===== FILE UPLOAD — Center icons inside buttons ===== */
.fea-modal.edit-modal .acf-field-upload-file .acf-file-uploader .acf-actions.-hover a.acf-icon::before {
    margin: 0 !important;
    margin-left: 1px !important;
    position: relative !important;
    left: 0 !important;
    top: 0 !important;
}

/* ===== FILE UPLOAD — Pencil icon (white, blue on hover) ===== */
.fea-modal.edit-modal .acf-field-upload-file .acf-file-uploader .acf-actions.-hover a.acf-icon.-pencil {
    color: #FFFFFF !important;
}

.fea-modal.edit-modal .acf-field-upload-file .acf-file-uploader .acf-actions.-hover a.acf-icon.-pencil:hover {
    color: #336CFF !important;
}

/* ===== FILE UPLOAD — X icon (white, red on hover) ===== */
.fea-modal.edit-modal .acf-field-upload-file .acf-file-uploader .acf-actions.-hover a.acf-icon.-cancel {
    color: #FFFFFF !important;
}

.fea-modal.edit-modal .acf-field-upload-file .acf-file-uploader .acf-actions.-hover a.acf-icon.-cancel:hover {
    color: #DC2626 !important;
}

/* =========================================================
   MEDIA MODAL — Normalize headings for all user types (admins, agents etc)
   ========================================================= */

/* Modal title (Select Image, Edit Image) */
.el-app .media-modal .media-frame-title h1 {
    font-family: 'Poppins', sans-serif !important;
    font-size: 1.375rem !important;
    font-weight: 600 !important;
    line-height: 3.125rem !important;
    letter-spacing: -0.034rem !important;
    margin: 0 !important;
    padding: 0 1rem !important;
    color: #000831 !important;
    text-transform: capitalize !important;
}

/* Attachment Details heading */
.el-app .media-modal .attachment-details > h2 {
    font-family: 'Poppins', sans-serif !important;
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    line-height: 0.9rem !important;
    letter-spacing: -0.019rem !important;
    margin: 1.5rem 0 0.5rem !important;
    color: #646970 !important;
    text-transform: uppercase !important;
}


/* =========================================================
   EDIT LISTING BUTTON — Pencil icon in listing cards
   ========================================================= */

/* ===== Hide button text, make button circular ===== */
.el-edit-listing-button button.modal-button.render-form {
    /* Hide text */
    font-size: 0 !important;
    line-height: 0 !important;
    color: transparent !important;
    
    /* Size and shape */
    width: fit-content !important;
    min-width: 36px !important;
    height: 36px !important;
    padding: 10px !important;
    
    /* Make it circular */
    border-radius: 999px !important;
    
    /* Normal state - transparent background */
    background: transparent !important;
    border: none !important;
    
    /* Position for icon */
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    
    /* Smooth transition */
    transition: background-color 0.2s ease !important;
    
    /* Cursor */
    cursor: pointer !important;
}

/* ===== Add pencil icon via pseudo-element ===== */
.el-edit-listing-button button.modal-button.render-form::before {
    content: "" !important;
    display: block !important;
    width: 16px !important;
    height: 16px !important;
    background-image: url('https://app.elevatedlistings.design/wp-content/uploads/2026/01/Edit-Pencil-Icon-v2-Blue.svg') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

/* ===== Hover state — blue circle background ===== */
.el-edit-listing-button button.modal-button.render-form:hover {
    background: #E6EDFF !important;
}

/* =========================================================
   BLOG CATEGORY & TAGS FIELDS — Complete styling
   ========================================================= */


/* ===== BLOG CATEGORY — Single select container ===== */
.fea-modal.edit-modal .acf-field.el-fea-blog-category .select2-container .select2-selection--single {
    padding: 11px !important;
    border-radius: 12px !important;
    border: 1px solid #DEDFE3 !important;
    background: #FFFFFF !important;
    min-height: 46px !important;
    display: flex !important;
    align-items: center !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}




/* =========================================================
   MULTISELECT (Select2) — Shared styling for Tags + Listing Agent
   ========================================================= */
/* ===== MULTISELECT — Outer container (SINGLE BORDER) ===== */
.fea-modal.edit-modal .acf-field.el-fea-blog-tags .select2-container .select2-selection--multiple,
.fea-modal.edit-modal .acf-field.el-fea-listing-agent .select2-container .select2-selection--multiple {
    padding: 8px !important;
    border-radius: 12px !important;
    border: 1px solid #DEDFE3 !important;
    background: #FFFFFF !important;
    min-height: 46px !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}



/* ===== MULTISELECT — Inner UL container (remove all borders/padding) ===== */
.fea-modal.edit-modal .acf-field.el-fea-blog-tags .select2-selection--multiple .select2-selection__rendered,
.fea-modal.edit-modal .acf-field.el-fea-listing-agent .select2-selection--multiple .select2-selection__rendered {
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 30px !important;
}



/* ===== MULTISELECT — Hide "Clear All" × button ===== */
.fea-modal.edit-modal .acf-field.el-fea-blog-tags .select2-selection__clear,
.fea-modal.edit-modal .acf-field.el-fea-listing-agent .select2-selection__clear {
    display: none !important;
}


/* ===== MULTISELECT — Selected chips ===== */
.fea-modal.edit-modal .acf-field.el-fea-blog-tags .select2-selection__choice,
.fea-modal.edit-modal .acf-field.el-fea-listing-agent .select2-selection__choice {
    background: #E6EDFF !important;
    color: #0047FF !important;
    border: none !important;
    border-radius: 6px !important;
    padding: 6px 10px 6px 12px !important;
    margin: 0 !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    flex-direction: row-reverse !important; /* × on right */
}



/* ===== MULTISELECT — × button on chips (centered vertically) ===== */
.fea-modal.edit-modal .acf-field.el-fea-blog-tags .select2-selection__choice__remove,
.fea-modal.edit-modal .acf-field.el-fea-listing-agent .select2-selection__choice__remove {
    color: #0047FF !important;
    font-size: 1rem !important;
    line-height: 1 !important;
    opacity: 0.7 !important;
    transition: opacity 0.15s ease !important;
    border: none !important;
    background: none !important;
    margin: 0 !important;
    margin-bottom: 5px !important; /* CENTER VERTICALLY */
    padding: 0 !important;
    cursor: pointer !important;
    float: none !important;
}

.fea-modal.edit-modal .acf-field.el-fea-blog-tags .select2-selection__choice__remove:hover,
.fea-modal.edit-modal .acf-field.el-fea-listing-agent .select2-selection__choice__remove:hover {
    opacity: 1 !important;
    background: none !important;
}


/* ===== MULTISELECT — Search wrapper (inline list item) ===== */
.fea-modal.edit-modal .acf-field.el-fea-blog-tags .select2-search--inline,
.fea-modal.edit-modal .acf-field.el-fea-listing-agent .select2-search--inline {
    margin: 0 !important;
    padding: 0 !important;
    flex: 1 !important;
    min-width: 120px !important;
    display: flex !important;
    align-items: center !important;
}



/* ===== MULTISELECT — Search input (seamless, no border, no halo) ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-field.el-fea-blog-tags .acf-input input[type="search"],
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-field.el-fea-listing-agent .acf-input input[type="search"] {
    padding: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    margin: 0 4px !important;
    background: transparent !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 1rem !important;
    color: #4D526F !important;
    outline: none !important;
    box-shadow: none !important;
    height: auto !important;
    line-height: 1.48em !important;
    width: 100% !important;
    min-height: 30px !important;
}

.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-field.el-fea-blog-tags .acf-input input[type="search"]::placeholder,
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-field.el-fea-listing-agent .acf-input input[type="search"]::placeholder {
    color: #9CA3AF !important;
}



/* ===== MULTISELECT — Remove focus halo from search input ===== */
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-field.el-fea-blog-tags .acf-input input[type="search"]:focus,
.fea-modal.edit-modal .acf-fields.acf-form-fields .acf-field.el-fea-listing-agent .acf-input input[type="search"]:focus {
    border: none !important;
    border-color: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    padding: 0 !important;
}



/* ===== BLOG CATEGORY — Focus halo (outer container only) ===== */
.fea-modal.edit-modal .acf-field.el-fea-blog-category .select2-container--focus .select2-selection--single,
.fea-modal.edit-modal .acf-field.el-fea-blog-category .select2-container--open .select2-selection--single {
    border-color: #0047FF !important;
    box-shadow: 0 0 0 2px #CCDAFF !important;
    position: relative !important;
    z-index: 60 !important;
}


/* ===== MULTISELECT — Focus halo (outer container only, NOT inner search) ===== */
.fea-modal.edit-modal .acf-field.el-fea-blog-tags .select2-container--focus .select2-selection--multiple,
.fea-modal.edit-modal .acf-field.el-fea-blog-tags .select2-container--open .select2-selection--multiple,
.fea-modal.edit-modal .acf-field.el-fea-listing-agent .select2-container--focus .select2-selection--multiple,
.fea-modal.edit-modal .acf-field.el-fea-listing-agent .select2-container--open .select2-selection--multiple {
    border-color: #0047FF !important;
    box-shadow: 0 0 0 2px #CCDAFF !important;
    position: relative !important;
    z-index: 60 !important;
}



/* ===== BLOG CATEGORY & TAGS — +Add buttons (blue link style) ===== */
.fea-modal.edit-modal .acf-field.el-fea-blog-category .acf-actions a[data-name="add"],
.fea-modal.edit-modal .acf-field.el-fea-blog-tags .acf-actions a[data-name="add"] {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 500 !important;
    font-size: 0.875rem !important;
    color: #0047FF !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    display: inline-block !important;
    transition: color 0.15s ease !important;
}

.fea-modal.edit-modal .acf-field.el-fea-blog-category .acf-actions a[data-name="add"]:hover,
.fea-modal.edit-modal .acf-field.el-fea-blog-tags .acf-actions a[data-name="add"]:hover {
    color: #0035CC !important;
    background: transparent !important;
}


/* ===== BLOG CATEGORY & TAGS — Add "+" prefix ===== */
.fea-modal.edit-modal .acf-field.el-fea-blog-category .acf-actions a[data-name="add"]::before,
.fea-modal.edit-modal .acf-field.el-fea-blog-tags .acf-actions a[data-name="add"]::before {
    content: "+ " !important;
}


/* ===== BLOG CATEGORY — Push Add button down ===== */
.fea-modal.edit-modal .acf-field.el-fea-blog-category .acf-actions {
    margin-top: 12px !important;
}

.fea-modal.edit-modal .acf-field.el-fea-blog-category .acf-actions {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    display: flex !important;
    justify-content: flex-end !important;
}



/* ===== BLOG TAGS — Push Add button down ===== */
.fea-modal.edit-modal .acf-field.el-fea-blog-tags .acf-actions {
    margin-top: 12px !important;
}


/* =========================================================
   WYSIWYG FIELDS — Remove focus halo from internal inputs
   =========================================================
   The WYSIWYG editor has its own focus styling, so we
   exclude it from the global input focus halo.
   ========================================================= */

/* ===== WYSIWYG — Remove halo from all internal inputs ===== */
.fea-modal.edit-modal .acf-field.el-fea-wysiwyg .acf-input input:focus,
.fea-modal.edit-modal .acf-field.el-fea-wysiwyg .acf-input textarea:focus {
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
}


/* =========================================================
   BLOG TAGS — Custom placeholder text
   ========================================================= */

.fea-modal.edit-modal .acf-field.el-fea-blog-tags .select2-search__field::placeholder {
    content: "Search or add tags..." !important;
}

/* Alternative if above doesn't work - hide default and add via pseudo-element */
.fea-modal.edit-modal .acf-field.el-fea-blog-tags .select2-search__field:empty::before {
    content: "Search or add tags..." !important;
    color: #9CA3AF !important;
}


/* =========================================================
   SELECT2 DROPDOWN — Modern styling for all dropdowns
   =========================================================
   Applies to Category, Tags, and any other Select2 fields.
   Uses body:has() to target dropdowns that render outside modal.
   ========================================================= */

/* ===== DROPDOWN CONTAINER — Rounded corners and shadow ===== */
body:has(.fea-modal.edit-modal) .select2-dropdown {
    border-radius: 12px !important;
    border: 1px solid #DEDFE3 !important;
    overflow: hidden !important;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12) !important;
}

/* ===== DROPDOWN OPTIONS — Base styling ===== */
body:has(.fea-modal.edit-modal) .select2-results__option {
    padding: 10px 12px !important;
    font-family: "Plus Jakarta Sans", sans-serif !important;
    font-size: 0.95rem !important;
    color: #000831 !important; /* Dark navy text */
    background: #FFFFFF !important; /* White bg */
    transition: background 0.15s ease, color 0.15s ease !important;
}

/* ===== DROPDOWN OPTIONS — Hover state (not selected) ===== */
body:has(.fea-modal.edit-modal) .select2-results__option--highlighted[aria-selected="false"] {
    background: #0047FF !important; /* Blue bg */
    color: #FFFFFF !important; /* White text */
}

/* ===== DROPDOWN OPTIONS — Already selected (not hovering) ===== */
body:has(.fea-modal.edit-modal) .select2-results__option[aria-selected="true"] {
    background: #E6EDFF !important; /* Light blue bg */
    color: #000831 !important; /* Dark navy text */
}

/* ===== DROPDOWN OPTIONS — Already selected + hovering (FIX CONTRAST) ===== */
body:has(.fea-modal.edit-modal) .select2-results__option--highlighted[aria-selected="true"] {
    background: #E6EDFF !important; /* Keep light blue bg */
    color: #0047FF !important; /* Grey text (better contrast) */
}


/* =========================================================
   ACF POPUP MODALS — Add Category & Add Tags
   =========================================================
   Modernizes the ACF popups that appear when clicking
   "+ Add Category" or "+ Add Tag" buttons.
   
   Structure:
   - BACKDROP — Darkened overlay
   - MODAL CARD — White container
   - HEADER — Title bar with close button
   - CLOSE BUTTON — Modern × icon
   - CONTENT PADDING — Inner spacing
   - FIELD LABELS — Typography
   - TEXT INPUT — Name field styling
   - SELECT DROPDOWN — Parent category (Category only)
   - SUBMIT BUTTON — Add button
   - HALO FIX — Prevent focus halo clipping
   ========================================================= */


/* ===== BACKDROP — Darkened overlay ===== */
body:has(.fea-modal.edit-modal) #acf-popup .bg {
    background: rgba(0, 0, 0, 0.5) !important;
}


/* ===== MODAL CARD — White container with rounded corners ===== */
body:has(.fea-modal.edit-modal) #acf-popup .acf-popup-box {
    width: 420px !important;
    border-radius: 16px !important;
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.25) !important;
    border: none !important;
    overflow: hidden !important;
}


/* ===== HEADER — Title bar ===== */
body:has(.fea-modal.edit-modal) #acf-popup .title {
    padding: 20px 20px 16px 20px !important;
    border-bottom: 1px solid #DEDFE3 !important;
    background: #FFFFFF !important;
    position: relative !important;
}


/* ===== HEADER — Add dynamic title text ===== */
body:has(.fea-modal.edit-modal) #acf-popup .title h3 {
    display: block !important;
    font-family: 'Poppins', sans-serif !important;
    font-weight: 600 !important;
    font-size: 1.125rem !important;
    color: #000831 !important;
    padding-right: 40px !important;
    margin: 0 !important;
}

/* Add "Add Category" text when category field is being used */
body:has(.fea-modal.edit-modal) #acf-popup:has([data-name="term_parent"]) .title h3::before {
    content: "Add Category" !important;
}

/* Add "Add Tag" text when tag field is being used (no parent field) */
body:has(.fea-modal.edit-modal) #acf-popup:not(:has([data-name="term_parent"])) .title h3::before {
    content: "Add Tag" !important;
}


/* ===== CLOSE BUTTON — Modern × icon ===== */
body:has(.fea-modal.edit-modal) #acf-popup .title .acf-icon.-cancel {
    position: absolute !important;
    top: 13px !important;
    right: 12px !important;
    width: 32px !important;
    height: 32px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    background: transparent !important;
    border: none !important;
    color: #4D526F !important;
    font-size: 20px !important;
    line-height: 1 !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
}

body:has(.fea-modal.edit-modal) #acf-popup .title .acf-icon.-cancel:hover {
    background: #F4F4F5 !important;
    color: #000831 !important;
}

body:has(.fea-modal.edit-modal) #acf-popup .title .acf-icon.-cancel::before {
    margin: 0 !important;
}


/* ===== CONTENT PADDING — Inner wrapper ===== */
body:has(.fea-modal.edit-modal) #acf-popup .inner {
    padding: 20px !important;
    background: #FFFFFF !important;
    margin: 0 !important;
}


/* ===== FIELD SPACING — Gap between fields ===== */
body:has(.fea-modal.edit-modal) #acf-popup .acf-field {
    margin-bottom: 16px !important;
}

body:has(.fea-modal.edit-modal) #acf-popup .acf-field:first-of-type {
    margin-top: 0 !important;
}

body:has(.fea-modal.edit-modal) #acf-popup .acf-field:last-of-type {
    margin-bottom: 0 !important;
}


/* ===== HALO FIX — Prevent focus halo clipping (CRITICAL) ===== */
body:has(.fea-modal.edit-modal) #acf-popup .acf-field,
body:has(.fea-modal.edit-modal) #acf-popup .acf-input,
body:has(.fea-modal.edit-modal) #acf-popup .acf-input-wrap {
    overflow: visible !important;
}


/* ===== FIELD LABELS — Typography ===== */
body:has(.fea-modal.edit-modal) #acf-popup .acf-label {
    margin-bottom: 8px !important;
}

body:has(.fea-modal.edit-modal) #acf-popup .acf-label label {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 500 !important;
    font-size: 0.875rem !important;
    line-height: 1.28em !important;
    color: #000831 !important;
    text-transform: capitalize !important;
    margin: 0 !important;
}


/* ===== TEXT INPUT — Name field ===== */
body:has(.fea-modal.edit-modal) #acf-popup input[type="text"] {
    width: 100% !important;
    padding: 11px !important;
    border-radius: 12px !important;
    border: 1px solid #DEDFE3 !important;
    background: #FFFFFF !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 400 !important;
    font-size: 1rem !important;
    line-height: 1.48em !important;
    color: #4D526F !important;
    outline: none !important;
    box-shadow: none !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}

body:has(.fea-modal.edit-modal) #acf-popup input[type="text"]::placeholder {
    color: #9CA3AF !important;
}

body:has(.fea-modal.edit-modal) #acf-popup input[type="text"]:focus {
    border-color: #0047FF !important;
    box-shadow: 0 0 0 2px #CCDAFF !important;
    position: relative !important;
    z-index: 50 !important;
}


/* ===== SELECT DROPDOWN — Parent category (Category only) ===== */
body:has(.fea-modal.edit-modal) #acf-popup select {
    width: 100% !important;
    padding: 11px !important;
    padding-right: 40px !important;
    border-radius: 12px !important;
    border: 1px solid #DEDFE3 !important;
    background: #FFFFFF !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 400 !important;
    font-size: 1rem !important;
    line-height: 1.48em !important;
    color: #4D526F !important;
    outline: none !important;
    box-shadow: none !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9' fill='none'%3E%3Cpath d='M1 1L7 7L13 1' stroke='%234D526F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 12px center !important;
    background-size: 14px 9px !important;
    cursor: pointer !important;
}

body:has(.fea-modal.edit-modal) #acf-popup select:focus {
    border-color: #0047FF !important;
    box-shadow: 0 0 0 2px #CCDAFF !important;
    position: relative !important;
    z-index: 50 !important;
}


/* ===== SUBMIT SECTION — Bottom padding ===== */
body:has(.fea-modal.edit-modal) #acf-popup .acf-submit {
    margin: 20px 0 0 0 !important;
    padding: 0 !important;
}


/* ===== SUBMIT BUTTON — Modern blue pill button (FULL WIDTH) ===== */
body:has(.fea-modal.edit-modal) #acf-popup .acf-submit-button {
    width: 100% !important;
    padding: 12px 24px !important;
    border-radius: 999px !important;
    border: none !important;
    background: #0047FF !important;
    font-family: 'Poppins', sans-serif !important;
    font-weight: 600 !important;
    font-size: 1rem !important;
    letter-spacing: -0.025em !important;
    line-height: 1.2 !important;
    text-transform: capitalize !important;
    color: #FFFFFF !important;
    cursor: pointer !important;
    transition: background 0.2s ease !important;
    box-shadow: none !important;
    min-height: 48px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

body:has(.fea-modal.edit-modal) #acf-popup .acf-submit-button:hover {
    background: #0035CC !important;
}

body:has(.fea-modal.edit-modal) #acf-popup .acf-submit-button:focus {
    box-shadow: 0 0 0 2px #CCDAFF !important;
    outline: none !important;
}


/* ===== LOADING SPINNER — Keep default ACF styling ===== */
body:has(.fea-modal.edit-modal) #acf-popup .loading {
    /* Let ACF handle loading state */
}

/* =========================================================
   ACF POPUP MODALS — Mobile width override
   =========================================================
   Keep desktop/tablet at fixed width.
   On mobile, use % width with side padding (always visible).
   ========================================================= */

@media (max-width: 480px) {
  body:has(.fea-modal.edit-modal) #acf-popup .acf-popup-box {
    width: 90vw !important;      /* ~5vw left + 5vw right */
    max-width: 90vw !important; /* prevent 420px forcing overflow */
    margin: 0 auto !important;  /* keep centered */
  }
}

.fea-modal.edit-modal .select2-container--open {
  z-index: 999999 !important;
}

/* =========================================================
   WYSIWYG — Paragraph/Heading dropdown (TinyMCE listbox)
   Fix text colors on hover + open/active
   ========================================================= */

/* Default state (keep text readable) */
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .mce-btn.mce-listbox button .mce-txt {
  color: #4D526F !important;
}

/* Hover state: background can go white, but text must stay grey */
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .mce-btn.mce-listbox:hover button .mce-txt {
  color: #4D526F !important;
}

/* Open/active state: background blue + text white */
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .mce-btn.mce-listbox.mce-active button .mce-txt,
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .mce-btn.mce-listbox[aria-expanded="true"] button .mce-txt {
  color: #FFFFFF !important;
}

/* Caret color (TinyMCE caret is usually a CSS triangle) */
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .mce-btn.mce-listbox .mce-caret {
  border-top-color: #4D526F !important; /* default/hover */
}

.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .mce-btn.mce-listbox.mce-active .mce-caret,
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .mce-btn.mce-listbox[aria-expanded="true"] .mce-caret {
  border-top-color: #FFFFFF !important; /* open/active */
}

/* (Optional) If your "open" state isn't getting mce-active, force the blue bg here too */
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .mce-btn.mce-listbox[aria-expanded="true"],
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .mce-btn.mce-listbox[aria-expanded="true"] button {
  background: #0047FF !important;
}


/* =========================================================
   WYSIWYG — Visual/Text tabs styling
   ========================================================= */

/* Tab container */
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .wp-editor-tabs {
    display: flex !important;
    gap: 0 !important;
}

/* Base tab styling (both Visual and Text) */
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .wp-switch-editor {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 500 !important;
    font-size: 0.8rem !important;
    line-height: 1em !important;
    color: #878A9E !important;
    background: #FFFFFF !important;
    border: none !important;
    padding: 9px 12px 8px 12px !important;
    cursor: pointer !important;
    transition: color 0.15s ease, border-color 0.15s ease !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Hover only affects the NON-active tab */
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .wp-editor-wrap.tmce-active .wp-switch-editor.switch-html:hover,
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .wp-editor-wrap.html-active .wp-switch-editor.switch-tmce:hover {
  color: #0047FF !important;
}

/* Active state — Visual tab when TinyMCE is active */
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .wp-editor-wrap.tmce-active .wp-switch-editor.switch-tmce {
    color: #0047FF !important;
    background: #FFFFFF !important;
    border: 1px solid #DEDFE3 !important;
    border-top: 2px solid #DEDFE3 !important;
    border-left: 2px solid #DEDFE3 !important;
    border-right: 2px solid #DEDFE3 !important;
    border-radius: 8px 8px 0 0 !important;
}

/* Active state — Text tab when HTML editor is active */
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .wp-editor-wrap.html-active .wp-switch-editor.switch-html {
    color: #0047FF !important;
    background: #FFFFFF !important;
    border: 1px solid #DEDFE3 !important;
    border-top: 2px solid #DEDFE3 !important;
    border-left: 2px solid #DEDFE3 !important;
    border-right: 2px solid #DEDFE3 !important;
    border-radius: 8px 8px 0 0 !important;
}

/* Remove gap between tabs */
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .wp-switch-editor {
    margin: 0 !important;
}

/* WYSIWYG (FULL only) — kill textarea rounding + borders */
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .wp-editor-container textarea.wp-editor-area,
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full textarea.wp-editor-area {
  border-radius: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

/* Also remove any focus halo that can look like “flashing” */
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full textarea.wp-editor-area:focus {
  border-radius: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

/* =========================================================
   WYSIWYG — Add Media button styling (FULL version only)
   ========================================================= */

/* Button base styling */
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .wp-media-buttons .button.insert-media.add_media {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 500 !important;
    font-size: 0.8rem !important;
    line-height: 1em !important;
    color: #4D526F !important;
    background: #FFFFFF !important;
    border: 1px solid #DEDFE3 !important;
    border-radius: 8px !important;
    padding: 6px 10px !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
	margin-bottom: 8px !important; /* IMPORTANT! Remove this margin if you add the text tab back so that the margins are sitting right on the main wysiwyg container below it */
}

/* Icon color (default state) */
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .wp-media-buttons .button.insert-media.add_media .wp-media-buttons-icon {
    color: #0047FF !important;
}

/* Make sure icon inherits color property */
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .wp-media-buttons .button.insert-media.add_media .wp-media-buttons-icon::before {
    color: inherit !important;
}

/* Hover state */
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .wp-media-buttons .button.insert-media.add_media:hover {
    color: #000831 !important;
    background: #F6F7F7 !important;
    border-color: #DEDFE3 !important;
}

/* Icon color on hover */
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .wp-media-buttons .button.insert-media.add_media:hover .wp-media-buttons-icon {
    color: #0035CC !important;
}


/* =========================================================
   WYSIWYG — Text tab toolbar (quicktags) styling
   ========================================================= */

/* Toolbar container - increase padding */
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .quicktags-toolbar {
    padding: 8px !important;
    background: #F6F7F7 !important;
    border-bottom: 1px solid #DEDFE3 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
}

/* Base button styling */
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .quicktags-toolbar .ed_button {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 500 !important;
    font-size: 0.75rem !important;
    line-height: 1em !important;
    color: #4D526F !important;
    background: transparent !important;
    border: none !important;
    border-radius: 6px !important;
    padding: 8px !important;
    margin: 0 !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
    box-shadow: none !important;
    min-width: auto !important;
    height: auto !important;
}

/* Hover state */
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .quicktags-toolbar .ed_button:hover {
    background: #FFFFFF !important;
    color: #4D526F !important;
}

/* Active/focus state */
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .quicktags-toolbar .ed_button:active,
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .quicktags-toolbar .ed_button:focus {
    background: #0047FF !important;
    color: #FFFFFF !important;
    outline: none !important;
}

/* Active + hover state */
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .quicktags-toolbar .ed_button:active:hover,
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .quicktags-toolbar .ed_button:focus:hover {
    background: #0035CC !important;
    color: #FFFFFF !important;
}

/* Hide quicktags toolbar when Visual tab is active */
.fea-modal.edit-modal .el-fea-wysiwyg.el-fea-wysiwyg-full .wp-editor-wrap.tmce-active .quicktags-toolbar {
    display: none !important;
}

/* =========================================================
   URL FIELD ICON — Hide decorative globe icon
   ========================================================= */

/* Hide ACF's default globe icon on all URL fields in forms */
.fea-modal.edit-modal .acf-field-url .acf-icon.-globe {
    display: none !important;
}

/* =========================================================
   AGENT PROFILE PHOTO — Rounded square styling
   ========================================================= */

/* Image wrapper - rounded square container (left-aligned) */
.fea-modal.edit-modal .acf-field.el-fea-profile-photo .acf-image-uploader .image-wrap {
    width: 210px !important;
    height: 210px !important;
    max-width: 210px !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    position: relative !important;
}

/* Image - cover and center top */
.fea-modal.edit-modal .acf-field.el-fea-profile-photo .acf-image-uploader .image-wrap img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center top !important;
    border-radius: 16px !important;
}

/* Edit/Remove buttons - position on top-right on hover */
.fea-modal.edit-modal .acf-field.el-fea-profile-photo .acf-image-uploader .acf-actions.-hover {
    position: absolute !important;
    top: 8px !important;
    right: 8px !important;
    display: flex !important;
    gap: 8px !important;
    opacity: 0 !important;
    transition: opacity 0.2s ease !important;
}

.fea-modal.edit-modal .acf-field.el-fea-profile-photo .acf-image-uploader .image-wrap:hover .acf-actions.-hover {
    opacity: 1 !important;
}

/* Button styling - white circles */
.fea-modal.edit-modal .acf-field.el-fea-profile-photo .acf-image-uploader .acf-actions.-hover a.acf-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    background: #FFFFFF !important;
    border: 1px solid #FFFFFF !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
}

/* Center icons inside buttons */
.fea-modal.edit-modal .acf-field.el-fea-profile-photo .acf-image-uploader .acf-actions.-hover a.acf-icon::before {
    margin: 0 !important;
    margin-left: 1px !important;
}

/* Edit button (pencil) - blue */
.fea-modal.edit-modal .acf-field.el-fea-profile-photo .acf-image-uploader .acf-actions.-hover a.acf-icon.-pencil {
    color: #0047FF !important;
}

.fea-modal.edit-modal .acf-field.el-fea-profile-photo .acf-image-uploader .acf-actions.-hover a.acf-icon.-pencil:hover {
    background: #E6EDFF !important;
    border-color: #E6EDFF !important;
}

/* Remove button (X) - red */
.fea-modal.edit-modal .acf-field.el-fea-profile-photo .acf-image-uploader .acf-actions.-hover a.acf-icon.-cancel {
    color: #DC2626 !important;
}

.fea-modal.edit-modal .acf-field.el-fea-profile-photo .acf-image-uploader .acf-actions.-hover a.acf-icon.-cancel:hover {
    background: #FEE2E2 !important;
    border-color: #FEE2E2 !important;
}

/* =========================================================
   FEATURED IMAGE — Listings & Blog Posts
   =========================================================
   Landscape ratio (5:3) for property and blog cover photos.
   Empty state remains full-width (default ACF styling).
   ========================================================= */

/* Image wrapper - landscape rectangle container */
.fea-modal.edit-modal .acf-field.el-fea-featured-image .acf-image-uploader .image-wrap {
    width: 400px !important;
    height: 240px !important;
    max-width: 400px !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    position: relative !important;
}

/* Image - cover and center */
.fea-modal.edit-modal .acf-field.el-fea-featured-image .acf-image-uploader .image-wrap img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    border-radius: 16px !important;
}

/* Edit/Remove buttons - position on top-right on hover */
.fea-modal.edit-modal .acf-field.el-fea-featured-image .acf-image-uploader .acf-actions.-hover {
    position: absolute !important;
    top: 8px !important;
    right: 8px !important;
    display: flex !important;
    gap: 8px !important;
    opacity: 0 !important;
    transition: opacity 0.2s ease !important;
}

.fea-modal.edit-modal .acf-field.el-fea-featured-image .acf-image-uploader .image-wrap:hover .acf-actions.-hover {
    opacity: 1 !important;
}

/* Button styling - white circles */
.fea-modal.edit-modal .acf-field.el-fea-featured-image .acf-image-uploader .acf-actions.-hover a.acf-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    background: #FFFFFF !important;
    border: 1px solid #FFFFFF !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
}

/* Center icons inside buttons */
.fea-modal.edit-modal .acf-field.el-fea-featured-image .acf-image-uploader .acf-actions.-hover a.acf-icon::before {
    margin: 0 !important;
    margin-left: 1px !important;
}

/* Edit button (pencil) - blue */
.fea-modal.edit-modal .acf-field.el-fea-featured-image .acf-image-uploader .acf-actions.-hover a.acf-icon.-pencil {
    color: #0047FF !important;
}

.fea-modal.edit-modal .acf-field.el-fea-featured-image .acf-image-uploader .acf-actions.-hover a.acf-icon.-pencil:hover {
    background: #E6EDFF !important;
    border-color: #E6EDFF !important;
}

/* Remove button (X) - red */
.fea-modal.edit-modal .acf-field.el-fea-featured-image .acf-image-uploader .acf-actions.-hover a.acf-icon.-cancel {
    color: #DC2626 !important;
}

.fea-modal.edit-modal .acf-field.el-fea-featured-image .acf-image-uploader .acf-actions.-hover a.acf-icon.-cancel:hover {
    background: #FEE2E2 !important;
    border-color: #FEE2E2 !important;
}/* End custom CSS */