/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 *
 * Contents:
 * 1. Property single page and gallery
 * 2. WhatsApp actions
 * 3. Enquiry form
 * 4. Responsive rules
 * 5. Property listing shortcode
 * 6. Natural language property search
 * 7. Property chatbot
 * 8. Concierge chips, tray and actions
 * 9. Property comparison
 * 10. Site visit booking
 * 11. Property location map
 */
.estateai-property-single {
    padding: 48px 20px;
    background: #f6f7f8;
    color: #172334;
}

.estateai-property-container {
    max-width: 1200px;
    margin: 0 auto;
}

.estateai-property-header {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 26px;
}

.estateai-property-header h1 {
    margin: 7px 0;
    font-size: clamp(30px, 4vw, 48px);
    line-height: 1.12;
}

.estateai-property-terms a {
    color: var(--estateai-highlight-hover, #8c6a2d);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.estateai-property-address {
    margin: 0;
    color: #687584;
}

.estateai-property-price {
    color: #172334;
    font-size: 28px;
    font-weight: 700;
}

.estateai-property-gallery {
    overflow: hidden;
    margin-bottom: 28px;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 14px 40px rgba(21, 32, 51, .09);
}

.estateai-property-featured img {
    display: block;
    width: 100%;
    max-height: 620px;
    object-fit: cover;
}

.estateai-property-thumbnails {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
    gap: 8px;
    padding: 10px;
}

.estateai-property-thumbnails img {
    display: block;
    width: 100%;
    height: 88px;
    border-radius: 8px;
    object-fit: cover;
}

.estateai-property-layout {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr);
    gap: 28px;
    align-items: start;
}

.estateai-property-section,
.estateai-property-agent {
    margin-bottom: 22px;
    padding: 26px;
    border: 1px solid #e3e7eb;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(21, 32, 51, .05);
}

.estateai-property-section h2,
.estateai-property-agent h2 {
    margin: 0 0 20px;
    font-size: 20px;
}

.estateai-property-facts {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.estateai-property-facts div {
    padding: 14px;
    border-radius: 9px;
    background: #f3f6f8;
}

.estateai-property-facts span,
.estateai-property-facts strong {
    display: block;
}
.estateai-property-facts span {
    margin-bottom: 5px;
    color: #74808c;
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 700;
}
.estateai-property-description {
    line-height: 1.8;
}

.estateai-property-amenities {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.estateai-property-amenities li {
    display: flex;
    gap: 7px;
    align-items: center;
}

.estateai-property-amenities .dashicons {
    color: #00a32a;
}

/*
 * The agent card used to be sticky on its own. It is not the only thing in the
 * sidebar though -- the enquiry call to action and the enquiry form sit under
 * it -- so pinning just the card left the rest of the column sliding up behind
 * it. Sticking the whole column instead is no better, because a column that is
 * taller than the viewport gets its bottom pinned out of reach. The sidebar
 * scrolls with the page, which is the only behaviour that holds for any
 * combination of enquiry-form placement and description length.
 */
.estateai-property-agent {
    text-align: center;
}

.estateai-property-agent>.dashicons {
    width: 62px;
    height: 62px;
    color: var(--estateai-accent-hover, #23638f);
    font-size: 62px;
}

.estateai-property-agent strong,
.estateai-agent-email {
    display: block;
}

/*
 * Addressed by class, not as "every link in the agent card". The card also
 * holds the WhatsApp button, and a descendant selector here would outrank
 * .estateai-whatsapp-button and paint the official green over with navy.
 */
.estateai-agent-email,
.estateai-property-media-link {
    margin-top: 16px;
    padding: 11px 16px;
    border-radius: 8px;
    background: #172b40;
    color: #fff;
    text-align: center;
    text-decoration: none;
    font-size: 16px;
}
.estateai-property-agent .estateai-whatsapp-button {
  padding: 11px 0px !important;
  font-size: 16px !important;
}

.estateai-whatsapp-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    margin-top: 12px;
    padding: 12px 18px;
    border-radius: 8px;
    background: #25d366;
    color: #fff;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    box-shadow: 0 6px 18px rgba(37, 211, 102, .28);
    transition: background-color 160ms ease, transform 160ms ease;
}

.estateai-whatsapp-button:hover,
.estateai-whatsapp-button:focus {
    background: #1eb257;
    color: #fff;
    transform: translateY(-1px);
}

.estateai-whatsapp-icon {
    display: inline-flex;
}

.estateai-whatsapp-icon svg {
    display: block;
    width: 20px;
    height: 20px;
}

.estateai-property-agent .estateai-whatsapp-button {
    display: flex;
    width: 100%;
}

.estateai-whatsapp-floating {
    position: fixed;
    z-index: 9999;
    right: 22px;
    bottom: 22px;
    margin: 0;
    padding: 15px 19px;
    border-radius: 999px;
    box-shadow: 0 10px 30px rgba(21, 32, 51, .28);
}

.estateai-whatsapp-floating .estateai-whatsapp-icon svg {
    width: 24px;
    height: 24px;
}

@media(max-width:600px) {
    .estateai-whatsapp-floating {
        right: 16px;
        bottom: 16px;
        padding: 15px
    }

    .estateai-whatsapp-floating .estateai-whatsapp-label {
        display: none
    }
}

@media(prefers-reduced-motion:reduce) {
    .estateai-whatsapp-button {
        transition: none
    }
}

.estateai-inquiry {
    margin-bottom: 22px;
    padding: 26px;
    border: 1px solid #e3e7eb;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(21, 32, 51, .05);
}

.estateai-inquiry-title {
    margin: 0 0 8px;
    font-size: 20px;
}

.estateai-inquiry-intro {
    margin: 0 0 18px;
    color: #5d6977;
    font-size: 14px;
    line-height: 1.6;
}

.estateai-inquiry-notice {
    margin-bottom: 18px;
    padding: 12px 15px;
    border-radius: 9px;
    border-left: 4px solid #8c98a5;
    background: #f4f6f8;
    font-size: 14px;
    line-height: 1.6;
}

.estateai-inquiry-notice.is-success {
    border-left-color: #1a7f37;
    background: #edfaef;
    color: #14532d;
}

.estateai-inquiry-notice.is-error {
    border-left-color: #b32d2e;
    background: #fcf0f1;
    color: #7f1d1d;
}

.estateai-inquiry-field {
    margin: 0 0 14px;
}

.estateai-inquiry-field label {
    display: block;
    margin-bottom: 5px;
    font-size: 13px;
    font-weight: 600;
}

.estateai-inquiry-field input,
.estateai-inquiry-field textarea {
    box-sizing: border-box;
    width: 100%;
    padding: 11px 13px;
    border: 1px solid #d5dce4;
    border-radius: 8px;
    background: #fff;
    font: inherit;
    font-size: 14px;
}

.estateai-inquiry-field input:focus,
.estateai-inquiry-field textarea:focus {
    border-color: var(--estateai-accent-hover, #23638f);
    outline: 2px solid rgba(var(--estateai-accent-rgb, 35, 99, 143), .18);
    outline-offset: 1px;
}

.estateai-inquiry-field textarea {
    resize: vertical;
}

.estateai-inquiry-consent {
    margin: 0 0 16px;
    color: #5d6977;
    font-size: 13px;
    line-height: 1.5;
}

.estateai-inquiry-consent input {
    margin-right: 6px;
}

.estateai-inquiry-hp {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.estateai-inquiry-submit {
    margin: 0;
}

.estateai-inquiry-submit button {
    width: 100%;
    padding: 13px 18px;
    border: 0;
    border-radius: 8px;
    background: #172b40;
    color: #fff;
    font: inherit;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
}

.estateai-inquiry-submit button:hover {
    background: var(--estateai-accent-hover, #23638f);
}

@media(max-width:900px) {
    .estateai-property-layout {
        grid-template-columns: 1fr
    }

    .estateai-property-facts {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media(max-width:600px) {
    .estateai-property-header {
        display: block
    }

    .estateai-property-price {
        margin-top: 14px
    }

    .estateai-property-amenities {
        grid-template-columns: 1fr
    }

    .estateai-property-single {
        padding: 28px 14px
    }
}

/*
 * Modern single-listing polish.
 *
 * This layer sits on top of the plain rules above and does the visual work: the
 * dark price panel, the gallery treatment, the fact grid, the agent card and the
 * enquiry form. Everything that carries brand colour reads a token with the
 * shipped palette as its fallback, so an unconfigured install renders exactly as
 * it always did while a configured one repaints end to end.
 */
.estateai-property-single {
    --pn-ink: #101c2e;
    --pn-muted: #6a7b8f;
    --pn-blue: var(--estateai-accent-strong, #286b9d);
    --pn-navy: var(--estateai-accent-deepest, #101c2c);
    --pn-line: var(--estateai-highlight-line, #e3e9ef);
    --pn-canvas: #f4f7fa;
    padding: 52px 20px 80px;
    background: linear-gradient(180deg, var(--pn-canvas) 0%, #fff 46%);
    color: var(--pn-ink)
}

.estateai-property-container {
    max-width: 1220px
}

/* Header. */
.estateai-property-header {
    align-items: center;
    margin-bottom: 30px
}

.estateai-property-header h1 {
    margin: 12px 0 10px;
    font-size: clamp(31px, 3.9vw, 50px);
    font-weight: 700;
    letter-spacing: -.038em;
    line-height: 1.08
}

.estateai-property-terms {
    display: flex;
    flex-wrap: wrap;
    gap: 7px
}

.estateai-property-terms a {
    padding: 6px 13px;
    border: 1px solid var(--estateai-accent-line, #d7e6f1);
    border-radius: 999px;
    background: var(--estateai-accent-soft, #eaf3f9);
    color: var(--estateai-accent-hover, #25628e);
    font-size: 11px;
    letter-spacing: .08em;
    text-decoration: none;
    transition: background-color 160ms ease, border-color 160ms ease
}

.estateai-property-terms a:hover,
.estateai-property-terms a:focus {
    border-color: var(--estateai-accent, #2271b1);
    background: #fff
}

.estateai-property-address {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--pn-muted);
    font-size: 15px
}

.estateai-property-address .dashicons {
    color: var(--estateai-highlight-hover, #8c6a2d)
}

/*
 * The asking price is the one number every visitor looks for, so it gets the
 * strongest contrast on the page instead of another white box.
 */
.estateai-property-price {
    position: relative;
    overflow: hidden;
    min-width: 210px;
    padding: 20px 24px;
    border: 0;
    border-radius: 17px;
    background: linear-gradient(135deg, var(--estateai-accent-deepest, #101c2c) 0%, var(--estateai-accent-deeper, #192a40) 62%, var(--estateai-accent-deep, #253b54) 100%);
    color: #fff;
    font-size: 29px;
    font-weight: 700;
    letter-spacing: -.02em;
    box-shadow: 0 16px 34px rgba(16, 28, 44, .22)
}

.estateai-property-price::after {
    position: absolute;
    right: -34px;
    top: -34px;
    width: 104px;
    height: 104px;
    border-radius: 50%;
    background: var(--estateai-highlight, #c7a35a);
    content: "";
    opacity: .16
}

.estateai-property-price span {
    display: block;
    margin-bottom: 6px;
    color: var(--estateai-highlight-line, #e4c98f);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .13em;
    text-transform: uppercase
}

/* Gallery. */
.estateai-property-gallery {
    position: relative;
    overflow: hidden;
    margin-bottom: 30px;
    border: 1px solid var(--pn-line);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 24px 50px rgba(16, 34, 55, .13)
}

.estateai-property-featured {
    position: relative;
    background: #dfe7ed
}

.estateai-property-featured::after {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 120px;
    background: linear-gradient(180deg, rgba(9, 20, 33, 0) 0%, rgba(9, 20, 33, .42) 100%);
    content: "";
    pointer-events: none
}

.estateai-property-featured img {
    height: min(56vw, 610px)
}

.estateai-photo-count {
    position: absolute;
    z-index: 1;
    right: 18px;
    bottom: 18px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 14px;
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 999px;
    background: rgba(11, 23, 37, .62);
    color: #fff;
    font-size: 13px;
    font-weight: 600
}

.estateai-property-thumbnails {
    display: flex;
    gap: 10px;
    padding: 13px;
    overflow-x: auto
}

.estateai-gallery-thumb {
    width: 92px;
    height: 68px;
    flex: 0 0 92px;
    padding: 0;
    overflow: hidden;
    border: 0;
    border-radius: 11px;
    background: #e7edf2;
    box-shadow: 0 0 0 2px transparent;
    cursor: pointer;
    opacity: .62;
    transition: opacity 180ms ease, box-shadow 180ms ease, transform 180ms ease
}

.estateai-gallery-thumb.is-active,
.estateai-gallery-thumb:hover,
.estateai-gallery-thumb:focus {
    box-shadow: 0 0 0 2px var(--estateai-accent, #2271b1);
    opacity: 1;
    outline: 0;
    transform: translateY(-2px)
}

.estateai-gallery-thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover
}

/* Layout and panels. */
.estateai-property-layout {
    grid-template-columns: minmax(0, 1fr) 348px;
    gap: 30px
}

.estateai-property-section,
.estateai-property-agent,
.estateai-inquiry {
    margin-bottom: 24px;
    padding: 28px;
    border: 1px solid var(--pn-line);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 10px 30px rgba(20, 41, 62, .05)
}

.estateai-property-section h2,
.estateai-property-agent h2 {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 20px;
    font-size: 19px;
    font-weight: 700;
    letter-spacing: -.015em
}

.estateai-property-section h2::before {
    width: 4px;
    height: 19px;
    border-radius: 999px;
    background: var(--estateai-highlight, #c7a35a);
    content: ""
}

/* Overview facts. */
.estateai-property-facts {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
    gap: 12px
}

.estateai-property-facts div {
    padding: 15px 16px;
    border: 1px solid var(--pn-line);
    border-radius: 13px;
    background: linear-gradient(180deg, #fbfcfe 0%, #f6f9fb 100%);
    transition: border-color 170ms ease, transform 170ms ease
}

.estateai-property-facts div:hover {
    border-color: var(--estateai-accent-line, #cadeec);
    transform: translateY(-2px)
}

.estateai-property-facts span {
    margin-bottom: 6px;
    color: var(--pn-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .1em
}

.estateai-property-facts strong {
    color: var(--pn-ink);
    font-size: 17px;
    font-weight: 700
}

.estateai-property-description {
    color: #46586e;
    font-size: 16px;
    line-height: 1.85
}

/* Amenities. */
.estateai-property-amenities {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr))
}

.estateai-property-amenities li {
    padding: 11px 14px;
    border: 1px solid var(--pn-line);
    border-radius: 11px;
    background: #fff;
    font-size: 14px
}

.estateai-property-amenities .dashicons {
    color: #12a150
}

.estateai-property-media-link {
    display: inline-flex;
    align-items: center;
    margin-top: 4px;
    margin-right: 10px;
    padding: 11px 20px;
    border: 1px solid var(--estateai-accent-line, #cadeec);
    border-radius: 10px;
    background: var(--estateai-accent-soft, #eef7fc);
    color: var(--estateai-accent-hover, #135e96);
    font-size: 14px;
    font-weight: 600;
    transition: background-color 160ms ease, color 160ms ease
}

.estateai-property-media-link:hover,
.estateai-property-media-link:focus {
    background: var(--estateai-accent, #2271b1);
    color: #fff
}

/* Agent card. */
.estateai-property-agent {
    position: relative;
    overflow: hidden;
    padding: 30px 26px 26px;
    text-align: center
}

.estateai-property-agent::before {
    position: absolute;
    right: 0;
    top: 0;
    left: 0;
    height: 86px;
    background: linear-gradient(135deg, var(--estateai-accent-deepest, #101c2c) 0%, var(--estateai-accent-deeper, #192a40) 100%);
    content: ""
}

.estateai-agent-avatar {
    position: relative;
    display: grid;
    width: 74px;
    height: 74px;
    margin: 8px auto 13px;
    place-items: center;
    border: 3px solid #fff;
    border-radius: 50%;
    background: var(--estateai-highlight-soft, #f5ead2);
    color: var(--estateai-highlight-hover, #8c6a2d);
    box-shadow: 0 8px 20px rgba(16, 28, 44, .18)
}

.estateai-agent-avatar .dashicons {
    width: 34px;
    height: 34px;
    font-size: 34px
}

.estateai-agent-label {
    position: relative;
    color: var(--pn-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .13em;
    text-transform: uppercase
}

.estateai-property-agent h2 {
    justify-content: center;
    margin: 6px 0 8px;
    font-size: 22px
}

.estateai-property-agent p {
    margin: 0 0 20px;
    color: var(--pn-muted);
    font-size: 13px;
    line-height: 1.6
}

/*
 * The agent buttons are addressed one class at a time. A blanket rule on
 * ".estateai-property-agent a" would outrank .estateai-whatsapp-button and
 * repaint WhatsApp's official green, which is the one colour on the page that
 * has to stay put.
 */
.estateai-property-agent .estateai-agent-email {
    display: flex;
    box-sizing: border-box;
    width: 100%;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 0 0 10px;
    padding: 12px 18px;
    border-radius: 10px;
    background: var(--estateai-accent-deep, #193f61);
    color: #fff;
    font-weight: 600;
    text-decoration: none;
    transition: background-color 160ms ease, transform 160ms ease
}

.estateai-property-agent .estateai-agent-email:hover,
.estateai-property-agent .estateai-agent-email:focus {
    background: var(--estateai-accent-hover, #135e96);
    transform: translateY(-1px)
}

.estateai-property-agent .estateai-whatsapp-button {
    display: flex;
    width: 100%;
    margin-top: 0;
    padding: 12px 18px;
    border-radius: 10px
}

/* Enquiry call to action and form. */
.estateai-enquiry-cta {
    display: flex;
    align-items: center;
    gap: 13px;
    margin: 0 0 24px;
    padding: 16px 18px;
    border: 1px solid var(--estateai-accent-line, #d9e8f2);
    border-radius: 14px;
    background: var(--estateai-accent-soft, #eef7fc);
    color: var(--pn-ink);
    text-decoration: none;
    transition: border-color 160ms ease, transform 160ms ease
}

.estateai-enquiry-cta:hover,
.estateai-enquiry-cta:focus {
    border-color: var(--estateai-accent, #2271b1);
    transform: translateY(-2px)
}

.estateai-enquiry-cta>.dashicons {
    display: grid;
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    place-items: center;
    border-radius: 11px;
    background: #fff;
    color: var(--estateai-highlight-hover, #8c6a2d);
    font-size: 20px
}

.estateai-enquiry-cta span:last-child {
    display: grid;
    gap: 3px;
    color: var(--pn-muted);
    font-size: 12px
}

.estateai-enquiry-cta strong {
    color: var(--pn-ink);
    font-size: 14px
}

.estateai-inquiry {
    scroll-margin-top: 28px
}

.estateai-inquiry-title {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 19px;
    font-weight: 700;
    letter-spacing: -.015em
}

.estateai-inquiry-title::before {
    width: 4px;
    height: 19px;
    border-radius: 999px;
    background: var(--estateai-highlight, #c7a35a);
    content: ""
}

.estateai-inquiry-field label {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .01em
}

.estateai-inquiry-field input,
.estateai-inquiry-field textarea {
    min-height: 46px;
    border-color: #dbe3ec;
    border-radius: 10px;
    background: #fbfcfd;
    transition: border-color 150ms ease, background-color 150ms ease
}

.estateai-inquiry-field input:focus,
.estateai-inquiry-field textarea:focus {
    background: #fff
}

.estateai-inquiry-field textarea {
    min-height: 108px
}

.estateai-inquiry-submit button {
    width: 100%;
    padding: 13px 20px;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--estateai-accent-deep, #193f61) 0%, var(--estateai-accent-deepest, #101c2c) 100%);
    font-size: 15px;
    font-weight: 600;
    transition: transform 160ms ease, box-shadow 160ms ease
}

.estateai-inquiry-submit button:hover {
    background: linear-gradient(135deg, var(--estateai-accent-hover, #135e96) 0%, var(--estateai-accent-deep, #193f61) 100%);
    box-shadow: 0 12px 26px rgba(16, 28, 44, .22);
    transform: translateY(-1px)
}

@media(max-width:900px) {
    .estateai-property-layout {
        grid-template-columns: 1fr
    }

    .estateai-property-header {
        align-items: flex-start;
        flex-direction: column
    }

    .estateai-property-price {
        width: 100%;
        box-sizing: border-box
    }
}

@media(max-width:600px) {
    .estateai-property-single {
        padding: 30px 14px 52px
    }

    .estateai-property-gallery {
        margin: 0 -14px 25px;
        border-radius: 0;
        border-right: 0;
        border-left: 0
    }

    .estateai-property-featured img {
        height: 62vw;
        min-height: 240px
    }

    .estateai-property-section,
    .estateai-property-agent,
    .estateai-inquiry {
        padding: 22px;
        border-radius: 15px
    }

    .estateai-property-price {
        font-size: 25px
    }

    .estateai-property-facts {
        grid-template-columns: repeat(auto-fit, minmax(132px, 1fr))
    }
}

@media(prefers-reduced-motion:reduce) {

    .estateai-property-terms a,
    .estateai-gallery-thumb,
    .estateai-property-facts div,
    .estateai-property-media-link,
    .estateai-property-agent .estateai-agent-email,
    .estateai-enquiry-cta,
    .estateai-inquiry-field input,
    .estateai-inquiry-field textarea,
    .estateai-inquiry-submit button {
        transition: none
    }

    .estateai-gallery-thumb:hover,
    .estateai-property-facts div:hover,
    .estateai-enquiry-cta:hover,
    .estateai-property-agent .estateai-agent-email:hover,
    .estateai-inquiry-submit button:hover {
        transform: none
    }
}

/*
 * 5. Property listing shortcode.
 *
 * Every colour here comes from the branding tokens, so a listing dropped into a
 * page builder matches the CRM screens without the buyer configuring anything a
 * second time. The fallbacks are the shipped palette, which is what an unset
 * accent renders as.
 */
.estateai-listing {
    --pnl-ink: #152238;
    --pnl-muted: #69798c;
    --pnl-line: var(--estateai-highlight-line, #e1e8ee);
    display: grid;
    gap: 26px;
    color: var(--pnl-ink)
}

.estateai-listing-cols-1 {
    grid-template-columns: minmax(0, 1fr)
}

.estateai-listing-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr))
}

.estateai-listing-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr))
}

.estateai-listing-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr))
}

.estateai-listing-card {
    display: flex;
    overflow: hidden;
    flex-direction: column;
    border: 1px solid var(--pnl-line);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(21, 34, 56, .05);
    transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease
}

.estateai-listing-card:hover {
    transform: translateY(-4px);
    border-color: var(--estateai-accent, #2271b1);
    box-shadow: 0 18px 38px rgba(21, 34, 56, .12)
}

.estateai-listing-media {
    position: relative;
    display: block;
    overflow: hidden;
    background: var(--estateai-highlight-faint, #f2f5f8)
}

.estateai-listing-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 320ms ease
}

.estateai-listing-card:hover .estateai-listing-media img {
    transform: scale(1.05)
}

.estateai-listing-placeholder {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    color: var(--estateai-highlight-line, #c8d2dc);
    font-size: 52px
}

.estateai-listing-status,
.estateai-listing-featured {
    position: absolute;
    top: 12px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 11px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase
}

.estateai-listing-status {
    left: 12px;
    background: var(--estateai-accent-deep, #193f61);
    color: #fff
}

.estateai-listing-featured {
    right: 12px;
    background: var(--estateai-highlight, #c7a35a);
    color: #fff
}

.estateai-listing-featured .dashicons {
    width: 13px;
    height: 13px;
    font-size: 13px
}

.estateai-listing-body {
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: flex-start;
    gap: 9px;
    padding: 20px
}

.estateai-listing-price {
    margin: 0;
    color: var(--estateai-accent-strong, #286b9d);
    font-size: 21px;
    font-weight: 700;
    line-height: 1.2
}

.estateai-listing-title {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.35
}

.estateai-listing-title a {
    color: inherit;
    text-decoration: none
}

.estateai-listing-title a:hover,
.estateai-listing-title a:focus {
    color: var(--estateai-accent, #2271b1)
}

.estateai-listing-address {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin: 0;
    color: var(--pnl-muted);
    font-size: 13px;
    line-height: 1.5
}

.estateai-listing-address .dashicons {
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
    margin-top: 2px;
    color: var(--estateai-highlight-hover, #8c6a2d);
    font-size: 16px
}

.estateai-listing-excerpt {
    margin: 0;
    color: var(--pnl-muted);
    font-size: 14px;
    line-height: 1.6
}

.estateai-listing-facts {
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    gap: 8px 16px;
    margin: 4px 0 0;
    padding: 13px 0 0;
    border-top: 1px solid var(--pnl-line);
    list-style: none
}

.estateai-listing-facts li {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    color: var(--pnl-muted);
    font-size: 13px
}

.estateai-listing-facts .dashicons {
    width: 17px;
    height: 17px;
    color: var(--estateai-highlight-hover, #8c6a2d);
    font-size: 17px
}

.estateai-listing-button {
    margin-top: auto;
    padding: 10px 20px;
    border-radius: 9px;
    background: var(--estateai-accent, #2271b1);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none
}

.estateai-listing-button:hover,
.estateai-listing-button:focus {
    background: var(--estateai-accent-hover, #135e96);
    color: #fff
}

/* List layout: the same card turned on its side. */
.estateai-listing-list {
    gap: 20px
}

.estateai-listing-list .estateai-listing-card {
    display: grid;
    grid-template-columns: minmax(0, 300px) minmax(0, 1fr)
}

.estateai-listing-list .estateai-listing-media {
    height: 100%;
    min-height: 220px;
    aspect-ratio: auto
}

.estateai-listing-list .estateai-listing-body {
    padding: 24px
}

.estateai-listing-empty {
    padding: 34px 20px;
    border: 1px dashed var(--estateai-highlight-line, #d9e0e7);
    border-radius: 14px;
    background: var(--estateai-highlight-faint, #f7f9fb);
    color: #69798c;
    text-align: center
}

.estateai-listing-empty p {
    margin: 0
}

.estateai-listing-pagination {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 7px;
    margin-top: 30px
}

.estateai-listing-pagination .page-numbers {
    display: inline-flex;
    min-width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    border: 1px solid var(--estateai-highlight-line, #e1e8ee);
    border-radius: 9px;
    background: #fff;
    color: #152238;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none
}

.estateai-listing-pagination .page-numbers:hover,
.estateai-listing-pagination .page-numbers:focus {
    border-color: var(--estateai-accent, #2271b1);
    color: var(--estateai-accent, #2271b1)
}

.estateai-listing-pagination .page-numbers.current {
    border-color: var(--estateai-accent, #2271b1);
    background: var(--estateai-accent, #2271b1);
    color: #fff
}

@media(max-width:900px) {

    .estateai-listing-cols-3,
    .estateai-listing-cols-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .estateai-listing-list .estateai-listing-card {
        grid-template-columns: minmax(0, 220px) minmax(0, 1fr)
    }
}

@media(max-width:600px) {

    .estateai-listing-cols-2,
    .estateai-listing-cols-3,
    .estateai-listing-cols-4,
    .estateai-listing-list .estateai-listing-card {
        grid-template-columns: minmax(0, 1fr)
    }

    .estateai-listing-list .estateai-listing-media {
        min-height: 0;
        aspect-ratio: 4 / 3
    }
}

@media(prefers-reduced-motion:reduce) {

    .estateai-listing-card,
    .estateai-listing-media img {
        transition: none
    }

    .estateai-listing-card:hover,
    .estateai-listing-card:hover .estateai-listing-media img {
        transform: none
    }
}

/* 6. Natural language property search
   -------------------------------------------------------------- */

/*
 * The search box is the first thing a visitor meets, so it is built as a dark
 * hero panel rather than another white form: it has to read as the centrepiece
 * of the page next to whatever the theme puts around it.
 *
 * Everything is scoped to .estateai-ai-search and written with two class
 * selectors wherever a theme is likely to have an opinion -- buttons, inputs
 * and list items are the three things every theme restyles, and this has to
 * look identical on all of them.
 */
.estateai-ai-search {
    box-sizing: border-box;
    margin: 0 0 40px;
    color: #152238
}

.estateai-ai-search *,
.estateai-ai-search *::before,
.estateai-ai-search *::after {
    box-sizing: border-box
}

.estateai-ai-search .estateai-ai-search-panel {
    position: relative;
    z-index: 0;
    overflow: hidden;
    padding: clamp(26px, 4vw, 46px);
    border-radius: 26px;
    background:
        radial-gradient(120% 130% at 85% -10%, rgba(255, 255, 255, .16) 0, rgba(255, 255, 255, 0) 55%),
        linear-gradient(135deg, var(--estateai-accent-deepest, #0e1a2b) 0, var(--estateai-accent-deep, #1d4468) 62%, var(--estateai-accent-hover, #135e96) 100%);
    box-shadow: 0 26px 60px rgba(14, 26, 43, .28)
}

/* A soft glow behind the field, so the panel has depth without an image. */
.estateai-ai-search .estateai-ai-search-panel::after {
    content: "";
    position: absolute;
    z-index: -1;
    right: -80px;
    bottom: -140px;
    width: 340px;
    height: 340px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 255, 255, .14) 0, rgba(255, 255, 255, 0) 70%)
}

.estateai-ai-search .estateai-ai-search-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 15px 7px 12px;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 999px;
    background: rgba(255, 255, 255, .12);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: .09em;
    text-transform: uppercase
}

.estateai-ai-search .estateai-ai-search-badge .dashicons {
    width: 15px;
    height: 15px;
    color: var(--estateai-highlight, #e9c979);
    font-size: 15px;
    line-height: 15px
}

.estateai-ai-search .estateai-ai-search-title {
    margin: 16px 0 10px;
    padding: 0;
    border: 0;
    color: #fff;
    font-family: inherit;
    font-size: clamp(26px, 3.4vw, 40px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -.02em;
    text-transform: none
}

.estateai-ai-search .estateai-ai-search-intro {
    max-width: 62ch;
    margin: 0;
    color: rgba(255, 255, 255, .72);
    font-size: clamp(15px, 1.4vw, 17px);
    line-height: 1.6
}

/* The field and its button read as one control, so they share one shell. */
.estateai-ai-search .estateai-ai-search-form {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    margin-top: 26px;
    padding: 8px 8px 8px 20px;
    border: 1px solid rgba(255, 255, 255, .5);
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 18px 44px rgba(8, 17, 30, .3)
}

.estateai-ai-search .estateai-ai-search-form:focus-within {
    border-color: #fff;
    box-shadow: 0 18px 44px rgba(8, 17, 30, .34), 0 0 0 4px rgba(255, 255, 255, .28)
}

.estateai-ai-search .estateai-ai-search-icon {
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
    color: var(--estateai-accent, #2271b1);
    font-size: 22px;
    line-height: 22px
}

.estateai-ai-search .estateai-ai-search-input {
    flex: 1 1 220px;
    min-width: 0;
    width: auto;
    height: auto;
    margin: 0;
    padding: 13px 4px;
    border: 0;
    border-radius: 0;
    outline: 0;
    background: transparent;
    box-shadow: none;
    color: #152238;
    font-family: inherit;
    font-size: 16px;
    line-height: 1.45;
    -webkit-appearance: none;
    appearance: none
}

.estateai-ai-search .estateai-ai-search-input:focus {
    border: 0;
    outline: 0;
    box-shadow: none
}

.estateai-ai-search .estateai-ai-search-input::placeholder {
    color: #9aa8bb;
    opacity: 1
}

.estateai-ai-search .estateai-ai-search-input::-webkit-search-cancel-button {
    -webkit-appearance: none
}

.estateai-ai-search .estateai-ai-search-submit {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 0;
    margin: 0;
    padding: 15px 32px;
    border: 0;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--estateai-accent, #2271b1) 0, var(--estateai-accent-hover, #135e96) 100%);
    color: #fff;
    font-family: inherit;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: .01em;
    text-transform: none;
    text-decoration: none;
    cursor: pointer;
    box-shadow: 0 8px 20px rgba(19, 94, 150, .35);
    transition: transform 180ms ease, box-shadow 180ms ease, filter 180ms ease;
    -webkit-appearance: none;
    appearance: none
}

.estateai-ai-search .estateai-ai-search-submit:hover,
.estateai-ai-search .estateai-ai-search-submit:focus {
    color: #fff;
    filter: brightness(1.08);
    transform: translateY(-2px);
    box-shadow: 0 14px 28px rgba(19, 94, 150, .42)
}

.estateai-ai-search .estateai-ai-search-submit[disabled] {
    opacity: .72;
    transform: none;
    cursor: progress
}

.estateai-ai-search .estateai-ai-search-examples {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 18px 0 0
}

.estateai-ai-search .estateai-ai-search-examples-label {
    color: rgba(255, 255, 255, .55);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase
}

.estateai-ai-search .estateai-ai-search-example {
    margin: 0;
    padding: 8px 16px;
    border: 1px solid rgba(255, 255, 255, .24);
    border-radius: 999px;
    background: rgba(255, 255, 255, .08);
    color: rgba(255, 255, 255, .86);
    font-family: inherit;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: normal;
    text-transform: none;
    cursor: pointer;
    transition: background-color 180ms ease, color 180ms ease, border-color 180ms ease, transform 180ms ease;
    -webkit-appearance: none;
    appearance: none
}

.estateai-ai-search .estateai-ai-search-example:hover,
.estateai-ai-search .estateai-ai-search-example:focus {
    border-color: #fff;
    background: #fff;
    color: var(--estateai-accent-deep, #1d4468);
    transform: translateY(-1px)
}

/* Status line, shown while a search is in flight or when one fails. */
.estateai-ai-search .estateai-ai-search-status:empty {
    display: none
}

.estateai-ai-search .estateai-ai-search-status {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 20px;
    padding: 13px 18px;
    border: 1px solid var(--estateai-accent-line, #cadeec);
    border-radius: 14px;
    background: var(--estateai-accent-soft, #eef7fc);
    color: var(--estateai-accent-deep, #1d4468);
    font-size: 14px;
    font-weight: 600
}

.estateai-ai-search .estateai-ai-search-status::before {
    content: "";
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    border: 2px solid rgba(29, 68, 104, .22);
    border-top-color: var(--estateai-accent, #2271b1);
    border-radius: 50%;
    animation: estateai-ai-search-spin 700ms linear infinite
}

@keyframes estateai-ai-search-spin {
    to {
        transform: rotate(360deg)
    }
}

/* Result summary bar
   -------------------------------------------------------------- */

.estateai-ai-search .estateai-ai-search-report:not(:empty) {
    margin-top: 26px;
    padding: 22px 24px;
    border: 1px solid var(--estateai-highlight-line, #e6ecf2);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 10px 30px rgba(21, 32, 51, .06)
}

.estateai-ai-search .estateai-ai-search-summary {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    margin: 0 0 16px;
    padding: 14px 16px;
    border-radius: 14px;
    background: linear-gradient(120deg, var(--estateai-accent-soft, #eef7fc) 0, rgba(255, 255, 255, 0) 120%);
    color: #152238;
    font-size: 15px;
    line-height: 1.6
}

.estateai-ai-search .estateai-ai-search-summary-icon {
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--estateai-accent, #2271b1) 0, var(--estateai-accent-hover, #135e96) 100%);
    color: #fff;
    font-size: 17px;
    line-height: 32px;
    text-align: center
}

.estateai-ai-search .estateai-ai-search-headline {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    justify-content: space-between
}

.estateai-ai-search .estateai-ai-search-count {
    margin: 0;
    color: #5b6b80;
    font-size: 15px;
    font-weight: 500
}

.estateai-ai-search .estateai-ai-search-count strong {
    margin-right: 4px;
    color: #152238;
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -.01em
}

.estateai-ai-search .estateai-ai-search-count:focus {
    outline: 0
}

.estateai-ai-search .estateai-ai-search-mode {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 13px;
    border: 1px solid var(--estateai-accent-line, #cadeec);
    border-radius: 999px;
    background: var(--estateai-accent-soft, #eef7fc);
    color: var(--estateai-accent-hover, #135e96);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    white-space: nowrap
}

.estateai-ai-search .estateai-ai-search-mode .dashicons {
    width: 14px;
    height: 14px;
    font-size: 14px;
    line-height: 14px
}

.estateai-ai-search ul.estateai-ai-search-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 16px 0 0;
    padding: 0;
    list-style: none
}

.estateai-ai-search ul.estateai-ai-search-chips>li {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin: 0;
    padding: 7px 15px;
    border: 1px solid var(--estateai-highlight-line, #e6ecf2);
    border-radius: 999px;
    background: #f8fafc;
    color: #24394e;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    list-style: none
}

.estateai-ai-search ul.estateai-ai-search-chips>li::marker {
    content: none
}

.estateai-ai-search ul.estateai-ai-search-chips>li::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--estateai-accent, #2271b1)
}

.estateai-ai-search .estateai-ai-search-note {
    display: flex;
    gap: 8px;
    align-items: center;
    margin: 16px 0 0;
    padding-top: 14px;
    border-top: 1px dashed var(--estateai-highlight-line, #e6ecf2);
    color: #7c8ba0;
    font-size: 14px
}

.estateai-ai-search .estateai-ai-search-note .dashicons {
    width: 17px;
    height: 17px;
    color: var(--estateai-accent, #2271b1);
    font-size: 17px;
    line-height: 17px
}

/* Result cards
   --------------------------------------------------------------
   The cards are the same markup the listing shortcode prints, so the
   overrides below stay scoped to the search: one set of markup, two
   presentations, and a listing elsewhere on the page is untouched. */

.estateai-ai-search .estateai-listing {
    margin-top: 22px
}

.estateai-ai-search .estateai-listing-card {
    overflow: hidden;
    border: 1px solid var(--estateai-highlight-line, #eaeff4);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 6px 18px rgba(21, 32, 51, .05);
    transition: transform 260ms cubic-bezier(.2, .7, .3, 1), box-shadow 260ms ease, border-color 260ms ease
}

.estateai-ai-search .estateai-listing-card:hover {
    border-color: var(--estateai-accent-line, #cadeec);
    transform: translateY(-7px);
    box-shadow: 0 26px 50px rgba(21, 32, 51, .16)
}

.estateai-ai-search .estateai-listing-media {
    position: relative;
    display: block;
    overflow: hidden;
    aspect-ratio: 4 / 3;
    background: #eef2f6
}

.estateai-ai-search .estateai-listing-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 520ms cubic-bezier(.2, .7, .3, 1)
}

.estateai-ai-search .estateai-listing-card:hover .estateai-listing-media img {
    transform: scale(1.07)
}

/* A scrim under the badges, so white text holds on a bright photo. */
.estateai-ai-search .estateai-listing-media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(10, 20, 34, .38) 0, rgba(10, 20, 34, 0) 38%, rgba(10, 20, 34, 0) 62%, rgba(10, 20, 34, .3) 100%);
    pointer-events: none
}

.estateai-ai-search .estateai-listing-status,
.estateai-ai-search .estateai-listing-featured {
    z-index: 1;
    padding: 7px 14px;
    border: 1px solid rgba(255, 255, 255, .3);
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    backdrop-filter: blur(6px)
}

.estateai-ai-search .estateai-listing-status {
    background: rgba(11, 22, 38, .58);
    color: #fff
}

.estateai-ai-search .estateai-listing-featured {
    background: linear-gradient(135deg, var(--estateai-highlight, #e6b455) 0, var(--estateai-highlight-hover, #c08f31) 100%);
    border-color: rgba(255, 255, 255, .38);
    color: #24180a
}

.estateai-ai-search .estateai-listing-body {
    padding: 22px
}

.estateai-ai-search .estateai-listing-price {
    margin: 0 0 6px;
    color: var(--estateai-accent-hover, #135e96);
    font-size: 21px;
    font-weight: 800;
    letter-spacing: -.01em
}

.estateai-ai-search .estateai-listing-title {
    margin: 0 0 8px;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.35
}

.estateai-ai-search .estateai-listing-title a {
    color: #152238;
    text-decoration: none;
    transition: color 180ms ease
}

.estateai-ai-search .estateai-listing-title a:hover,
.estateai-ai-search .estateai-listing-title a:focus {
    color: var(--estateai-accent, #2271b1)
}

.estateai-ai-search .estateai-listing-address {
    display: flex;
    gap: 5px;
    align-items: center;
    margin: 0 0 10px;
    color: #7c8ba0;
    font-size: 13px
}

.estateai-ai-search .estateai-listing-address .dashicons {
    width: 15px;
    height: 15px;
    color: var(--estateai-accent, #2271b1);
    font-size: 15px;
    line-height: 15px
}

.estateai-ai-search .estateai-listing-excerpt {
    display: -webkit-box;
    overflow: hidden;
    margin: 0 0 14px;
    color: #5b6b80;
    font-size: 14px;
    line-height: 1.65;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}

.estateai-ai-search ul.estateai-listing-facts {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 16px;
    padding: 14px 0 0;
    border-top: 1px dashed var(--estateai-highlight-line, #e6ecf2);
    list-style: none
}

.estateai-ai-search ul.estateai-listing-facts>li {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    padding: 6px 12px;
    border-radius: 10px;
    background: #f5f8fb;
    color: #24394e;
    font-size: 12.5px;
    font-weight: 600;
    list-style: none
}

.estateai-ai-search ul.estateai-listing-facts>li::marker,
.estateai-ai-search ul.estateai-listing-facts>li::before {
    content: none
}

.estateai-ai-search ul.estateai-listing-facts .dashicons {
    width: 15px;
    height: 15px;
    color: var(--estateai-accent, #2271b1);
    font-size: 15px;
    line-height: 15px
}

.estateai-ai-search .estateai-listing-button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 12px 18px;
    border: 1px solid var(--estateai-accent-line, #cadeec);
    border-radius: 12px;
    background: var(--estateai-accent-soft, #eef7fc);
    color: var(--estateai-accent-hover, #135e96);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    transition: background 200ms ease, color 200ms ease, border-color 200ms ease
}

.estateai-ai-search .estateai-listing-button:hover,
.estateai-ai-search .estateai-listing-button:focus {
    border-color: transparent;
    background: linear-gradient(135deg, var(--estateai-accent, #2271b1) 0, var(--estateai-accent-hover, #135e96) 100%);
    color: #fff
}

/* Empty state
   -------------------------------------------------------------- */

.estateai-ai-search .estateai-ai-search-empty {
    margin-top: 22px;
    padding: 46px 24px;
    border: 1px solid var(--estateai-highlight-line, #e6ecf2);
    border-radius: 22px;
    background: linear-gradient(180deg, #fbfcfe 0, #fff 100%);
    text-align: center
}

.estateai-ai-search .estateai-ai-search-empty-icon {
    width: 58px;
    height: 58px;
    margin-bottom: 14px;
    border-radius: 50%;
    background: var(--estateai-accent-soft, #eef7fc);
    color: var(--estateai-accent, #2271b1);
    font-size: 26px;
    line-height: 58px
}

.estateai-ai-search .estateai-ai-search-empty h3 {
    margin: 0 0 8px;
    color: #152238;
    font-size: 19px;
    font-weight: 700
}

.estateai-ai-search .estateai-ai-search-empty p {
    max-width: 46ch;
    margin: 0 auto 16px;
    color: #7c8ba0;
    font-size: 15px;
    line-height: 1.6
}

.estateai-ai-search .estateai-ai-search-empty p:last-child {
    margin-bottom: 0
}

.estateai-ai-search .estateai-ai-search-empty-link {
    display: inline-flex;
    align-items: center;
    padding: 12px 26px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--estateai-accent, #2271b1) 0, var(--estateai-accent-hover, #135e96) 100%);
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 8px 20px rgba(19, 94, 150, .3)
}

.estateai-ai-search .estateai-ai-search-empty-link:hover,
.estateai-ai-search .estateai-ai-search-empty-link:focus {
    color: #fff;
    filter: brightness(1.08)
}

/* Loading skeletons
   --------------------------------------------------------------
   Printed by the script while a search is in flight, so the page keeps
   its shape instead of collapsing to an empty box and jumping back. */

.estateai-ai-search .estateai-ai-search-skeleton {
    display: grid;
    gap: 24px;
    margin-top: 26px
}

.estateai-ai-search .estateai-ai-search-skeleton-card {
    overflow: hidden;
    border: 1px solid var(--estateai-highlight-line, #eaeff4);
    border-radius: 22px;
    background: #fff
}

.estateai-ai-search .estateai-ai-search-skeleton-media {
    aspect-ratio: 4 / 3
}

.estateai-ai-search .estateai-ai-search-skeleton-body {
    padding: 22px
}

.estateai-ai-search .estateai-ai-search-skeleton-line {
    height: 13px;
    margin-bottom: 11px;
    border-radius: 7px
}

.estateai-ai-search .estateai-ai-search-skeleton-line.is-price {
    width: 42%;
    height: 20px
}

.estateai-ai-search .estateai-ai-search-skeleton-line.is-short {
    width: 62%;
    margin-bottom: 0
}

.estateai-ai-search .estateai-ai-search-skeleton-media,
.estateai-ai-search .estateai-ai-search-skeleton-line {
    background: linear-gradient(100deg, #eef1f5 30%, #f7f9fb 50%, #eef1f5 70%);
    background-size: 220% 100%;
    animation: estateai-ai-search-shimmer 1.4s ease-in-out infinite
}

@keyframes estateai-ai-search-shimmer {
    from {
        background-position: 180% 0
    }

    to {
        background-position: -40% 0
    }
}

/* Responsive
   -------------------------------------------------------------- */

@media(max-width:900px) {

    .estateai-ai-search .estateai-ai-search-panel {
        border-radius: 22px
    }
}

@media(max-width:600px) {

    .estateai-ai-search .estateai-ai-search-form {
        padding: 14px;
        border-radius: 18px
    }

    .estateai-ai-search .estateai-ai-search-icon {
        display: none
    }

    .estateai-ai-search .estateai-ai-search-input {
        flex: 1 1 100%;
        padding: 4px 2px 12px
    }

    .estateai-ai-search .estateai-ai-search-submit {
        width: 100%
    }

    .estateai-ai-search .estateai-ai-search-report:not(:empty) {
        padding: 18px
    }

    .estateai-ai-search .estateai-ai-search-headline {
        align-items: flex-start;
        justify-content: flex-start
    }
}

@media(prefers-reduced-motion:reduce) {

    .estateai-ai-search .estateai-ai-search-submit,
    .estateai-ai-search .estateai-ai-search-example,
    .estateai-ai-search .estateai-listing-card,
    .estateai-ai-search .estateai-listing-media img,
    .estateai-ai-search .estateai-listing-button {
        transition: none
    }

    .estateai-ai-search .estateai-ai-search-submit:hover,
    .estateai-ai-search .estateai-ai-search-example:hover,
    .estateai-ai-search .estateai-listing-card:hover,
    .estateai-ai-search .estateai-listing-card:hover .estateai-listing-media img {
        transform: none
    }

    .estateai-ai-search .estateai-ai-search-status::before,
    .estateai-ai-search .estateai-ai-search-skeleton-media,
    .estateai-ai-search .estateai-ai-search-skeleton-line {
        animation: none
    }
}
/* 7. Property chatbot
   -------------------------------------------------------------- */

.estateai-chat,
.estateai-chat *,
.estateai-chat *::before,
.estateai-chat *::after {
    box-sizing: border-box
}

.estateai-chat-floating {
    position: fixed;
    z-index: 9998;
    right: 22px;
    bottom: 22px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 14px
}

/*
 * The WhatsApp button already owns the bottom right corner when it is on, so
 * the launcher sits above it rather than on top of it.
 */
.estateai-chat-floating:has(~ .estateai-whatsapp-floating),
body:has(.estateai-whatsapp-floating) .estateai-chat-floating {
    bottom: 100px
}

.estateai-chat-launcher {
    order: 2;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin: 0;
    padding: 15px 22px;
    border: 0;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--estateai-accent, #2271b1) 0, var(--estateai-accent-deep, #193f61) 100%);
    color: #fff;
    font-family: inherit;
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    cursor: pointer;
    box-shadow: 0 14px 34px rgba(14, 26, 43, .32);
    transition: transform 200ms ease, box-shadow 200ms ease;
    -webkit-appearance: none;
    appearance: none
}

.estateai-chat-launcher:hover,
.estateai-chat-launcher:focus {
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 20px 40px rgba(14, 26, 43, .4)
}

.estateai-chat-launcher .dashicons {
    width: 21px;
    height: 21px;
    font-size: 21px;
    line-height: 21px
}

.estateai-chat-launcher-close,
.estateai-chat.is-open .estateai-chat-launcher-icon {
    display: none
}

.estateai-chat.is-open .estateai-chat-launcher-close {
    display: inline-block
}

.estateai-chat-panel {
    display: flex;
    overflow: hidden;
    flex-direction: column;
    border: 1px solid var(--estateai-highlight-line, #e6ecf2);
    border-radius: 22px;
    background: #fff;
    color: #152238;
    box-shadow: 0 26px 60px rgba(14, 26, 43, .22)
}

.estateai-chat-panel[hidden] {
    display: none
}

.estateai-chat-floating .estateai-chat-panel {
    order: 1;
    width: min(370px, calc(100vw - 36px));
    animation: estateai-chat-in 220ms cubic-bezier(.2, .7, .3, 1)
}

.estateai-chat-inline .estateai-chat-panel {
    width: 100%;
    max-width: 560px;
    margin: 0 0 32px
}

@keyframes estateai-chat-in {
    from {
        opacity: 0;
        transform: translateY(14px)
    }
}

.estateai-chat-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 18px 20px;
    background:
        radial-gradient(120% 140% at 88% -20%, rgba(255, 255, 255, .18) 0, rgba(255, 255, 255, 0) 60%),
        linear-gradient(135deg, var(--estateai-accent-deepest, #0e1a2b) 0, var(--estateai-accent-deep, #1d4468) 100%);
    color: #fff
}

.estateai-chat-avatar {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    border: 1px solid rgba(255, 255, 255, .26);
    border-radius: 50%;
    background: rgba(255, 255, 255, .14);
    color: var(--estateai-highlight, #e9c979);
    font-size: 20px;
    line-height: 38px;
    text-align: center
}

.estateai-chat-identity {
    flex: 1 1 auto;
    min-width: 0;
    line-height: 1.35
}

.estateai-chat-identity strong {
    display: block;
    color: #fff;
    font-size: 15px;
    font-weight: 700
}

.estateai-chat-subtitle {
    display: flex;
    align-items: center;
    gap: 6px;
    color: rgba(255, 255, 255, .68);
    font-size: 12px
}

.estateai-chat-subtitle::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #37d67a;
    box-shadow: 0 0 0 3px rgba(55, 214, 122, .22)
}

.estateai-chat-close {
    flex: 0 0 auto;
    padding: 6px;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, .12);
    color: #fff;
    line-height: 0;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none
}

.estateai-chat-close:hover,
.estateai-chat-close:focus {
    background: rgba(255, 255, 255, .24);
    color: #fff
}

.estateai-chat-log {
    display: flex;
    overflow-y: auto;
    flex-direction: column;
    gap: 12px;
    height: 380px;
    padding: 20px;
    background: #f7f9fc;
    scroll-behavior: smooth
}

.estateai-chat-inline .estateai-chat-log {
    height: 440px
}

.estateai-chat-message {
    display: flex;
    flex-direction: column;
    max-width: 86%
}

.estateai-chat-message.is-visitor {
    align-self: flex-end;
    align-items: flex-end
}

.estateai-chat-bubble {
    margin: 0;
    padding: 12px 15px;
    border-radius: 16px;
    font-size: 14.5px;
    line-height: 1.6;
    overflow-wrap: anywhere
}

.estateai-chat-message.is-bot .estateai-chat-bubble {
    border: 1px solid var(--estateai-highlight-line, #e6ecf2);
    border-bottom-left-radius: 5px;
    background: #fff;
    color: #24394e;
    box-shadow: 0 4px 12px rgba(21, 32, 51, .05)
}

.estateai-chat-message.is-visitor .estateai-chat-bubble {
    border-bottom-right-radius: 5px;
    background: linear-gradient(135deg, var(--estateai-accent, #2271b1) 0, var(--estateai-accent-hover, #135e96) 100%);
    color: #fff
}

.estateai-chat-dots {
    display: flex;
    gap: 5px;
    align-items: center;
    padding: 15px
}

.estateai-chat-dots span {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #9fb0c4;
    animation: estateai-chat-blink 1.2s infinite ease-in-out
}

.estateai-chat-dots span:nth-child(2) {
    animation-delay: .18s
}

.estateai-chat-dots span:nth-child(3) {
    animation-delay: .36s
}

@keyframes estateai-chat-blink {

    0%,
    80%,
    100% {
        opacity: .3;
        transform: translateY(0)
    }

    40% {
        opacity: 1;
        transform: translateY(-3px)
    }
}

/* Listing cards attached to a reply. */
.estateai-chat-attachments {
    width: 100%;
    margin-top: 8px
}

.estateai-chat-cards {
    display: flex;
    flex-direction: column;
    gap: 8px
}

.estateai-chat-card {
    display: flex;
    gap: 12px;
    align-items: center;
    padding: 10px;
    border: 1px solid var(--estateai-highlight-line, #e6ecf2);
    border-radius: 14px;
    background: #fff;
    color: inherit;
    text-decoration: none;
    box-shadow: 0 4px 12px rgba(21, 32, 51, .05);
    transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease
}

.estateai-chat-card:hover,
.estateai-chat-card:focus {
    border-color: var(--estateai-accent-line, #cadeec);
    color: inherit;
    transform: translateY(-2px);
    box-shadow: 0 12px 26px rgba(21, 32, 51, .12)
}

.estateai-chat-card-media {
    position: relative;
    display: block;
    overflow: hidden;
    flex: 0 0 auto;
    width: 62px;
    height: 62px;
    border-radius: 11px;
    background: var(--estateai-highlight-faint, #f2f5f8);
    color: #9fb0c4;
    font-size: 24px;
    line-height: 62px;
    text-align: center
}

.estateai-chat-card-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover
}

.estateai-chat-card-body {
    min-width: 0;
    line-height: 1.45
}

.estateai-chat-card-title {
    display: block;
    overflow: hidden;
    color: #152238;
    font-size: 13.5px;
    font-weight: 700;
    white-space: nowrap;
    text-overflow: ellipsis
}

.estateai-chat-card-price {
    display: block;
    color: var(--estateai-accent-hover, #135e96);
    font-size: 14px;
    font-weight: 800
}

.estateai-chat-card-meta {
    display: block;
    color: #7c8ba0;
    font-size: 12px
}

/* Quick replies, contact form and composer. */
.estateai-chat-quick {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    padding: 12px 16px 0;
    background: #fff
}

.estateai-chat-quick[hidden] {
    display: none
}

.estateai-chat-quick-item {
    margin: 0;
    padding: 7px 14px;
    border: 1px solid var(--estateai-accent-line, #cadeec);
    border-radius: 999px;
    background: var(--estateai-accent-soft, #eef7fc);
    color: var(--estateai-accent-hover, #135e96);
    font-family: inherit;
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.4;
    text-transform: none;
    cursor: pointer;
    transition: background 180ms ease, color 180ms ease;
    -webkit-appearance: none;
    appearance: none
}

.estateai-chat-quick-item:hover,
.estateai-chat-quick-item:focus {
    background: var(--estateai-accent, #2271b1);
    color: #fff
}

.estateai-chat-lead {
    padding: 16px;
    border-top: 1px solid var(--estateai-highlight-line, #e6ecf2);
    background: linear-gradient(180deg, var(--estateai-accent-soft, #eef7fc) 0, #fff 100%)
}

.estateai-chat-lead[hidden] {
    display: none
}

.estateai-chat-lead-intro {
    margin: 0 0 10px;
    color: #24394e;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.5
}

.estateai-chat .estateai-chat-lead-field {
    display: block;
    width: 100%;
    height: auto;
    margin: 0 0 8px;
    padding: 11px 13px;
    border: 1px solid var(--estateai-highlight-line, #dfe7ee);
    border-radius: 11px;
    background: #fff;
    color: #152238;
    font-family: inherit;
    font-size: 14px;
    line-height: 1.4;
    -webkit-appearance: none;
    appearance: none
}

.estateai-chat .estateai-chat-lead-field:focus {
    outline: 0;
    border-color: var(--estateai-accent, #2271b1);
    box-shadow: 0 0 0 3px rgba(34, 113, 177, .14)
}

.estateai-chat-lead-actions {
    display: flex;
    gap: 8px;
    align-items: center
}

.estateai-chat-lead-send {
    flex: 1 1 auto;
    margin: 0;
    padding: 12px 18px;
    border: 0;
    border-radius: 11px;
    background: linear-gradient(135deg, var(--estateai-accent, #2271b1) 0, var(--estateai-accent-hover, #135e96) 100%);
    color: #fff;
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    text-transform: none;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none
}

.estateai-chat-lead-send:hover,
.estateai-chat-lead-send:focus {
    color: #fff;
    filter: brightness(1.08)
}

.estateai-chat-lead-send[disabled] {
    opacity: .7;
    cursor: default
}

.estateai-chat-lead-skip {
    margin: 0;
    padding: 12px 14px;
    border: 0;
    border-radius: 11px;
    background: transparent;
    color: #7c8ba0;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    text-transform: none;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none
}

.estateai-chat-lead-skip:hover,
.estateai-chat-lead-skip:focus {
    color: #24394e
}

.estateai-chat-form {
    display: flex;
    gap: 8px;
    align-items: center;
    padding: 14px 16px;
    border-top: 1px solid var(--estateai-highlight-line, #e6ecf2);
    background: #fff
}

.estateai-chat .estateai-chat-input {
    flex: 1 1 auto;
    min-width: 0;
    width: auto;
    height: auto;
    margin: 0;
    padding: 12px 16px;
    border: 1px solid var(--estateai-highlight-line, #dfe7ee);
    border-radius: 999px;
    background: #f7f9fc;
    color: #152238;
    font-family: inherit;
    font-size: 14.5px;
    line-height: 1.4;
    -webkit-appearance: none;
    appearance: none
}

.estateai-chat .estateai-chat-input:focus {
    outline: 0;
    border-color: var(--estateai-accent, #2271b1);
    background: #fff;
    box-shadow: 0 0 0 3px rgba(34, 113, 177, .14)
}

.estateai-chat .estateai-chat-input[disabled] {
    opacity: .6
}

.estateai-chat-send {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--estateai-accent, #2271b1) 0, var(--estateai-accent-hover, #135e96) 100%);
    color: #fff;
    line-height: 0;
    cursor: pointer;
    box-shadow: 0 8px 18px rgba(19, 94, 150, .3);
    transition: transform 180ms ease, filter 180ms ease;
    -webkit-appearance: none;
    appearance: none
}

.estateai-chat-send:hover,
.estateai-chat-send:focus {
    color: #fff;
    filter: brightness(1.08);
    transform: scale(1.05)
}

.estateai-chat.is-busy .estateai-chat-send {
    opacity: .6;
    transform: none
}

@media(max-width:600px) {

    .estateai-chat-floating {
        right: 14px;
        bottom: 14px;
        gap: 10px
    }

    .estateai-chat-launcher-label {
        display: none
    }

    .estateai-chat-launcher {
        padding: 16px
    }

    .estateai-chat-floating .estateai-chat-panel {
        width: calc(100vw - 28px);
        max-height: 74vh
    }

    .estateai-chat-log {
        height: 46vh
    }
}

@media(prefers-reduced-motion:reduce) {

    .estateai-chat-launcher,
    .estateai-chat-card,
    .estateai-chat-send {
        transition: none
    }

    .estateai-chat-launcher:hover,
    .estateai-chat-card:hover,
    .estateai-chat-send:hover {
        transform: none
    }

    .estateai-chat-floating .estateai-chat-panel {
        animation: none
    }

    .estateai-chat-dots span {
        animation: none
    }
}
/* 8. Concierge: editable criteria, guidance, shortlist and comparison
   -------------------------------------------------------------- */

.estateai-ai-search ul.estateai-ai-search-chips>li {
    padding-right: 8px
}

.estateai-ai-search .estateai-ai-search-chip-drop {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(21, 32, 51, .07);
    color: #5b6b80;
    font-family: inherit;
    font-size: 15px;
    line-height: 1;
    cursor: pointer;
    transition: background-color 160ms ease, color 160ms ease;
    -webkit-appearance: none;
    appearance: none
}

.estateai-ai-search .estateai-ai-search-chip-drop:hover,
.estateai-ai-search .estateai-ai-search-chip-drop:focus {
    background: #d63638;
    color: #fff
}

.estateai-ai-search ul.estateai-ai-search-chips>li.is-reset {
    padding: 0;
    border: 0;
    background: none
}

.estateai-ai-search ul.estateai-ai-search-chips>li.is-reset::before {
    content: none
}

.estateai-ai-search .estateai-ai-search-reset {
    margin: 0;
    padding: 7px 12px;
    border: 0;
    border-radius: 999px;
    background: none;
    color: #7c8ba0;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    text-decoration: underline;
    text-transform: none;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none
}

.estateai-ai-search .estateai-ai-search-reset:hover,
.estateai-ai-search .estateai-ai-search-reset:focus {
    color: var(--estateai-accent-hover, #135e96)
}

/* The follow-up question and its answers. */
.estateai-ai-search .estateai-ai-search-clarify {
    margin-top: 16px;
    padding: 16px;
    border: 1px dashed var(--estateai-accent-line, #cadeec);
    border-radius: 14px;
    background: var(--estateai-accent-soft, #eef7fc)
}

.estateai-ai-search .estateai-ai-search-clarify-question {
    display: flex;
    gap: 8px;
    align-items: center;
    margin: 0 0 12px;
    color: var(--estateai-accent-deep, #193f61);
    font-size: 14.5px;
    font-weight: 700
}

.estateai-ai-search .estateai-ai-search-clarify-question .dashicons {
    width: 18px;
    height: 18px;
    font-size: 18px;
    line-height: 18px
}

.estateai-ai-search .estateai-ai-search-clarify-options {
    display: flex;
    flex-wrap: wrap;
    gap: 8px
}

.estateai-ai-search .estateai-ai-search-option,
.estateai-ai-search .estateai-ai-search-suggestion {
    margin: 0;
    padding: 8px 16px;
    border: 1px solid var(--estateai-accent-line, #cadeec);
    border-radius: 999px;
    background: #fff;
    color: var(--estateai-accent-hover, #135e96);
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    text-transform: none;
    cursor: pointer;
    transition: background 180ms ease, color 180ms ease, transform 180ms ease;
    -webkit-appearance: none;
    appearance: none
}

.estateai-ai-search .estateai-ai-search-option:hover,
.estateai-ai-search .estateai-ai-search-option:focus,
.estateai-ai-search .estateai-ai-search-suggestion:hover,
.estateai-ai-search .estateai-ai-search-suggestion:focus {
    background: linear-gradient(135deg, var(--estateai-accent, #2271b1) 0, var(--estateai-accent-hover, #135e96) 100%);
    color: #fff;
    transform: translateY(-1px)
}

.estateai-ai-search .estateai-ai-search-suggestions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px dashed var(--estateai-highlight-line, #e6ecf2)
}

.estateai-ai-search .estateai-ai-search-suggestions-label {
    color: #7c8ba0;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase
}

/* Shortlist toggle on a card. */
.estateai-ai-search .estateai-ai-search-save {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    margin: 8px 0 0;
    padding: 10px 14px;
    border: 1px solid var(--estateai-highlight-line, #e6ecf2);
    border-radius: 12px;
    background: #fff;
    color: #5b6b80;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
    text-transform: none;
    cursor: pointer;
    transition: border-color 180ms ease, color 180ms ease, background 180ms ease;
    -webkit-appearance: none;
    appearance: none
}

.estateai-ai-search .estateai-ai-search-save:hover,
.estateai-ai-search .estateai-ai-search-save:focus {
    border-color: var(--estateai-accent-line, #cadeec);
    color: var(--estateai-accent-hover, #135e96)
}

.estateai-ai-search .estateai-ai-search-save.is-saved {
    border-color: transparent;
    background: #fdeef0;
    color: #c1394b
}

.estateai-ai-search .estateai-ai-search-save .dashicons {
    width: 16px;
    height: 16px;
    font-size: 16px;
    line-height: 16px
}

/* The tray under the results. */
.estateai-ai-search .estateai-ai-search-tray {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    margin-top: 20px;
    padding: 16px 20px;
    border: 1px solid var(--estateai-highlight-line, #e6ecf2);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(21, 32, 51, .06)
}

.estateai-ai-search .estateai-ai-search-tray.is-empty {
    border-style: dashed;
    background: transparent;
    box-shadow: none
}

.estateai-ai-search .estateai-ai-search-tray-count,
.estateai-ai-search .estateai-ai-search-tray-hint {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #24394e;
    font-size: 14px;
    font-weight: 600
}

.estateai-ai-search .estateai-ai-search-tray-hint {
    color: #7c8ba0;
    font-weight: 500
}

.estateai-ai-search .estateai-ai-search-tray-count .dashicons {
    color: #c1394b
}

.estateai-ai-search .estateai-ai-search-tray-actions {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 8px
}

.estateai-ai-search .estateai-ai-search-compare,
.estateai-ai-search .estateai-ai-search-callback {
    margin: 0;
    padding: 11px 20px;
    border: 1px solid var(--estateai-accent-line, #cadeec);
    border-radius: 999px;
    background: var(--estateai-accent-soft, #eef7fc);
    color: var(--estateai-accent-hover, #135e96);
    font-family: inherit;
    font-size: 13.5px;
    font-weight: 700;
    line-height: 1.2;
    text-transform: none;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none
}

.estateai-ai-search .estateai-ai-search-callback {
    border-color: transparent;
    background: linear-gradient(135deg, var(--estateai-accent, #2271b1) 0, var(--estateai-accent-hover, #135e96) 100%);
    color: #fff;
    box-shadow: 0 8px 18px rgba(19, 94, 150, .28)
}

.estateai-ai-search .estateai-ai-search-compare:hover,
.estateai-ai-search .estateai-ai-search-compare:focus {
    border-color: var(--estateai-accent, #2271b1)
}

.estateai-ai-search .estateai-ai-search-callback:hover,
.estateai-ai-search .estateai-ai-search-callback:focus {
    color: #fff;
    filter: brightness(1.08)
}

/* Callback form inside the tray. */
.estateai-ai-search .estateai-ai-search-callback-form {
    display: grid;
    flex: 1 1 100%;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 8px;
    margin-top: 4px;
    padding-top: 16px;
    border-top: 1px dashed var(--estateai-highlight-line, #e6ecf2)
}

.estateai-ai-search .estateai-ai-search-callback-intro,
.estateai-ai-search .estateai-ai-search-callback-done {
    grid-column: 1 / -1;
    margin: 0;
    color: #24394e;
    font-size: 14px;
    line-height: 1.55
}

.estateai-ai-search .estateai-ai-search-callback-done {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 14px;
    border-radius: 12px;
    background: #edfaef;
    color: #14532d;
    font-weight: 600
}

.estateai-ai-search .estateai-ai-search-callback-field {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 12px 14px;
    border: 1px solid var(--estateai-highlight-line, #dfe7ee);
    border-radius: 11px;
    background: #f8fafc;
    color: #152238;
    font-family: inherit;
    font-size: 14px;
    line-height: 1.4;
    -webkit-appearance: none;
    appearance: none
}

.estateai-ai-search .estateai-ai-search-callback-field:focus {
    outline: 0;
    border-color: var(--estateai-accent, #2271b1);
    background: #fff;
    box-shadow: 0 0 0 3px rgba(34, 113, 177, .14)
}

.estateai-ai-search .estateai-ai-search-callback-send {
    margin: 0;
    padding: 12px 22px;
    border: 0;
    border-radius: 11px;
    background: linear-gradient(135deg, var(--estateai-accent, #2271b1) 0, var(--estateai-accent-hover, #135e96) 100%);
    color: #fff;
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    text-transform: none;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none
}

.estateai-ai-search .estateai-ai-search-callback-send[disabled] {
    opacity: .7;
    cursor: default
}

/* Side-by-side comparison. */
.estateai-ai-search .estateai-ai-search-compare-sheet {
    overflow: hidden;
    margin-top: 20px;
    border: 1px solid var(--estateai-highlight-line, #e6ecf2);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 14px 36px rgba(21, 32, 51, .1)
}

.estateai-ai-search .estateai-ai-search-compare-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    background:
        linear-gradient(135deg, var(--estateai-accent-deepest, #0e1a2b) 0, var(--estateai-accent-deep, #1d4468) 100%);
    color: #fff
}

.estateai-ai-search .estateai-ai-search-compare-head h3 {
    margin: 0;
    color: #fff;
    font-size: 16px;
    font-weight: 700
}

.estateai-ai-search .estateai-ai-search-compare-close {
    margin: 0;
    padding: 2px 10px;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, .14);
    color: #fff;
    font-family: inherit;
    font-size: 18px;
    line-height: 1.4;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none
}

.estateai-ai-search .estateai-ai-search-compare-scroll {
    overflow-x: auto
}

.estateai-ai-search .estateai-ai-search-compare-table {
    width: 100%;
    margin: 0;
    border: 0;
    border-collapse: collapse;
    font-size: 14px
}

.estateai-ai-search .estateai-ai-search-compare-table th,
.estateai-ai-search .estateai-ai-search-compare-table td {
    padding: 13px 16px;
    border: 0;
    border-bottom: 1px solid var(--estateai-highlight-line, #eef2f6);
    text-align: left;
    vertical-align: top
}

.estateai-ai-search .estateai-ai-search-compare-table thead th {
    background: #f7f9fc;
    font-size: 13.5px;
    font-weight: 700
}

.estateai-ai-search .estateai-ai-search-compare-table thead th a {
    color: #152238;
    text-decoration: none
}

.estateai-ai-search .estateai-ai-search-compare-table thead th a:hover {
    color: var(--estateai-accent, #2271b1)
}

.estateai-ai-search .estateai-ai-search-compare-table tbody th {
    width: 130px;
    color: #7c8ba0;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    white-space: nowrap
}

.estateai-ai-search .estateai-ai-search-compare-table tbody td {
    color: #24394e
}

.estateai-ai-search .estateai-ai-search-compare-table tbody tr:last-child th,
.estateai-ai-search .estateai-ai-search-compare-table tbody tr:last-child td {
    border-bottom: 0
}

@media(max-width:600px) {

    .estateai-ai-search .estateai-ai-search-tray {
        padding: 14px
    }

    .estateai-ai-search .estateai-ai-search-tray-actions {
        width: 100%
    }

    .estateai-ai-search .estateai-ai-search-compare,
    .estateai-ai-search .estateai-ai-search-callback {
        flex: 1 1 auto
    }
}

@media(prefers-reduced-motion:reduce) {

    .estateai-ai-search .estateai-ai-search-option,
    .estateai-ai-search .estateai-ai-search-suggestion,
    .estateai-ai-search .estateai-ai-search-save {
        transition: none
    }

    .estateai-ai-search .estateai-ai-search-option:hover,
    .estateai-ai-search .estateai-ai-search-suggestion:hover {
        transform: none
    }
}
/* 9. Property comparison
   -------------------------------------------------------------- */

.estateai-compare,
.estateai-compare *,
.estateai-compare *::before,
.estateai-compare *::after {
    box-sizing: border-box
}

.estateai-compare {
    margin: 0 0 36px;
    color: #152238
}

.estateai-compare .estateai-compare-title {
    margin: 0 0 6px;
    color: #152238;
    font-family: inherit;
    font-size: clamp(22px, 2.6vw, 30px);
    font-weight: 700;
    letter-spacing: -.01em
}

.estateai-compare .estateai-compare-intro {
    margin: 0 0 18px;
    color: #5b6b80;
    font-size: 15px
}

.estateai-compare .estateai-compare-pickers {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
    margin-bottom: 20px
}

.estateai-compare .estateai-compare-slot {
    margin: 0
}

.estateai-compare .estateai-compare-select {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 13px 16px;
    border: 1px solid var(--estateai-highlight-line, #dfe7ee);
    border-radius: 12px;
    background: #fff;
    color: #152238;
    font-family: inherit;
    font-size: 14.5px;
    line-height: 1.4
}

.estateai-compare .estateai-compare-select:focus {
    outline: 0;
    border-color: var(--estateai-accent, #2271b1);
    box-shadow: 0 0 0 3px rgba(34, 113, 177, .14)
}

.estateai-compare .estateai-compare-status:empty {
    display: none
}

.estateai-compare .estateai-compare-status {
    margin-bottom: 14px;
    padding: 12px 16px;
    border-radius: 12px;
    background: var(--estateai-accent-soft, #eef7fc);
    color: var(--estateai-accent-deep, #1d4468);
    font-size: 14px;
    font-weight: 600
}

.estateai-compare.is-loading .estateai-compare-result {
    opacity: .45
}

.estateai-compare .estateai-compare-empty {
    padding: 34px 20px;
    border: 1px dashed var(--estateai-highlight-line, #e6ecf2);
    border-radius: 16px;
    color: #7c8ba0;
    text-align: center
}

.estateai-compare .estateai-compare-empty p {
    margin: 0
}

.estateai-compare .estateai-compare-sheet {
    overflow: hidden;
    border: 1px solid var(--estateai-highlight-line, #e6ecf2);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 12px 34px rgba(21, 32, 51, .08)
}

.estateai-compare .estateai-compare-scroll {
    overflow-x: auto
}

.estateai-compare .estateai-compare-table {
    width: 100%;
    min-width: 520px;
    margin: 0;
    border: 0;
    border-collapse: collapse;
    font-size: 14px
}

.estateai-compare .estateai-compare-table th,
.estateai-compare .estateai-compare-table td {
    padding: 13px 16px;
    border: 0;
    border-bottom: 1px solid var(--estateai-highlight-line, #eef2f6);
    text-align: left;
    vertical-align: middle
}

.estateai-compare .estateai-compare-table thead th {
    border-bottom: 1px solid var(--estateai-highlight-line, #e6ecf2);
    background: #f7f9fc;
    vertical-align: top
}

.estateai-compare .estateai-compare-head {
    display: block;
    color: #152238;
    text-decoration: none
}

.estateai-compare .estateai-compare-thumb {
    display: block;
    overflow: hidden;
    width: 100%;
    max-width: 160px;
    margin-bottom: 8px;
    border-radius: 10px;
    background: var(--estateai-highlight-faint, #f2f5f8);
    color: #9fb0c4;
    font-size: 26px;
    line-height: 90px;
    text-align: center
}

.estateai-compare .estateai-compare-thumb img {
    display: block;
    width: 100%;
    height: 90px;
    object-fit: cover
}

.estateai-compare .estateai-compare-name {
    display: block;
    max-width: 200px;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35
}

.estateai-compare .estateai-compare-head:hover .estateai-compare-name {
    color: var(--estateai-accent, #2271b1)
}

.estateai-compare .estateai-compare-table tbody th {
    width: 140px;
    color: #7c8ba0;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    white-space: nowrap
}

.estateai-compare .estateai-compare-table tbody td {
    color: #24394e
}

/* Rows where the listings actually differ are the ones worth reading. */
.estateai-compare .estateai-compare-table tbody tr.is-different td {
    background: #fbfcfe;
    font-weight: 600
}

.estateai-compare .estateai-compare-table tbody tr:last-child th,
.estateai-compare .estateai-compare-table tbody tr:last-child td {
    border-bottom: 0
}

.estateai-compare .estateai-compare-badge {
    display: inline-block;
    margin-left: 8px;
    padding: 3px 9px;
    border-radius: 999px;
    background: #e8f6ec;
    color: #14733a;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    vertical-align: middle;
    white-space: nowrap
}

.estateai-compare .estateai-compare-foot {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-top: 1px solid var(--estateai-highlight-line, #eef2f6);
    background: #fbfcfe
}

.estateai-compare .estateai-compare-ask {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 12px 24px;
    border: 0;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--estateai-accent, #2271b1) 0, var(--estateai-accent-hover, #135e96) 100%);
    color: #fff;
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    text-transform: none;
    cursor: pointer;
    box-shadow: 0 8px 20px rgba(19, 94, 150, .28);
    transition: transform 180ms ease, filter 180ms ease;
    -webkit-appearance: none;
    appearance: none
}

.estateai-compare .estateai-compare-ask:hover,
.estateai-compare .estateai-compare-ask:focus {
    color: #fff;
    filter: brightness(1.08);
    transform: translateY(-1px)
}

.estateai-compare .estateai-compare-ask[disabled] {
    opacity: .7;
    transform: none;
    cursor: progress
}

.estateai-compare .estateai-compare-ask .dashicons {
    width: 17px;
    height: 17px;
    font-size: 17px;
    line-height: 17px
}

.estateai-compare .estateai-compare-share {
    color: #7c8ba0;
    font-size: 13px;
    text-decoration: underline
}

.estateai-compare .estateai-compare-share:hover {
    color: var(--estateai-accent-hover, #135e96)
}

/* The verdict. */
.estateai-compare .estateai-compare-verdict:empty {
    display: none
}

.estateai-compare .estateai-compare-advice {
    padding: 20px;
    border-top: 1px solid var(--estateai-highlight-line, #eef2f6);
    background: linear-gradient(180deg, var(--estateai-accent-soft, #eef7fc) 0, #fff 140px)
}

.estateai-compare .estateai-compare-advice-text {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    margin: 0 0 16px;
    color: #152238;
    font-size: 15px;
    line-height: 1.65
}

.estateai-compare .estateai-compare-advice-icon {
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--estateai-accent, #2271b1) 0, var(--estateai-accent-hover, #135e96) 100%);
    color: #fff;
    font-size: 18px;
    line-height: 34px;
    text-align: center
}

.estateai-compare .estateai-compare-notes {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 12px
}

.estateai-compare .estateai-compare-note {
    padding: 16px;
    border: 1px solid var(--estateai-highlight-line, #e6ecf2);
    border-radius: 14px;
    background: #fff
}

.estateai-compare .estateai-compare-note.is-best {
    border-color: #7fc79a;
    box-shadow: 0 0 0 3px rgba(20, 115, 58, .1)
}

.estateai-compare .estateai-compare-note h4 {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    margin: 0 0 10px;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35
}

.estateai-compare .estateai-compare-note h4 a {
    color: #152238;
    text-decoration: none
}

.estateai-compare .estateai-compare-note h4 a:hover {
    color: var(--estateai-accent, #2271b1)
}

.estateai-compare .estateai-compare-best {
    padding: 3px 10px;
    border-radius: 999px;
    background: #e8f6ec;
    color: #14733a;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase
}

.estateai-compare ul.estateai-compare-pros,
.estateai-compare ul.estateai-compare-cons {
    margin: 0 0 8px;
    padding: 0;
    list-style: none
}

.estateai-compare ul.estateai-compare-cons {
    margin-bottom: 0
}

.estateai-compare ul.estateai-compare-pros>li,
.estateai-compare ul.estateai-compare-cons>li {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    margin: 0 0 6px;
    color: #24394e;
    font-size: 13.5px;
    line-height: 1.5;
    list-style: none
}

.estateai-compare ul.estateai-compare-pros>li::marker,
.estateai-compare ul.estateai-compare-cons>li::marker {
    content: none
}

.estateai-compare ul.estateai-compare-pros>li::before {
    content: "+";
    flex: 0 0 auto;
    width: 17px;
    height: 17px;
    border-radius: 50%;
    background: #e8f6ec;
    color: #14733a;
    font-size: 12px;
    font-weight: 700;
    line-height: 17px;
    text-align: center
}

.estateai-compare ul.estateai-compare-cons>li::before {
    content: "−";
    flex: 0 0 auto;
    width: 17px;
    height: 17px;
    border-radius: 50%;
    background: #fdeef0;
    color: #b3283a;
    font-size: 12px;
    font-weight: 700;
    line-height: 17px;
    text-align: center
}

.estateai-compare .estateai-compare-advice-note {
    margin: 14px 0 0;
    color: #93a2b5;
    font-size: 12.5px
}

.estateai-compare .estateai-compare-error {
    margin: 0;
    padding: 12px 15px;
    border-radius: 12px;
    background: #fcf0f1;
    color: #7f1d1d;
    font-size: 14px
}

/* Inside the search shortlist tray the sheet is already framed. */
.estateai-ai-search .estateai-ai-search-compare-sheet .estateai-compare {
    margin: 0
}

.estateai-ai-search .estateai-ai-search-compare-sheet .estateai-compare-sheet {
    border: 0;
    border-radius: 0;
    box-shadow: none
}

@media(max-width:600px) {

    .estateai-compare .estateai-compare-foot {
        padding: 14px
    }

    .estateai-compare .estateai-compare-ask {
        width: 100%;
        justify-content: center
    }
}

@media(prefers-reduced-motion:reduce) {

    .estateai-compare .estateai-compare-ask {
        transition: none
    }

    .estateai-compare .estateai-compare-ask:hover {
        transform: none
    }
}
/* 10. Site visit booking
   -------------------------------------------------------------- */

.estateai-visit,
.estateai-visit *,
.estateai-visit *::before,
.estateai-visit *::after {
    box-sizing: border-box
}

.estateai-visit {
    margin: 0 0 26px
}

.estateai-visit .estateai-visit-panel {
    padding: 26px;
    border: 1px solid var(--estateai-highlight-line, #e3e7eb);
    border-radius: 18px;
    background: #fff;
    color: #152238;
    box-shadow: 0 10px 30px rgba(21, 32, 51, .06)
}

.estateai-visit .estateai-visit-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 6px 14px 6px 11px;
    border-radius: 999px;
    background: var(--estateai-accent-soft, #eef7fc);
    color: var(--estateai-accent-hover, #135e96);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase
}

.estateai-visit .estateai-visit-badge .dashicons {
    width: 15px;
    height: 15px;
    font-size: 15px;
    line-height: 15px
}

.estateai-visit .estateai-visit-title {
    margin: 14px 0 6px;
    color: #152238;
    font-family: inherit;
    font-size: clamp(20px, 2.2vw, 26px);
    font-weight: 700;
    line-height: 1.25
}

.estateai-visit .estateai-visit-intro {
    margin: 0 0 18px;
    color: #5b6b80;
    font-size: 15px;
    line-height: 1.6
}

.estateai-visit .estateai-visit-notice {
    margin-bottom: 18px;
    padding: 12px 15px;
    border-left: 4px solid #8c98a5;
    border-radius: 10px;
    background: #f4f6f8;
    font-size: 14px;
    line-height: 1.6
}

.estateai-visit .estateai-visit-notice.is-success {
    border-left-color: #1a7f37;
    background: #edfaef;
    color: #14532d
}

.estateai-visit .estateai-visit-notice.is-error {
    border-left-color: #b32d2e;
    background: #fcf0f1;
    color: #7f1d1d
}

.estateai-visit .estateai-visit-step {
    margin-bottom: 20px
}

.estateai-visit .estateai-visit-step[hidden] {
    display: none
}

.estateai-visit .estateai-visit-label {
    display: block;
    margin-bottom: 9px;
    color: #24394e;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase
}

.estateai-visit .estateai-visit-date,
.estateai-visit .estateai-visit-field,
.estateai-visit .estateai-visit-message {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 12px 15px;
    border: 1px solid var(--estateai-highlight-line, #dfe7ee);
    border-radius: 12px;
    background: #f8fafc;
    color: #152238;
    font-family: inherit;
    font-size: 15px;
    line-height: 1.4;
    -webkit-appearance: none;
    appearance: none
}

.estateai-visit .estateai-visit-date {
    max-width: 260px
}

.estateai-visit .estateai-visit-date:focus,
.estateai-visit .estateai-visit-field:focus,
.estateai-visit .estateai-visit-message:focus {
    outline: 0;
    border-color: var(--estateai-accent, #2271b1);
    background: #fff;
    box-shadow: 0 0 0 3px rgba(34, 113, 177, .14)
}

.estateai-visit .estateai-visit-open {
    margin: 8px 0 0;
    color: #7c8ba0;
    font-size: 13px
}

.estateai-visit .estateai-visit-slots {
    display: flex;
    flex-wrap: wrap;
    gap: 8px
}

.estateai-visit .estateai-visit-slot {
    margin: 0;
    padding: 11px 18px;
    border: 1px solid var(--estateai-highlight-line, #dfe7ee);
    border-radius: 999px;
    background: #fff;
    color: #24394e;
    font-family: inherit;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    text-transform: none;
    cursor: pointer;
    transition: border-color 160ms ease, background 160ms ease, color 160ms ease;
    -webkit-appearance: none;
    appearance: none
}

.estateai-visit .estateai-visit-slot:hover:not(.is-taken) {
    border-color: var(--estateai-accent, #2271b1);
    color: var(--estateai-accent-hover, #135e96)
}

.estateai-visit .estateai-visit-slot.is-chosen {
    border-color: transparent;
    background: linear-gradient(135deg, var(--estateai-accent, #2271b1) 0, var(--estateai-accent-hover, #135e96) 100%);
    color: #fff;
    box-shadow: 0 8px 18px rgba(19, 94, 150, .28)
}

.estateai-visit .estateai-visit-slot.is-taken {
    background: #f4f6f8;
    color: #a9b5c4;
    text-decoration: line-through;
    cursor: not-allowed
}

.estateai-visit .estateai-visit-closed {
    margin: 0;
    padding: 14px 16px;
    border: 1px dashed var(--estateai-highlight-line, #dfe7ee);
    border-radius: 12px;
    color: #7c8ba0;
    font-size: 14px
}

.estateai-visit .estateai-visit-fields {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 10px;
    margin-bottom: 10px
}

.estateai-visit .estateai-visit-message {
    margin-bottom: 14px
}

.estateai-visit .estateai-visit-hp {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden
}

.estateai-visit .estateai-visit-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 14px 30px;
    border: 0;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--estateai-accent, #2271b1) 0, var(--estateai-accent-hover, #135e96) 100%);
    color: #fff;
    font-family: inherit;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;
    text-transform: none;
    cursor: pointer;
    box-shadow: 0 8px 20px rgba(19, 94, 150, .3);
    transition: transform 180ms ease, filter 180ms ease;
    -webkit-appearance: none;
    appearance: none
}

.estateai-visit .estateai-visit-submit:hover,
.estateai-visit .estateai-visit-submit:focus {
    color: #fff;
    filter: brightness(1.08);
    transform: translateY(-1px)
}

.estateai-visit .estateai-visit-submit[disabled] {
    opacity: .7;
    transform: none;
    cursor: progress
}

.estateai-visit .estateai-visit-status:empty {
    display: none
}

.estateai-visit .estateai-visit-status {
    margin-top: 14px;
    padding: 12px 15px;
    border-radius: 12px;
    background: var(--estateai-accent-soft, #eef7fc);
    color: var(--estateai-accent-deep, #1d4468);
    font-size: 14px;
    font-weight: 600
}

.estateai-visit .estateai-visit-status.is-error {
    background: #fcf0f1;
    color: #7f1d1d
}

.estateai-visit .estateai-visit-done {
    padding: 30px 22px;
    border-radius: 16px;
    background: linear-gradient(180deg, #edfaef 0, #fff 100%);
    text-align: center
}

.estateai-visit .estateai-visit-done-icon {
    width: 54px;
    height: 54px;
    margin-bottom: 12px;
    border-radius: 50%;
    background: #1a7f37;
    color: #fff;
    font-size: 28px;
    line-height: 54px
}

.estateai-visit .estateai-visit-done h3 {
    margin: 0 0 8px;
    color: #14532d;
    font-size: 20px;
    font-weight: 700
}

.estateai-visit .estateai-visit-done p {
    margin: 0 0 8px;
    color: #24394e;
    font-size: 15px
}

.estateai-visit .estateai-visit-when {
    font-size: 17px
}

.estateai-visit .estateai-visit-when strong {
    margin-left: 6px;
    color: #14532d
}

.estateai-visit .estateai-visit-where {
    color: #5b6b80;
    font-weight: 600
}

.estateai-visit .estateai-visit-cancel a {
    color: #7c8ba0;
    font-size: 13px;
    text-decoration: underline
}

@media(max-width:600px) {

    .estateai-visit .estateai-visit-panel {
        padding: 20px
    }

    .estateai-visit .estateai-visit-date {
        max-width: none
    }

    .estateai-visit .estateai-visit-submit {
        width: 100%
    }
}

@media(prefers-reduced-motion:reduce) {

    .estateai-visit .estateai-visit-slot,
    .estateai-visit .estateai-visit-submit {
        transition: none
    }

    .estateai-visit .estateai-visit-submit:hover {
        transform: none
    }
}
/**
 * 11. Property location map.
 * -------------------------------------------------------------------------- */
.estateai-property-single .estateai-property-map {
    margin: 20px 0 0;
}

.estateai-property-single .estateai-map-frame {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%;
    overflow: hidden;
    border: 1px solid #e2e7ee;
    border-radius: 14px;
    background: #eef1f5;
    box-shadow: 0 10px 26px rgba(16, 32, 56, .07);
}

.estateai-property-single .estateai-map-frame iframe {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    max-width: 100%;
    border: 0;
    margin: 0;
    filter: saturate(1.02)
}

.estateai-property-single .estateai-map-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 12px;
    padding: 9px 16px;
    border: 1px solid #dbe1ea;
    border-radius: 999px;
    background: #fff;
    color: #1f2d40;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
    transition: border-color .18s ease, color .18s ease, transform .18s ease;
}

.estateai-property-single .estateai-map-link:hover,
.estateai-property-single .estateai-map-link:focus {
    border-color: var(--estateai-accent, #1f6feb);
    color: var(--estateai-accent, #1f6feb);
    transform: translateY(-1px);
    text-decoration: none;
}

.estateai-property-single .estateai-map-link .dashicons {
    width: 16px;
    height: 16px;
    font-size: 16px;
    line-height: 1
}

@media (max-width: 600px) {
    .estateai-property-single .estateai-map-frame {
        padding-bottom: 75%;
        border-radius: 12px
    }
}

@media (prefers-reduced-motion: reduce) {
    .estateai-property-single .estateai-map-link {
        transition: none
    }

    .estateai-property-single .estateai-map-link:hover {
        transform: none
    }
}
