/**
 * Theme Name: ListingHive Child
 * Template: listinghive
 * Author: Piyush Lade
 * Version: 3.5 (Old footer CSS removed, Elementor footer #3410 scoped to .bli-footer)
 *
 * INDEX
 *  1. Brand variables
 *  2. Global / forms / misc
 *  3. Header
 *  4. (removed) old ListingHive footer — footer is now Elementor #3410, see section 13
 *  5. Add Listing + Edit Listing form — field styling
 *  6. Account dashboard
 *  7. Listing cards (base styles)
 *  8. Shared attribute + social button styles
 *  9. Category cards (desktop 5 col · tablet 4 col · mobile 2 col · mobile homepage 2-row carousel)
 * 10. Listing cards v4 (homepage / archive / related)
 * 11. Single listing page (.bli- sectioned cards + sidebar, needs single-listing-sections.js)
 * 12. Add Listing + Edit Listing — sectioned layout
 *     (needs add-listing-sections.js AND edit-listing-sections.js)
 * 13. Elementor footer (rendered from footer.php, template #3410)
 *
 * CHANGELOG v3.4 -> v3.5
 * - Removed section 4 (.site-footer rules): the footer is now Elementor template
 *   #3410 rendered from footer.php, so those rules no longer applied.
 * - Footer CSS (.bli-footer) merged into ONE block at the end (section 13).
 * - Homepage category carousel (mobile): cards 180px, image 135px, parent
 *   Elementor containers get 0 side padding so the row uses the full width.
 * - Removed the stray plain-text line that broke the first footer selector.
 * - Sidebar blocks compacted (same declarations, shorter code).
 * - Removed the dead `display: contents` rule on .bli-contact-actions/tiles
 *   (it was always overridden by the flex rules below it).
 *
 * CHANGELOG v3.3 -> v3.4
 * - Homepage "Browse by Category" grid: on mobile (<=767px) it is a 2-row
 *   horizontal swipe carousel. Scoped to body.home only; other pages keep the
 *   normal 2-column static grid.
 *
 * CHANGELOG v3.2 -> v3.3
 * - Message icon is AMBER everywhere. Hover = amber-dark icon + light amber bg.
 * - Category pill on listing cards is TEAL.
 * - New variables: --amber-light, --teal-light, --teal-dark.
 *
 * CHANGELOG v3.1 -> v3.2
 * - Contact Information card: single Phone/Website item no longer stretches
 *   full width (flex + max-width instead of auto-fit grid).
 */

/* =========================================================
   1. BRAND VARIABLES
   ========================================================= */
:root {
    --navy:#0F2C4C; --navy-dark:#0A1F38;
    --blue:#2563EB; --blue-dark:#1D4ED8;
    --teal:#00A3A3;
    --amber:#F5A524; --amber-dark:#D68910;
    --green:#16A34A;
    --light-bg:#F7F9FC; --border:#E5E7EB;
    --text:#1A1D23; --text-muted:#6B7280;
    --border-blue:#BFDBFE; --border-golden:#FDE68A;
    --whatsapp:#25D366; --whatsapp-hover:#1EBE57;
    --facebook:#1877F2; --facebook-hover:#166FE5;
    --instagram-1:#F58529; --instagram-2:#DD2A7B; --instagram-3:#8134AF; --instagram-4:#515BD4;
    --linkedin:#0A66C2; --linkedin-hover:#0959A8;
    --youtube:#FF0000; --youtube-hover:#D90000;
    --x:#000000;
    --amber-light:#FFF6E5;
    --teal-light:#E6F6F6;
    --teal-dark:#008585;
}

/* =========================================================
   2. GLOBAL / FORMS / MISC
   ========================================================= */

/* Bold labels on all HivePress forms (add + edit listing) */
.hp-form__field--text .hp-field__label.hp-form__label,
.hp-form__field--textarea .hp-field__label.hp-form__label,
.hp-form__field--email .hp-field__label.hp-form__label,
.hp-form__field--tel .hp-field__label.hp-form__label,
.hp-form__field--url .hp-field__label.hp-form__label {
    font-weight: bold;
}

/* Hide created date on cards */
.hp-listing--view-block .hp-listing__created-date {
    display: none !important;
}

/* Hide price on the Featured package page */
.hp-listing-package .hp-listing-package__price {
    display: none !important;
}

/* Verified badge */
.hp-icon--verified,
.hp-listing__icon--verified {
    color: var(--green) !important;
}

/* Details line */
.details-line {
    margin-bottom: 7px;
    font-size: 16px;
    font-weight: 500;
}

.details-line strong {
    color: var(--amber);
    margin-right: 2px;
}

/* =========================================================
   3. HEADER
   ========================================================= */

body.home .site-content {
    padding-top: 0 !important;
}

.site-header {
    background: #fff !important;
    padding: 1px;
    box-shadow: 0 2px 18px rgba(15,44,76,.05);
}

.site-header .custom-logo {
    max-height: 85px;
    height: auto;
    width: auto;
}

/* ---------- Sticky Header ---------- */

.header-navbar {
    position: sticky !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 999999 !important;
    background: #FFFFFF !important;
    border-bottom: 1px solid #E5E7EB !important;
    box-shadow: 0 2px 8px rgba(15,44,76,.08);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* ---------- Navigation ---------- */

.header-navbar__menu ul li a {
    padding: 6px 13px;
    font-size: 18px;
    font-weight: 500;
    color: var(--text);
    border-radius: 6px;
    transition: color .3s ease;
}

/* Hover = Amber */

.header-navbar__menu ul li a:hover {
    color: #F5A524 !important;
    background: transparent !important;
}

/* Active = Blue */

.header-navbar__menu ul li.current-menu-item a {
    color: var(--blue) !important;
    background: transparent !important;
}

/* ---------- Reduce spacing before Add Listing ---------- */

@media (min-width: 783px) {
    .header-navbar__actions {
        margin-left: -10px !important;
    }
}

/* ---------- Burger ---------- */

.header-navbar__burger a {
    font-size: 15px;
    padding: 7px;
}

/* ---------- Tablet ---------- */

@media (max-width: 900px) {

    .header-navbar__menu ul li a {
        font-size: 16px;
        padding: 7px 10px;
    }

    .site-header .custom-logo {
        max-height: 60px;
    }
}

/* ---------- Add Listing — Mobile ---------- */

@media (max-width: 782px) {

    .header-navbar__end {
        display: flex;
        align-items: center;
        flex-wrap: nowrap;
        gap: 6px;
    }

    .header-navbar__actions {
        flex-shrink: 0;
        width: auto;
        overflow: visible;
    }

    .header-navbar__actions .hp-menu--main {
        display: flex;
        width: auto;
    }

    .header-navbar__actions .hp-menu__item--listing-submit {
        flex-shrink: 0;
        white-space: nowrap;
        width: auto;
        min-width: max-content;
        padding: 8px 13px;
        font-size: 13px;
        line-height: 1.2;
    }

    .header-navbar__actions .hp-menu__item--listing-submit span {
        white-space: nowrap;
        display: inline-block;
    }
}
/* =========================================================
   5. ADD LISTING + EDIT LISTING FORM — field styling
   Same fields, same look on both pages:
     .hp-template--listing-submit-page  (Add Listing)
     .hp-template--listing-edit-page    (Edit Listing)
   ========================================================= */
.hp-template--listing-submit-page .hp-field__label,
.hp-template--listing-edit-page .hp-field__label {
    color: var(--text);
    font-size: 14px;
    font-weight: 500;
}

.hp-template--listing-submit-page .hp-field--images,
.hp-template--listing-submit-page .hp-form__upload,
.hp-template--listing-edit-page .hp-field--images,
.hp-template--listing-edit-page .hp-form__upload {
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
}

.hp-template--listing-submit-page .hp-form__upload-button,
.hp-template--listing-submit-page button.hp-form__upload,
.hp-template--listing-submit-page .hp-field--images .button,
.hp-template--listing-edit-page .hp-form__upload-button,
.hp-template--listing-edit-page button.hp-form__upload,
.hp-template--listing-edit-page .hp-field--images .button {
    display: inline-block !important;
    width: auto !important;
}

.hp-template--listing-submit-page .iti,
.hp-template--listing-submit-page .iti__tel-input,
.hp-template--listing-edit-page .iti,
.hp-template--listing-edit-page .iti__tel-input {
    width: 100% !important;
}

.hp-template--listing-submit-page .iti input,
.hp-template--listing-submit-page input.iti__tel-input,
.hp-template--listing-edit-page .iti input,
.hp-template--listing-edit-page input.iti__tel-input {
    padding-left: 84px !important;
    background: var(--light-bg) !important;
    border: 1px solid var(--border) !important;
    border-radius: 8px !important;
    height: 44px !important;
}

.hp-template--listing-submit-page .iti__flag-container,
.hp-template--listing-edit-page .iti__flag-container {
    padding: 0 8px !important;
    display: flex !important;
    align-items: center !important;
}

.hp-template--listing-submit-page .iti__selected-flag,
.hp-template--listing-edit-page .iti__selected-flag {
    padding: 0 8px !important;
    display: flex !important;
    align-items: center !important;
    height: 44px !important;
}

.hp-template--listing-submit-page .iti__selected-dial-code,
.hp-template--listing-edit-page .iti__selected-dial-code {
    margin-left: 4px !important;
    font-size: 14px !important;
    color: var(--text) !important;
}

/* =========================================================
   6. ACCOUNT DASHBOARD — "View Listing" text next to eye icon
   ========================================================= */
.hp-listings.hp-table .hp-listing__action--view {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

/* =========================================================
   7. LISTING CARDS (base styles)
   Section 10 refines these for .hp-listings:not(.hp-table)
   ========================================================= */

/* ---------- Card ---------- */
.hp-listing--view-block.hp-listing {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 14px;
    box-shadow: 0 2px 10px rgba(15,44,76,.06);
    overflow: hidden;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.hp-listing--view-block.hp-listing:hover {
    transform: translateY(-4px);
    border-color: var(--border-blue);
    box-shadow: 0 14px 30px rgba(15,44,76,.14);
}

.hp-listing--view-block .hp-listing__content {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    padding: 14px 16px 12px;
}

/* ---------- Image ---------- */
.hp-listing--view-block .hp-listing__image {
    position: relative;
    width: 100%;
    height: 190px;
    padding: 18px;
    box-sizing: border-box;
    background:
        radial-gradient(circle at 30% 20%, rgba(37,99,235,.06), transparent 55%),
        linear-gradient(180deg, #F3F6FB 0%, #EAF0F8 100%);
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hp-listing--view-block .hp-listing__image::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background: rgba(15,44,76,.06);
}

.hp-listing--view-block .hp-listing__image a {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hp-listing--view-block .hp-listing__image img {
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    border-radius: 6px !important;
    background: transparent !important;
    display: block !important;
    filter: drop-shadow(0 2px 6px rgba(15,44,76,.08));
    transition: transform .25s ease;
}

.hp-listing--view-block.hp-listing:hover .hp-listing__image img {
    transform: scale(1.04);
}

/* ---------- Category badge (2-line) — TEAL ---------- */
.hp-listing__categories::before {
    display: none !important;
}

.hp-listing--view-block .hp-listing__categories.hp-listing__category {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    min-height: 32px;
    max-width: 100%;
    margin-bottom: 8px;
}

.hp-listing--view-block .hp-listing__categories.hp-listing__category a {
    display: inline-block;
    background: var(--teal-light);
    color: var(--teal) !important;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .5px;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 6px;
    line-height: 1.35;
    text-decoration: none;
    transition: background .2s ease, color .2s ease;
}

.hp-listing--view-block .hp-listing__categories.hp-listing__category a:hover {
    background: var(--teal);
    color: #fff !important;
}

/* ---------- Title ---------- */
.hp-listing--view-block .hp-listing__title {
    margin: 0 0 6px 0;
    font-family: 'Poppins', sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.35;
}

.hp-listing--view-block .hp-listing__title a {
    color: var(--text) !important;
    text-decoration: none;
    font-family: 'Poppins';
}

.hp-listing--view-block .hp-listing__title a:hover {
    color: var(--blue) !important;
}

/* ---------- Footer ---------- */
.hp-listing--view-block .hp-listing__footer {
    margin-top: auto !important;
    min-height: 50px !important;
    padding: 9px 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    box-sizing: border-box !important;
    background: var(--light-bg) !important;
    border-top: 1px solid var(--border) !important;
    border-radius: 0 !important;
}

/* ---------- Message button (footer icon) ---------- */
.hp-listing__action--message {
    background: var(--blue) !important;
    border-color: var(--blue) !important;
    color: #fff !important;
}

.hp-listing__action--message:hover {
    background: var(--blue-dark) !important;
    border-color: var(--blue-dark) !important;
}

.hp-listing--view-block .hp-listing__footer .hp-listing__action--message {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 32px !important;
    min-width: 0 !important;
    padding: 0 !important;
    margin: 0 0 0 auto !important;
    background: #FFFFFF !important;
    border: 1px solid var(--border) !important;
    border-radius: 9px !important;
    box-shadow: none !important;
    transition: background .15s ease, border-color .15s ease !important;
}

.hp-listing--view-block .hp-listing__footer .hp-listing__action--message:hover,
.hp-listing--view-block .hp-listing__footer .hp-listing__action--message:focus {
    background: var(--amber-light) !important;
    border-color: var(--amber) !important;
    box-shadow: none !important;
}

.hp-listing--view-block .hp-listing__footer .hp-listing__action--message i,
.hp-listing--view-block .hp-listing__footer .hp-listing__action--message .hp-icon,
.hp-listing--view-block .hp-listing__footer .hp-icon.fa-comment {
    color: var(--amber) !important;
    font-size: 14px !important;
    width: auto !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
}

/* ---------- Card: phone button ---------- */
.hp-listing--view-block .hp-listing__attribute--phone {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    display: flex !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.hp-listing--view-block .hp-listing__attribute--phone a,
.hp-listing--view-block .hp-listing__attribute--phone a.button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: var(--blue) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 8px !important;
    height: 40px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    padding: 0 18px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

.hp-listing--view-block .hp-listing__attribute--phone a:hover,
.hp-listing--view-block .hp-listing__attribute--phone a.button:hover {
    background: var(--blue-dark) !important;
}

.hp-listing--view-block .hp-listing__attribute--phone a i,
.hp-listing--view-block .hp-listing__attribute--phone a svg,
.hp-listing--view-block .hp-listing__attribute--phone a .hp-icon {
    color: #fff !important;
    margin-right: 7px !important;
    font-size: 14px !important;
    width: auto !important;
    height: auto !important;
    background: transparent !important;
    flex-shrink: 0 !important;
}

/* ---------- Card: website button ---------- */
.hp-listing--view-block .hp-listing__attribute--website {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    display: inline-flex !important;
    width: auto !important;
    max-width: 100% !important;
}

.hp-listing--view-block .hp-listing__attribute--website a,
.hp-listing--view-block .hp-listing__attribute--website a.button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: var(--teal) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 8px !important;
    height: 32px !important;
    width: auto !important;
    max-width: 100% !important;
    padding: 0 13px !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

.hp-listing--view-block .hp-listing__attribute--website a:hover,
.hp-listing--view-block .hp-listing__attribute--website a.button:hover {
    filter: brightness(.92);
}

/* ---------- Card: WhatsApp pill ---------- */
.hp-listing--view-block .hp-listing__attribute--whatsapp {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: max-content !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: 32px !important;
    min-height: 32px !important;
    padding: 0 14px !important;
    margin: 0 !important;
    background: var(--whatsapp) !important;
    border: none !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    transition: background .2s ease, transform .15s ease !important;
}

.hp-listing--view-block .hp-listing__attribute--whatsapp:hover {
    background: var(--whatsapp-hover) !important;
    transform: translateY(-1px) !important;
}

.hp-listing--view-block .hp-listing__attribute--whatsapp a,
.hp-listing--view-block .hp-listing__attribute--whatsapp a.button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: 32px !important;
    min-height: 32px !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    color: #fff !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    text-decoration: none !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
}

.hp-listing--view-block .hp-listing__attribute--whatsapp i,
.hp-listing--view-block .hp-listing__attribute--whatsapp svg,
.hp-listing--view-block .hp-listing__attribute--whatsapp .hp-icon {
    width: auto !important;
    height: auto !important;
    margin: 0 5px 0 0 !important;
    padding: 0 !important;
    font-size: 12.5px !important;
    color: #fff !important;
    background: transparent !important;
    flex-shrink: 0 !important;
}

/* Related Listings (on single page) — WhatsApp same style */
.hp-template--listing-view-page .hp-listings .hp-listing__attribute--whatsapp {
    background: var(--whatsapp) !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    height: 32px !important;
    min-height: 32px !important;
    border-radius: 8px !important;
}

.hp-template--listing-view-page .hp-listings .hp-listing__attribute--whatsapp a,
.hp-template--listing-view-page .hp-listings .hp-listing__attribute--whatsapp a.button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 32px !important;
    min-height: 32px !important;
    padding: 0 14px !important;
    background: transparent !important;
    color: #FFFFFF !important;
    border: none !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    line-height: 1 !important;
}

.hp-template--listing-view-page .hp-listings .hp-listing__attribute--whatsapp:hover {
    background: var(--whatsapp-hover) !important;
}

/* ---------- Card: mobile ---------- */
@media (max-width: 767px) {
    .hp-listing--view-block.hp-listing {
        padding: 0 !important;
    }

    .hp-listing--view-block .hp-listing__image {
        height: 150px !important;
        padding: 14px !important;
    }

    .hp-listing--view-block .hp-listing__attribute--whatsapp {
        flex: 0 0 auto !important;
        height: 30px !important;
        min-height: 30px !important;
        padding: 0 12px !important;
    }

    .hp-listing--view-block .hp-listing__attribute--whatsapp a,
    .hp-listing--view-block .hp-listing__attribute--whatsapp a.button {
        height: 30px !important;
        min-height: 30px !important;
        font-size: 11.5px !important;
    }

    .hp-listing--view-block .hp-listing__attribute--whatsapp i,
    .hp-listing--view-block .hp-listing__attribute--whatsapp svg,
    .hp-listing--view-block .hp-listing__attribute--whatsapp .hp-icon {
        font-size: 11.5px !important;
        margin-right: 4px !important;
    }

    .hp-listing--view-block .hp-listing__footer {
        min-height: 46px !important;
        padding: 8px 10px !important;
    }
}

/* =========================================================
   8. SHARED ATTRIBUTE + SOCIAL BUTTON STYLES
   (used by cards AND by the single listing page)
   ========================================================= */

/* Base attribute box (fallback look) */
.hp-listing__attribute {
    display: flex;
    align-items: center;
    background: #fff;
    border: 1.3px solid var(--border);
    border-radius: 8px;
    padding: 14px 20px;
    margin-bottom: 12px;
    font-size: 17px;
    font-weight: 500;
    color: var(--text);
    box-shadow: 0 2px 8px rgba(15,44,76,.05);
    transition: box-shadow .14s ease, background .14s ease;
}

.hp-listing__attribute:hover {
    background: var(--light-bg);
    box-shadow: 0 6px 18px rgba(15,44,76,.10);
}

.hp-listing__attribute svg,
.hp-listing__attribute .hp-icon,
.hp-listing__attribute i {
    margin-right: 13px;
    font-size: 22px;
    color: var(--teal) !important;
}

/* Social / WhatsApp / Google Maps — outer box removed, coloured pill inside */
.hp-listing__attribute--facebook,
.hp-listing__attribute--instagram,
.hp-listing__attribute--linkedin,
.hp-listing__attribute--youtube,
.hp-listing__attribute--twitter,
.hp-listing__attribute--x,
.hp-listing__attribute--whatsapp,
.hp-listing__attribute--google-maps-url {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    display: inline-flex !important;
    width: auto !important;
    margin: 0 8px 8px 0 !important;
}

.hp-listing__attribute--facebook a,
.hp-listing__attribute--facebook a.button,
.hp-listing__attribute--instagram a,
.hp-listing__attribute--instagram a.button,
.hp-listing__attribute--linkedin a,
.hp-listing__attribute--linkedin a.button,
.hp-listing__attribute--youtube a,
.hp-listing__attribute--youtube a.button,
.hp-listing__attribute--twitter a,
.hp-listing__attribute--twitter a.button,
.hp-listing__attribute--x a,
.hp-listing__attribute--x a.button,
.hp-listing__attribute--whatsapp a,
.hp-listing__attribute--whatsapp a.button,
.hp-listing__attribute--google-maps-url a,
.hp-listing__attribute--google-maps-url a.button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 0 !important;
    height: 40px !important;
    min-height: 40px !important;
    padding: 0 16px !important;
    margin: 0 !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    text-decoration: none !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    color: #fff !important;
}

.hp-listing__attribute--facebook i,
.hp-listing__attribute--facebook svg,
.hp-listing__attribute--facebook .hp-icon,
.hp-listing__attribute--instagram i,
.hp-listing__attribute--instagram svg,
.hp-listing__attribute--instagram .hp-icon,
.hp-listing__attribute--linkedin i,
.hp-listing__attribute--linkedin svg,
.hp-listing__attribute--linkedin .hp-icon,
.hp-listing__attribute--youtube i,
.hp-listing__attribute--youtube svg,
.hp-listing__attribute--youtube .hp-icon,
.hp-listing__attribute--twitter i,
.hp-listing__attribute--twitter svg,
.hp-listing__attribute--twitter .hp-icon,
.hp-listing__attribute--x i,
.hp-listing__attribute--x svg,
.hp-listing__attribute--x .hp-icon,
.hp-listing__attribute--whatsapp i,
.hp-listing__attribute--whatsapp svg,
.hp-listing__attribute--whatsapp .hp-icon {
    width: auto !important;
    height: auto !important;
    margin: 0 5px 0 0 !important;
    padding: 0 !important;
    font-size: 13px !important;
    background: transparent !important;
    flex-shrink: 0 !important;
    color: #fff !important;
}

/* Platform colours */
.hp-listing__attribute--facebook a,
.hp-listing__attribute--facebook a.button {
    background: var(--facebook) !important;
}

.hp-listing__attribute--facebook a:hover {
    background: var(--facebook-hover) !important;
}

.hp-listing__attribute--instagram a,
.hp-listing__attribute--instagram a.button {
    background: linear-gradient(45deg, var(--instagram-1), var(--instagram-2), var(--instagram-3), var(--instagram-4)) !important;
}

.hp-listing__attribute--instagram a:hover {
    filter: brightness(.94);
}

.hp-listing__attribute--linkedin a,
.hp-listing__attribute--linkedin a.button {
    background: var(--linkedin) !important;
}

.hp-listing__attribute--linkedin a:hover {
    background: var(--linkedin-hover) !important;
}

.hp-listing__attribute--youtube a,
.hp-listing__attribute--youtube a.button {
    background: var(--youtube) !important;
}

.hp-listing__attribute--youtube a:hover {
    background: var(--youtube-hover) !important;
}

.hp-listing__attribute--twitter a,
.hp-listing__attribute--twitter a.button,
.hp-listing__attribute--x a,
.hp-listing__attribute--x a.button {
    background: var(--x) !important;
}

.hp-listing__attribute--twitter a:hover,
.hp-listing__attribute--x a:hover {
    background: #181818 !important;
}

.hp-listing__attribute--google-maps-url a,
.hp-listing__attribute--google-maps-url a.button {
    background: #EA4335 !important;
}

.hp-listing__attribute--google-maps-url a:hover,
.hp-listing__attribute--google-maps-url a.button:hover {
    background: #D33426 !important;
    filter: none !important;
}

/* Focus reset */
.hp-listing__attribute--facebook a:focus,
.hp-listing__attribute--instagram a:focus,
.hp-listing__attribute--linkedin a:focus,
.hp-listing__attribute--youtube a:focus,
.hp-listing__attribute--twitter a:focus,
.hp-listing__attribute--x a:focus,
.hp-listing__attribute--whatsapp a:focus {
    outline: none !important;
    box-shadow: none !important;
}

/* Description (fallback look — the single page overrides it inside .bli- cards) */
.hp-listing__description {
    background: #fff;
    border: 1.3px solid var(--border);
    border-radius: 8px;
    padding: 17px 20px;
    margin-bottom: 15px;
    font-size: 17px;
    font-weight: 500;
    color: var(--text);
    line-height: 1.63;
    box-shadow: 0 2px 8px rgba(15,44,76,.05);
    transition: box-shadow .14s ease, background .14s ease;
}

.hp-listing__description::before {
    content: "About";
    display: block;
    font-size: 15px;
    font-weight: 600;
    color: var(--navy);
    margin-bottom: 8px;
}

.hp-listing__description:hover {
    background: var(--light-bg);
    box-shadow: 0 6px 18px rgba(15,44,76,.10);
}

@media (max-width: 767px) {
    .hp-listing__description {
        padding: 15px !important;
        font-size: 15px !important;
    }
}

/* =========================================================
   9. CATEGORY CARDS — homepage + category pages
   Desktop 5 columns · Tablet 4 · Mobile 2 (non-home)
   Mobile HOMEPAGE: 2-row horizontal swipe carousel (bottom of section)
   ========================================================= */

.hp-listing-categories,
.hp-categories {
    width: 100% !important;
    max-width: 1100px !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
}

/* ---------- Grid ---------- */
.hp-listing-categories .hp-row,
.hp-categories .hp-row {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    column-gap: 18px !important;
    row-gap: 18px !important;
    width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

.hp-listing-categories .hp-row > .hp-grid__item,
.hp-categories .hp-row > .hp-grid__item {
    display: flex !important;
    flex: none !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

/* ---------- Card ---------- */
.hp-listing-category--view-block,
.hp-listing-category--submit-block {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
    background: #FFFFFF !important;
    border: 1px solid var(--border) !important;
    border-radius: 16px !important;
    box-shadow: 0 2px 10px rgba(15,44,76,.06) !important;
    opacity: 1 !important;
    filter: none !important;
    box-sizing: border-box !important;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease !important;
}

.hp-listing-category--view-block:hover,
.hp-listing-category--submit-block:hover {
    transform: translateY(-4px) !important;
    border-color: var(--blue) !important;
    box-shadow: 0 14px 28px rgba(15,44,76,.14) !important;
}

/* remove old overlays */
.hp-listing-category--view-block::before,
.hp-listing-category--view-block::after,
.hp-listing-category--submit-block::before,
.hp-listing-category--submit-block::after,
.hp-listing-category--view-block .hp-listing-category__image a::after,
.hp-listing-category--submit-block .hp-listing-category__image a::after {
    content: none !important;
    display: none !important;
}

/* ---------- Image area ---------- */
.hp-listing-category--view-block .hp-listing-category__image,
.hp-listing-category--submit-block .hp-listing-category__image {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 150px !important;
    min-height: 150px !important;
    flex: 0 0 150px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: linear-gradient(180deg, #F1F6FE 0%, #E6EFFC 100%) !important;
    border: 0 !important;
    border-radius: 0 !important;
    opacity: 1 !important;
    filter: none !important;
    box-sizing: border-box !important;
}

.hp-listing-category--view-block .hp-listing-category__image a,
.hp-listing-category--submit-block .hp-listing-category__image a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.hp-listing-category--view-block .hp-listing-category__image img,
.hp-listing-category--submit-block .hp-listing-category__image img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: cover !important;
    object-position: center !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    opacity: 1 !important;
    filter: none !important;
    mix-blend-mode: normal !important;
    transition: transform .3s ease !important;
}

.hp-listing-category--view-block:hover .hp-listing-category__image img,
.hp-listing-category--submit-block:hover .hp-listing-category__image img {
    transform: scale(1.05) !important;
}

/* ---------- Name area ---------- */
.hp-listing-category--view-block .hp-listing-category__content,
.hp-listing-category--submit-block .hp-listing-category__content {
    position: relative !important;
    inset: auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 1 1 auto !important;
    width: 100% !important;
    height: auto !important;
    min-height: 60px !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    background: #FFFFFF !important;
    border-top: 1px solid var(--border) !important;
    border-radius: 0 !important;
    text-align: center !important;
    box-sizing: border-box !important;
    z-index: 5 !important;
}

.hp-listing-category__name,
.hp-listing-category__title {
    position: static !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    overflow: hidden !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: var(--text) !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    text-align: center !important;
    box-sizing: border-box !important;
    z-index: 10 !important;
}

.hp-listing-category__name a,
.hp-listing-category__title a {
    color: var(--text) !important;
    text-decoration: none !important;
    transition: color .15s ease !important;
}

.hp-listing-category--view-block:hover .hp-listing-category__name a,
.hp-listing-category--view-block:hover .hp-listing-category__title a {
    color: var(--blue) !important;
}

/* ---------- Listing count: white pill, blue text ---------- */
.hp-listing-category__item-count,
.hp-listing-category__count {
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    left: auto !important;
    z-index: 50 !important;
    margin: 0 !important;
    padding: 3px 9px !important;
    transform: none !important;
    background: #FFFFFF !important;
    color: var(--blue) !important;
    border: 1px solid var(--border-blue) !important;
    border-radius: 20px !important;
    box-shadow: 0 2px 6px rgba(15,44,76,.10) !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 10.5px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    letter-spacing: .2px !important;
    text-transform: none !important;
    white-space: nowrap !important;
}

/* keyboard focus */
.hp-listing-category--view-block a:focus-visible,
.hp-listing-category--submit-block a:focus-visible {
    outline: 2px solid var(--blue) !important;
    outline-offset: 2px !important;
}

/* ---------- TABLET — 4 columns ---------- */
@media (min-width: 768px) and (max-width: 1023px) {
    .hp-listing-categories,
    .hp-categories {
        max-width: 100% !important;
    }

    .hp-listing-categories .hp-row,
    .hp-categories .hp-row {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        column-gap: 12px !important;
        row-gap: 12px !important;
    }

    .hp-listing-category--view-block .hp-listing-category__image,
    .hp-listing-category--submit-block .hp-listing-category__image {
        height: 128px !important;
        min-height: 128px !important;
        flex-basis: 128px !important;
    }

    .hp-listing-category__name,
    .hp-listing-category__title {
        font-size: 12.5px !important;
    }
}

/* ---------- MOBILE — 2 columns (non-home category pages) ---------- */
@media (max-width: 767px) {
    .hp-listing-categories,
    .hp-categories {
        max-width: 100% !important;
    }

    .hp-listing-categories .hp-row,
    .hp-categories .hp-row {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        column-gap: 12px !important;
        row-gap: 12px !important;
        padding: 4px 0 14px !important;
    }

    .hp-listing-category--view-block,
    .hp-listing-category--submit-block {
        border-radius: 14px !important;
    }

    .hp-listing-category--view-block .hp-listing-category__image,
    .hp-listing-category--submit-block .hp-listing-category__image {
        height: 108px !important;
        min-height: 108px !important;
        flex-basis: 108px !important;
    }

    .hp-listing-category--view-block .hp-listing-category__content,
    .hp-listing-category--submit-block .hp-listing-category__content {
        min-height: 54px !important;
        padding: 7px 8px !important;
    }

    .hp-listing-category__name,
    .hp-listing-category__title {
        font-size: 12px !important;
        line-height: 1.25 !important;
    }

    .hp-listing-category__item-count,
    .hp-listing-category__count {
        top: 7px !important;
        right: 7px !important;
        padding: 2px 7px !important;
        font-size: 9.5px !important;
    }
}

/* ---------- MOBILE — HOMEPAGE ONLY: 2-row swipe carousel ----------
   - Elementor/theme parents: side padding 0 so the row gets full width
   - cards 180px, image 135px (~1.9 cards visible = swipe hint)
   ---------------------------------------------------------------- */
@media (max-width: 767px) {

    /* 1. parents of the categories: no side padding/margin */
    body.home .elementor-section:has(.hp-listing-categories) > .elementor-container,
    body.home .elementor-section:has(.hp-categories) > .elementor-container,
    body.home .elementor-column:has(.hp-listing-categories),
    body.home .elementor-column:has(.hp-categories),
    body.home .elementor-widget-wrap:has(.hp-listing-categories),
    body.home .elementor-widget-wrap:has(.hp-categories),
    body.home .elementor-widget-container:has(.hp-listing-categories),
    body.home .elementor-widget-container:has(.hp-categories),
    body.home .e-con:has(.hp-listing-categories),
    body.home .e-con:has(.hp-categories),
    body.home .e-con-inner:has(.hp-listing-categories),
    body.home .e-con-inner:has(.hp-categories),
    body.home .hp-listing-categories,
    body.home .hp-categories {
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* 2. scrolling row */
    body.home .hp-listing-categories .hp-row,
    body.home .hp-categories .hp-row {
        display: grid !important;
        grid-auto-flow: column !important;
        grid-template-rows: repeat(2, auto) !important;
        grid-template-columns: none !important;
        column-gap: 12px !important;
        row-gap: 12px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 4px 16px 16px !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        scroll-snap-type: x mandatory !important;
        scroll-padding-left: 16px !important;
        scrollbar-width: none !important;
        box-sizing: border-box !important;
    }

    body.home .hp-listing-categories .hp-row::-webkit-scrollbar,
    body.home .hp-categories .hp-row::-webkit-scrollbar {
        display: none !important;
    }

    /* 3. cards */
    body.home .hp-listing-categories .hp-row > .hp-grid__item,
    body.home .hp-categories .hp-row > .hp-grid__item {
        display: flex !important;
        flex: none !important;
        width: 180px !important;
        min-width: 180px !important;
        max-width: 180px !important;
        margin: 0 !important;
        padding: 0 !important;
        scroll-snap-align: start !important;
        box-sizing: border-box !important;
    }

    body.home .hp-listing-category--view-block,
    body.home .hp-listing-category--submit-block {
        border-radius: 14px !important;
    }

    body.home .hp-listing-category--view-block .hp-listing-category__image,
    body.home .hp-listing-category--submit-block .hp-listing-category__image {
        height: 135px !important;
        min-height: 135px !important;
        flex-basis: 135px !important;
    }

    body.home .hp-listing-category--view-block .hp-listing-category__content,
    body.home .hp-listing-category--submit-block .hp-listing-category__content {
        min-height: 54px !important;
        padding: 8px 10px !important;
    }

    body.home .hp-listing-category__name,
    body.home .hp-listing-category__title {
        font-size: 13px !important;
        line-height: 1.3 !important;
        -webkit-line-clamp: 2 !important;
    }

    body.home .hp-listing-category__item-count,
    body.home .hp-listing-category__count {
        top: 8px !important;
        right: 8px !important;
        padding: 3px 8px !important;
        font-size: 10px !important;
    }
}

/* Category page hero: title amber, count pill neat */
.hp-listing-category--view-page .hp-listing-category__header {
    text-align: center !important;
}

.hp-listing-category--view-page .hp-listing-category__name {
    display: block !important;
    color: #FF751F !important;
    font-size: 32px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    text-align: center !important;
    text-shadow: none !important;
    -webkit-line-clamp: unset !important;
    overflow: visible !important;
}

.hp-listing-category--view-page .hp-listing-category__item-count {
    position: static !important;
    display: inline-block !important;
    margin: 0 0 12px !important;
}

@media (max-width: 767px) {
    .hp-listing-category--view-page .hp-listing-category__name {
        font-size: 24px !important;
    }
}

/* Category page hero: white background */
.hp-listing-category--view-page.header-hero {
    background: #F8FBFF !important;
}

.hp-listing-category--view-page.header-hero::before,
.hp-listing-category--view-page.header-hero::after {
    background: transparent !important;
}

.hp-listing-category--view-page .header-hero__content {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

@media (max-width: 767px) {
    .hp-listing-category--view-page .header-hero__content {
        padding-top: 40px !important;
        padding-bottom: 70px !important;
    }
}

/* =========================================================
   10. LISTING CARDS v4 — homepage, category/search pages, related listings
   Card = [logo area] [category] [title] [city] [Call][WhatsApp][Message]
   - Buttons are equal size; missing buttons disappear, rest share the row.
   - Only Message available -> full-width "Message" button.
   - City sits on its own line above the buttons.
   - Same card on EVERY page that shows .hp-listing--view-block cards
     (dashboard table view is excluded).
   - Desktop: HivePress grid untouched, cards equal height.
   - Mobile homepage: single-row swipe carousel, 232px cards.
   - Mobile other pages: 1 column (2 columns from 520px width).
   ========================================================= */

/* ---------- Card ---------- */
.hp-listings:not(.hp-table) .hp-listing--view-block.hp-listing {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    background: #FFFFFF !important;
    border: 1px solid var(--border, #E2E8F0) !important;
    border-radius: 14px !important;
    box-shadow: 0 2px 10px rgba(15,44,76,.06) !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

.hp-listings:not(.hp-table) .hp-listing--view-block.hp-listing:hover {
    transform: translateY(-3px) !important;
    border-color: var(--border-blue, #93C5FD) !important;
    box-shadow: 0 12px 26px rgba(15,44,76,.13) !important;
}

/* Featured = blue border */
.hp-listings:not(.hp-table) .hp-listing--view-block.hp-listing--featured {
    border-color: var(--blue, #2563EB) !important;
}

/* ---------- Header / logo area ---------- */
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__header {
    position: relative !important;
    flex: 0 0 auto !important;
}

.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__image {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 185px !important;
    min-height: 185px !important;
    max-height: 185px !important;
    padding: 12px !important;
    background: var(--light-bg, #F1F5FB) !important;
    border-bottom: 1px solid var(--border, #E2E8F0) !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__image::after {
    display: none !important;
}

.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__image a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
}

/* logo: fully visible, never cropped */
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__image img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    border-radius: 6px !important;
    filter: none !important;
    transform: none !important;
}

/* ---------- Featured badge: blue "Featured" pill ---------- */
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__featured-badge {
    position: absolute !important;
    top: 8px !important;
    left: 8px !important;
    right: auto !important;
    bottom: auto !important;
    z-index: 5 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 3px 9px !important;
    background: var(--blue, #2563EB) !important;
    color: #FFFFFF !important;
    border: 0 !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    transform: none !important;
}

.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__featured-badge i,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__featured-badge .hp-icon {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 10px !important;
    color: #FFFFFF !important;
}

.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__featured-badge::after {
    content: "Featured";
}

/* ---------- Content ---------- */
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__content {
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 14px 16px 6px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

/* Category: single-line pill */
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__categories.hp-listing__category {
    display: block !important;
    min-height: 0 !important;
    max-width: 100% !important;
    margin: 0 0 8px !important;
    overflow: hidden !important;
    -webkit-line-clamp: unset !important;
}

.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__categories.hp-listing__category a {
    display: inline-block !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    vertical-align: top !important;
}

/* Title: max 2 lines */
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__title {
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    overflow: hidden !important;
    margin: 0 0 4px !important;
    font-size: 15px !important;
    line-height: 1.35 !important;
}

/* Empty details wrapper should not take space */
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__details {
    margin: 0 !important;
    padding: 0 !important;
}

/* ---------- City (works in content OR footer) ---------- */
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__content .hp-listing__attribute,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute:not(.hp-listing__attribute--phone):not(.hp-listing__attribute--whatsapp) {
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
    order: 0 !important;
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: var(--text-muted, #64748B) !important;
    font-family: inherit !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    text-align: left !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    box-sizing: border-box !important;
}

.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__content .hp-listing__attribute *,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute:not(.hp-listing__attribute--phone):not(.hp-listing__attribute--whatsapp) * {
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    color: var(--text-muted, #64748B) !important;
    background: transparent !important;
    border: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* one pin icon, drawn by CSS (theme icons hidden to avoid doubles) */
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__content .hp-listing__attribute > i,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__content .hp-listing__attribute > .hp-icon,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute:not(.hp-listing__attribute--phone):not(.hp-listing__attribute--whatsapp) > i,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute:not(.hp-listing__attribute--phone):not(.hp-listing__attribute--whatsapp) > .hp-icon {
    display: none !important;
}

.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__content .hp-listing__attribute::before,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute:not(.hp-listing__attribute--phone):not(.hp-listing__attribute--whatsapp)::before {
    content: "\f3c5";
    font-family: "Font Awesome 5 Free", "Font Awesome 6 Free" !important;
    font-weight: 900 !important;
    font-size: 12px !important;
    line-height: 1 !important;
    color: var(--text-muted, #64748B) !important;
    flex: 0 0 auto !important;
}

/* ---------- Footer: city on top, equal buttons below ---------- */
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    height: auto !important;
    min-height: 0 !important;
    margin-top: auto !important;
    padding: 0 16px 16px !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-sizing: border-box !important;
}

/* wrappers dissolve so all items share one flex container */
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attributes,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__actions {
    display: contents !important;
}

/* order: city, Call, WhatsApp, Message */
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--phone { order: 1 !important; }
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--whatsapp { order: 2 !important; }
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__action--message { order: 3 !important; }

/* phone / whatsapp wrappers = plain equal cells */
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--phone,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--whatsapp {
    display: flex !important;
    flex: 1 1 0 !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    height: 36px !important;
    min-height: 36px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transform: none !important;
}

/* the actual Call / WhatsApp buttons */
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--phone a,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--phone a.button,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--whatsapp a,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--whatsapp a.button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: none !important;
    height: 36px !important;
    min-height: 36px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    color: #FFFFFF !important;
    font-size: 0 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
    transition: background-color .15s ease !important;
}

/* Call + WhatsApp: all inner markup and theme pseudo-elements killed (any state);
   the icon is the button's own centered background image (SVG, no icon font). */
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--phone a > *,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--phone a:hover > *,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--phone a:focus > *,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--whatsapp a > *,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--whatsapp a:hover > *,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--whatsapp a:focus > * {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
}

.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--phone a::before,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--phone a::after,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--phone a:hover::before,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--phone a:hover::after,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--phone a:focus::before,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--phone a:focus::after,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--whatsapp a::before,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--whatsapp a::after,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--whatsapp a:hover::before,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--whatsapp a:hover::after,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--whatsapp a:focus::before,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--whatsapp a:focus::after {
    content: none !important;
    display: none !important;
}

.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--phone a,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--phone a:hover,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--phone a:focus,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--phone a:active,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--whatsapp a,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--whatsapp a:hover,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--whatsapp a:focus,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--whatsapp a:active {
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 22px 22px !important;
}

/* WhatsApp: green button, white icon */
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--whatsapp a,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--whatsapp a.button {
    background-color: var(--whatsapp, #22C55E) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21l1.65 -3.8a9 9 0 1 1 3.4 2.9l-5.05 .9'/%3E%3Cpath d='M9 10a.5 .5 0 0 0 1 0v-1a.5 .5 0 0 0 -1 0v1a5 5 0 0 0 5 5h1a.5 .5 0 0 0 0 -1h-1a.5 .5 0 0 0 0 1'/%3E%3C/svg%3E") !important;
}

.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--whatsapp a:hover,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--whatsapp a:focus,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--whatsapp a:active {
    background-color: var(--whatsapp-hover, #16A34A) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21l1.65 -3.8a9 9 0 1 1 3.4 2.9l-5.05 .9'/%3E%3Cpath d='M9 10a.5 .5 0 0 0 1 0v-1a.5 .5 0 0 0 -1 0v1a5 5 0 0 0 5 5h1a.5 .5 0 0 0 0 -1h-1a.5 .5 0 0 0 0 1'/%3E%3C/svg%3E") !important;
}

/* Call: blue button, white icon */
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--phone a,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--phone a.button {
    background-color: var(--blue, #2563EB) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h4l2 5l-2.5 1.5a11 11 0 0 0 5 5l1.5 -2.5l5 2v4a2 2 0 0 1 -2 2a16 16 0 0 1 -15 -15a2 2 0 0 1 2 -2'/%3E%3C/svg%3E") !important;
}

.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--phone a:hover,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--phone a:focus,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__attribute--phone a:active {
    background-color: var(--blue-dark, #1D4ED8) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 4h4l2 5l-2.5 1.5a11 11 0 0 0 5 5l1.5 -2.5l5 2v4a2 2 0 0 1 -2 2a16 16 0 0 1 -15 -15a2 2 0 0 1 2 -2'/%3E%3C/svg%3E") !important;
}

/* Message: outline button, AMBER icon */
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__action--message {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
    height: 36px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #FFFFFF !important;
    border: 1px solid var(--border, #E2E8F0) !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    color: var(--amber) !important;
    font-size: 0 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
    transition: background-color .15s ease, border-color .15s ease !important;
}

.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__action--message:hover,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__action--message:focus {
    background: var(--amber-light) !important;
    border-color: var(--amber) !important;
}

.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__action--message i,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__action--message .hp-icon {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 17px !important;
    color: var(--amber) !important;
    background: transparent !important;
    transition: color .15s ease !important;
}

.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__action--message:hover i,
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer .hp-listing__action--message:hover .hp-icon {
    color: var(--amber-dark) !important;
}

/* Only Message available (no WhatsApp, no Call) -> full-width with text label */
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer:not(:has(.hp-listing__attribute--whatsapp, .hp-listing__attribute--phone)) .hp-listing__action--message::after {
    content: "Message";
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--amber-dark) !important;
}

/* ---------- DESKTOP: every card in a row gets the same height ---------- */
@media (min-width: 783px) {
    .hp-listings:not(.hp-table) .hp-grid__item {
        display: flex !important;
    }
}

/* ---------- MOBILE ---------- */
@media (max-width: 782px) {

    /* homepage: single-row swipe carousel */
    body.home .hp-listings:not(.hp-table) .hp-row {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;
        gap: 12px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 4px 16px 14px !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        scroll-snap-type: x mandatory !important;
        scroll-padding-left: 16px !important;
        scrollbar-width: none !important;
        box-sizing: border-box !important;
    }

    body.home .hp-listings:not(.hp-table) .hp-row::-webkit-scrollbar {
        display: none !important;
    }

    body.home .hp-listings:not(.hp-table) .hp-grid__item {
        display: flex !important;
        flex: 0 0 232px !important;
        width: 232px !important;
        min-width: 232px !important;
        max-width: 232px !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 0 !important;
        scroll-snap-align: start !important;
        box-sizing: border-box !important;
    }

    /* every other page: normal grid, 1 column */
    body:not(.home) .hp-listings:not(.hp-table) .hp-row {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 14px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        box-sizing: border-box !important;
    }

    body:not(.home) .hp-listings:not(.hp-table) .hp-grid__item {
        display: flex !important;
        flex: none !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    /* card parts, all mobile pages */
    .hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__image {
        height: 180px !important;
        min-height: 180px !important;
        max-height: 180px !important;
        padding: 10px !important;
    }

    .hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__content {
        padding: 12px 12px 6px !important;
    }

    .hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__title {
        font-size: 14px !important;
    }

    .hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__footer {
        padding: 0 12px 12px !important;
    }
}

/* larger phones / small tablets: 2 columns on non-home pages */
@media (min-width: 520px) and (max-width: 782px) {
    body:not(.home) .hp-listings:not(.hp-table) .hp-row {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

/* Category pill colour (listing cards) — TEAL */
.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__categories.hp-listing__category a {
    background: var(--teal-light) !important;
    color: var(--teal) !important;
    transition: background .2s ease, color .2s ease !important;
}

.hp-listings:not(.hp-table) .hp-listing--view-block .hp-listing__categories.hp-listing__category a:hover {
    background: var(--teal) !important;
    color: #FFFFFF !important;
}

/* =========================================================
   11. SINGLE LISTING PAGE  (works with single-listing-sections.js)
   Only ONE system lives here: the .bli- sectioned cards.
   Mobile breakpoint everywhere = 767px.
   ========================================================= */

/* ---------- Page background ---------- */
.hp-template--listing-view-page,
.hp-template--listing-view-page .site-content {
    background: var(--light-bg) !important;
}

/* ---------- Two-column layout ---------- */
.hp-template--listing-view-page .hp-row.hp-listing--view-page {
    display: flex !important;
    flex-wrap: nowrap !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 32px 20px 60px !important;
    gap: 24px !important;
}

.hp-template--listing-view-page .hp-page__content.hp-col-sm-8 {
    flex: 1 1 0 !important;
    max-width: none !important;
    min-width: 0 !important;
    float: none !important;
    padding-right: 0 !important;
}

.hp-template--listing-view-page .hp-page__sidebar.hp-col-sm-4 {
    flex: 0 0 320px !important;
    max-width: 320px !important;
    width: 320px !important;
    float: none !important;
}

/* ---------- Breadcrumb ---------- */
.hp-template--listing-view-page .hp-breadcrumbs,
.hp-template--listing-view-page nav[aria-label="breadcrumb"] {
    margin-bottom: 14px !important;
    font-size: 13px !important;
    color: var(--text-muted) !important;
}

/* ---------- Title + category (main listing only, NOT related cards) ---------- */
.hp-listing--view-page .hp-listing__title {
    color: var(--navy) !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 28px !important;
    font-weight: 700 !important;
    margin: 6px 0 8px !important;
    line-height: 1.25 !important;
}

.hp-listing--view-page .hp-listing__categories.hp-listing__category a {
    background: #EFF6FF !important;
    color: var(--blue) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: .4px !important;
    text-transform: uppercase !important;
    padding: 5px 12px !important;
    border-radius: 20px !important;
}

/* ---------- Action buttons row (Share / Edit etc.) ---------- */
.hp-template--listing-view-page .hp-listing--view-page .hp-listing__actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin-bottom: 20px !important;
}

.hp-template--listing-view-page .hp-listing--view-page .hp-listing__action {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 9px 16px !important;
    border-radius: 8px !important;
    border: 1px solid var(--border) !important;
    background: #FFFFFF !important;
    color: var(--text) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

.hp-template--listing-view-page .hp-listing--view-page .hp-listing__action--message,
.hp-template--listing-view-page .hp-listing--view-page .hp-listing__action.hp-link--primary {
    background: var(--blue) !important;
    border-color: var(--blue) !important;
    color: #FFFFFF !important;
}

/* ---------- Photo gallery ---------- */
.hp-listing__images {
    display: flow-root !important;
    height: auto !important;
    min-height: 0 !important;
    background: var(--light-bg) !important;
    border-radius: 12px !important;
    padding: 20px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,.08) !important;
    margin-bottom: 16px !important;
    text-align: center !important;
    box-sizing: border-box !important;
}

/* single image (no slider) */
.hp-listing__images > img {
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 400px !important;
    object-fit: contain !important;
    border-radius: 9px !important;
    background: #FFFFFF !important;
    display: inline-block !important;
    margin: 0 auto !important;
}

/* slider: NO fixed slide height (that caused the big gap + cut thumbnails) */
.hp-listing__images .slick-slide {
    height: auto !important;
}

.hp-listing__images .slick-slide img {
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 400px !important;
    object-fit: contain !important;
    border-radius: 9px !important;
    background: #FFFFFF !important;
    display: block !important;
    margin: 0 auto !important;
}

/* thumbnail strip */
.hp-listing__images-carousel,
.hp-listing__image-carousel {
    margin-top: 12px !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
}

.hp-listing__images-carousel .slick-slide,
.hp-listing__image-carousel .slick-slide {
    height: 80px !important;
    background: var(--light-bg) !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    border: 1px solid var(--border) !important;
    box-sizing: border-box !important;
}

.hp-listing__images-carousel .slick-slide img,
.hp-listing__image-carousel .slick-slide img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    border-radius: 0 !important;
    background: #FFFFFF !important;
    display: block !important;
    padding: 4px !important;
    box-sizing: border-box !important;
}

.hp-listing__images-carousel .slick-slide.slick-current,
.hp-listing__image-carousel .slick-slide.slick-current {
    border-color: var(--blue) !important;
}

/* ---------- Ad slots ---------- */
.bli-ad-slot {
    margin: 26px 0 !important;
    padding: 10px !important;
    text-align: center !important;
    background: #FFFFFF !important;
    border: 1px dashed #C9D5E4 !important;
    border-radius: 10px !important;
    min-height: 90px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: var(--text-muted) !important;
    font-size: 11px !important;
    letter-spacing: .5px !important;
    text-transform: uppercase !important;
}

.bli-ad-slot--sidebar {
    margin: 20px 0 0 !important;
    min-height: 250px !important;
}

/* ---------- JS not run yet? simple fallback look ---------- */
.hp-template--listing-view-page:not([data-bli-sectioned="1"]) .hp-listing--view-page .hp-listing__attribute:not(.hp-listing__attribute--whatsapp):not(.hp-listing__attribute--facebook):not(.hp-listing__attribute--instagram):not(.hp-listing__attribute--linkedin):not(.hp-listing__attribute--youtube):not(.hp-listing__attribute--twitter):not(.hp-listing__attribute--x):not(.hp-listing__attribute--google-maps-url) {
    padding: 12px 15px;
    font-size: 15px;
    margin-bottom: 10px;
}

/* =========================================================
   SECTIONED CARDS
   ========================================================= */
.bli-listing-sections {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
    margin-top: 20px !important;
}

.bli-listing-card {
    position: relative !important;
    background: #FFFFFF !important;
    border: 1px solid var(--border) !important;
    border-radius: 14px !important;
    padding: 22px 26px !important;
    box-shadow: 0 6px 20px rgba(15,44,76,.05) !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

.bli-listing-card__header {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin-bottom: 16px !important;
}

.bli-listing-card__icon {
    flex: 0 0 30px !important;
    width: 30px !important;
    height: 30px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: var(--blue) !important;
    color: #FFFFFF !important;
    font-size: 13px !important;
    border-radius: 9px !important;
}

.bli-listing-card__icon i {
    color: #FFFFFF !important;
    margin: 0 !important;
    font-size: 13px !important;
}

.bli-listing-card__header h3 {
    margin: 0 !important;
    color: var(--navy) !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 16px !important;
    font-weight: 600 !important;
}

/* old ::before labels off — JS adds real labels */
.hp-template--listing-view-page .bli-listing-card .hp-listing__attribute::before,
.hp-template--listing-view-page .bli-listing-card .hp-listing__attribute::after,
.hp-template--listing-view-page .bli-listing-card .hp-listing__description::before,
.hp-template--listing-view-page .bli-listing-card .hp-listing__description::after {
    content: none !important;
    display: none !important;
}

/* ---------- About ---------- */
.hp-template--listing-view-page .bli-listing-card--about .hp-listing__description {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 1.75 !important;
    color: var(--text) !important;
}

.hp-template--listing-view-page .bli-listing-card--about .hp-listing__description p:last-child {
    margin-bottom: 0 !important;
}

/* ---------- Grids for tile sections ---------- */
.bli-listing-card--key-info .bli-listing-card__body {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 14px !important;
    align-items: stretch !important;
}

.bli-listing-card--location .bli-listing-card__body,
.bli-listing-card--other .bli-listing-card__body {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
    align-items: stretch !important;
}

/* ---------- Info tile (label + value) ---------- */
.hp-template--listing-view-page .bli-listing-card .hp-listing__attribute.bli-attr {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: flex-start !important;
    gap: 4px !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    min-height: 68px !important;
    float: none !important;
    margin: 0 !important;
    padding: 12px 16px !important;
    box-sizing: border-box !important;
    background: var(--light-bg) !important;
    border: 1px solid var(--border) !important;
    border-radius: 10px !important;
    box-shadow: none !important;
    text-align: left !important;
}

.bli-attr__label {
    font-size: 12px !important;
    font-weight: 500 !important;
    color: var(--text-muted) !important;
    line-height: 1.2 !important;
}

.bli-attr__value {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: var(--text) !important;
    line-height: 1.4 !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
}

.hp-template--listing-view-page .bli-attr__value a,
.hp-template--listing-view-page .bli-attr__value a.button {
    display: inline !important;
    width: auto !important;
    max-width: none !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    color: var(--blue) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    text-align: left !important;
    text-decoration: none !important;
    text-transform: none !important;
}

.hp-template--listing-view-page .bli-attr__value a:hover {
    text-decoration: underline !important;
}

/* tile icons injected by HivePress are not needed inside tiles */
.hp-template--listing-view-page .bli-attr__value > i,
.hp-template--listing-view-page .bli-attr__value > .hp-icon {
    display: none !important;
}

/* full-width rows in Location */
.bli-listing-card--location .hp-listing__attribute--address,
.bli-listing-card--location .hp-listing__attribute--google-maps-url {
    grid-column: 1 / -1 !important;
}

/* ---------- Contact card ---------- */
.bli-listing-card--contact-info .bli-listing-card__body {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 14px !important;
}

/* Phone + WhatsApp = same-size buttons, capped width when only one exists */
.bli-contact-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    width: 100% !important;
}

.hp-template--listing-view-page .bli-contact-actions .hp-listing__attribute {
    position: static !important;
    display: flex !important;
    align-items: stretch !important;
    flex: 1 1 calc(50% - 7px) !important;
    max-width: calc(50% - 7px) !important;
    height: 48px !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.hp-template--listing-view-page .bli-contact-actions .hp-listing__attribute a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    flex: 1 1 auto !important;
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 0 !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 16px !important;
    border: 0 !important;
    border-radius: 10px !important;
    background-image: none !important;
    color: #FFFFFF !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    text-transform: none !important;
    white-space: nowrap !important;
    transition: filter .15s ease !important;
}

.hp-template--listing-view-page .bli-contact-actions .hp-listing__attribute--phone a {
    background-color: var(--blue) !important;
}

.hp-template--listing-view-page .bli-contact-actions .hp-listing__attribute--whatsapp a {
    background-color: var(--whatsapp) !important;
}

.hp-template--listing-view-page .bli-contact-actions .hp-listing__attribute a:hover {
    filter: brightness(.92) !important;
}

.hp-template--listing-view-page .bli-contact-actions .hp-listing__attribute a i,
.hp-template--listing-view-page .bli-contact-actions .hp-listing__attribute a .hp-icon {
    color: #FFFFFF !important;
    margin: 0 !important;
    font-size: 14px !important;
}

/* Email + Website tiles = whole tile is the link, capped width when only one exists */
.bli-contact-tiles {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 14px !important;
    width: 100% !important;
}

.hp-template--listing-view-page .bli-listing-card--contact-info .hp-listing__attribute.bli-attr--link {
    flex: 1 1 calc(50% - 7px) !important;
    max-width: calc(50% - 7px) !important;
    padding: 0 !important;
    transition: border-color .15s ease, background-color .15s ease !important;
}

.hp-template--listing-view-page .bli-listing-card--contact-info .hp-listing__attribute.bli-attr--link:hover {
    background: #FFFFFF !important;
    border-color: var(--blue) !important;
}

.hp-template--listing-view-page .bli-listing-card--contact-info a.bli-attr__link {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: flex-start !important;
    gap: 4px !important;
    flex: 1 1 auto !important;
    align-self: stretch !important;
    width: 100% !important;
    min-height: 68px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 12px 16px !important;
    background: transparent !important;
    border: 0 !important;
    color: inherit !important;
    text-decoration: none !important;
}

.hp-template--listing-view-page .bli-listing-card--contact-info a.bli-attr__link .bli-attr__value {
    color: var(--blue) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}

/* ---------- Social buttons + Get Directions ---------- */
.bli-listing-card--social-media .bli-listing-card__body {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
}

.hp-template--listing-view-page .bli-listing-card--social-media .hp-listing__attribute,
.hp-template--listing-view-page .bli-listing-card--location .hp-listing__attribute--google-maps-url {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    width: auto !important;
    max-width: none !important;
    min-height: 0 !important;
}

.hp-template--listing-view-page .bli-listing-card--social-media .hp-listing__attribute a,
.hp-template--listing-view-page .bli-listing-card--location .hp-listing__attribute--google-maps-url a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 18px !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
}

.hp-template--listing-view-page .bli-listing-card--location .hp-listing__attribute--google-maps-url {
    justify-self: center !important;
}

.hp-template--listing-view-page .bli-listing-card--location .hp-listing__attribute--google-maps-url a {
    gap: 8px !important;
    padding: 0 24px !important;
    height: 42px !important;
    min-height: 42px !important;
}

.hp-template--listing-view-page .bli-listing-card--location .hp-listing__attribute--google-maps-url i {
    font-size: 14px !important;
    margin: 0 !important;
    color: #FFFFFF !important;
}

/* ---------- Tags as pills ---------- */
.hp-template--listing-view-page .bli-listing-card--tags .hp-listing__attribute--tags {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: none !important;
}

.bli-pill {
    display: inline-block !important;
    max-width: 100% !important;
    padding: 6px 14px !important;
    background: #EFF6FF !important;
    border: 1px solid #DBEAFE !important;
    border-radius: 14px !important;
    color: var(--blue) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
    text-align: left !important;
}

/* ---------- Opening hours ---------- */
.hp-template--listing-view-page .bli-listing-card--opening-hours .hp-listing__attribute--opening-hours {
    display: block !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: none !important;
}

.bli-hours {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important;
    gap: 10px 24px !important;
    align-items: center !important;
    padding: 14px 16px !important;
    background: var(--light-bg) !important;
    border: 1px solid var(--border) !important;
    border-radius: 10px !important;
    font-size: 14px !important;
}

.bli-hours__row {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: baseline !important;
    justify-content: flex-start !important;
    gap: 2px 8px !important;
    padding: 0 !important;
    border: 0 !important;
}

.bli-hours__day {
    color: var(--text) !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
}

.bli-hours__day::after {
    content: ":";
}

.bli-hours__time {
    color: var(--text) !important;
    white-space: nowrap !important;
}

.bli-hours__time.is-closed {
    color: #DC2626 !important;
    font-weight: 600 !important;
}

/* ---------- TABLET (768 – 1100px) ---------- */
@media (min-width: 768px) and (max-width: 1100px) {
    .hp-template--listing-view-page .hp-row.hp-listing--view-page {
        max-width: 94% !important;
        padding: 26px 16px 50px !important;
        gap: 18px !important;
    }

    .hp-template--listing-view-page .hp-page__sidebar.hp-col-sm-4 {
        flex: 0 0 260px !important;
        max-width: 260px !important;
        width: 260px !important;
    }

    .bli-listing-card {
        padding: 18px 20px !important;
    }

    .bli-listing-card--key-info .bli-listing-card__body {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

/* =========================================================
   SINGLE LISTING — MOBILE (max 767px)
   Layout, page width/spacing, gallery, section cards, contact,
   social, tags and opening hours. The sidebar's own look is
   styled further below ("SIDEBAR" block).
   ========================================================= */
@media (max-width: 767px) {

    /* ---------- page width / side spacing ---------- */
    .hp-template--listing-view-page .site-content {
        overflow-x: clip !important;
    }

    .hp-template--listing-view-page .site-content .container,
    .hp-template--listing-view-page .content-area {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        box-sizing: border-box !important;
    }

    .hp-template--listing-view-page .hp-page.site-main {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 16px !important;
        padding-right: 16px !important;
        box-sizing: border-box !important;
    }

    /* ---------- layout: stack content, then sidebar ---------- */
    .hp-template--listing-view-page .hp-row.hp-listing--view-page {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 14px 0 36px !important;
        gap: 14px !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    .hp-template--listing-view-page .hp-page__content.hp-col-sm-8 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .hp-template--listing-view-page .hp-page__sidebar.hp-col-sm-4 {
        flex: 1 1 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    .hp-listing--view-page .hp-listing__title {
        font-size: 22px !important;
        overflow-wrap: anywhere !important;
    }

    .hp-template--listing-view-page .hp-listing--view-page .hp-listing__actions {
        margin-bottom: 14px !important;
    }

    .hp-template--listing-view-page .hp-page__topbar {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        gap: 8px 12px !important;
    }

    /* ---------- gallery ---------- */
    .hp-listing__images {
        padding: 10px !important;
        border-radius: 10px !important;
    }

    .hp-listing__images > img,
    .hp-listing__images .slick-slide img {
        max-height: 260px !important;
    }

    .hp-listing__images-carousel .slick-slide,
    .hp-listing__image-carousel .slick-slide {
        height: 60px !important;
    }

    /* ---------- cards ---------- */
    .bli-listing-sections {
        gap: 12px !important;
        margin-top: 12px !important;
    }

    .bli-listing-card {
        padding: 16px 14px !important;
        border-radius: 12px !important;
        box-sizing: border-box !important;
    }

    .bli-listing-card__header {
        margin-bottom: 12px !important;
    }

    .bli-listing-card__body > *,
    .bli-contact-actions > *,
    .bli-contact-tiles > * {
        min-width: 0 !important;
    }

    /* Key info: Owner full width, Established + Employees side by side */
    .bli-listing-card--key-info .bli-listing-card__body {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    .bli-listing-card--key-info .hp-listing__attribute--owner-name {
        grid-column: 1 / -1 !important;
    }

    /* Location: 2 per row, address + directions full width */
    .bli-listing-card--location .bli-listing-card__body,
    .bli-listing-card--other .bli-listing-card__body {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    .hp-template--listing-view-page .bli-listing-card .hp-listing__attribute.bli-attr {
        min-height: 60px !important;
        padding: 10px 12px !important;
    }

    /* ---------- contact ---------- */
    .bli-contact-actions,
    .bli-contact-tiles {
        flex-wrap: wrap !important;
        gap: 10px !important;
    }

    .hp-template--listing-view-page .bli-contact-actions .hp-listing__attribute,
    .hp-template--listing-view-page .bli-listing-card--contact-info .hp-listing__attribute.bli-attr--link {
        flex: 1 1 100% !important;
        max-width: 100% !important;
    }

    .hp-template--listing-view-page .bli-listing-card--contact-info a.bli-attr__link {
        padding: 10px 12px !important;
        min-height: 60px !important;
    }

    /* ---------- social: 2 per row ---------- */
    .bli-listing-card--social-media .bli-listing-card__body {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    .hp-template--listing-view-page .bli-listing-card--social-media .hp-listing__attribute {
        display: block !important;
        flex: none !important;
        width: 100% !important;
    }

    .hp-template--listing-view-page .bli-listing-card--social-media .hp-listing__attribute a {
        display: flex !important;
        width: 100% !important;
        box-sizing: border-box !important;
        justify-content: center !important;
        padding: 0 8px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    /* odd last social button spans full width */
    .hp-template--listing-view-page .bli-listing-card--social-media .hp-listing__attribute:last-child:nth-child(odd) {
        grid-column: 1 / -1 !important;
    }

    /* Get Directions full width */
    .hp-template--listing-view-page .bli-listing-card--location .hp-listing__attribute--google-maps-url {
        justify-self: stretch !important;
        width: 100% !important;
    }

    .hp-template--listing-view-page .bli-listing-card--location .hp-listing__attribute--google-maps-url a {
        width: 100% !important;
    }

    /* ---------- tags ---------- */
    .bli-pill {
        font-size: 12px !important;
        padding: 5px 12px !important;
    }

    /* ---------- opening hours: one column, day + time stay together ---------- */
    .bli-hours {
        grid-template-columns: 1fr !important;
        padding: 12px !important;
        font-size: 13.5px !important;
    }

    /* ---------- ad slots ---------- */
    .bli-ad-slot {
        min-height: 70px !important;
        margin: 18px 0 !important;
    }

    .bli-ad-slot--sidebar {
        min-height: 100px !important;
    }
}

/* ---------- VERY SMALL PHONES (max 359px) ---------- */
@media (max-width: 359px) {
    .hp-template--listing-view-page .bli-listing-card--key-info .bli-listing-card__body,
    .hp-template--listing-view-page .bli-listing-card--location .bli-listing-card__body,
    .hp-template--listing-view-page .bli-listing-card--other .bli-listing-card__body {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .hp-template--listing-view-page .bli-hours {
        font-size: 13px !important;
    }

    .hp-template--listing-view-page .bli-listing-sections .bli-listing-card {
        padding: 14px 12px !important;
    }
}

/* =========================================================
   SIDEBAR — RESPONSIVE UNIFIED CARD (desktop + tablet + mobile)
   ========================================================= */

/* ---------- Main card ---------- */
.hp-template--listing-view-page .hp-page__sidebar.hp-col-sm-4 {
    position: static !important;
    align-self: flex-start !important;
    height: auto !important;
    min-height: 0 !important;
    transform: none !important;
    box-sizing: border-box !important;
    padding: 24px !important;
    background: #FFFFFF !important;
    border: 1px solid var(--border) !important;
    border-radius: 16px !important;
    box-shadow: 0 8px 24px rgba(15,44,76,.06) !important;
}

/* ---------- Remove sticky-sidebar behaviour ---------- */
.hp-template--listing-view-page .hp-page__sidebar .inner-wrapper-sticky,
.hp-template--listing-view-page .hp-page__sidebar .theiaStickySidebar {
    position: static !important;
    transform: none !important;
    top: auto !important;
    left: auto !important;
    bottom: auto !important;
    width: auto !important;
    height: auto !important;
}

/* ---------- Action buttons ---------- */
.hp-template--listing-view-page .hp-page__sidebar .hp-listing__actions--primary {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    margin: 0 !important;
}

.hp-template--listing-view-page .hp-page__sidebar .hp-listing__actions--primary .hp-listing__action {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 42px !important;
    margin: 0 !important;
    padding: 0 10px !important;
    box-sizing: border-box !important;
    background: #FFFFFF !important;
    border: 1px solid var(--border) !important;
    border-radius: 10px !important;
    color: var(--text) !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    text-decoration: none !important;
    transition: border-color .15s ease, color .15s ease, background-color .15s ease !important;
}

.hp-template--listing-view-page .hp-page__sidebar .hp-listing__actions--primary .hp-listing__action:hover {
    background: #F8FAFF !important;
    border-color: var(--blue) !important;
    color: var(--blue) !important;
}

/* Review / Report icons */
.hp-template--listing-view-page .hp-page__sidebar .hp-listing__action--review i {
    color: var(--amber) !important;
    margin: 0 !important;
    font-size: 13px !important;
}

.hp-template--listing-view-page .hp-page__sidebar .hp-listing__action--report i {
    color: var(--text-muted) !important;
    margin: 0 !important;
    font-size: 13px !important;
}

/* ---------- Reply button ---------- */
.hp-template--listing-view-page .hp-page__sidebar .hp-listing__actions--primary .hp-listing__action--message {
    grid-column: 1 / -1 !important;
    height: 50px !important;
    margin-bottom: 2px !important;
    padding: 0 20px !important;
    background: var(--blue) !important;
    border-color: var(--blue) !important;
    border-radius: 10px !important;
    color: #FFFFFF !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    box-shadow: 0 4px 12px rgba(37,99,235,.24) !important;
}

.hp-template--listing-view-page .hp-page__sidebar .hp-listing__actions--primary .hp-listing__action--message:hover {
    background: var(--blue-dark) !important;
    border-color: var(--blue-dark) !important;
    color: #FFFFFF !important;
}

/* ---------- Owner section ---------- */
.hp-template--listing-view-page .hp-page__sidebar .hp-vendor--view-block {
    display: block !important;
    margin: 24px 0 0 !important;
    padding: 24px 0 4px !important;
    background: transparent !important;
    border: 0 !important;
    border-top: 1px solid var(--border) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    text-align: center !important;
}

.hp-template--listing-view-page .hp-page__sidebar .hp-vendor--view-block::before {
    content: "Listed by";
    display: block;
    margin: 0 0 18px !important;
    color: var(--text-muted);
    font-size: 12px;
    font-weight: 500;
}

/* Owner avatar */
.hp-template--listing-view-page .hp-page__sidebar .hp-vendor__header {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    float: none !important;
    margin: 0 0 18px !important;
    padding: 0 !important;
}

.hp-template--listing-view-page .hp-page__sidebar .hp-vendor__image {
    position: relative !important;
    display: block !important;
    float: none !important;
    flex: 0 0 auto !important;
    width: 92px !important;
    height: 92px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    border-radius: 50% !important;
    overflow: hidden !important;
    background: var(--light-bg) !important;
    box-shadow: 0 0 0 3px #FFFFFF, 0 0 0 4px var(--border) !important;
}

.hp-template--listing-view-page .hp-page__sidebar .hp-vendor__image a {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.hp-template--listing-view-page .hp-page__sidebar .hp-vendor__image img {
    display: block !important;
    position: static !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    transform: none !important;
}

/* Owner name */
.hp-template--listing-view-page .hp-page__sidebar .hp-vendor__content {
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
}

.hp-template--listing-view-page .hp-page__sidebar .hp-vendor__name {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    margin: 0 0 7px !important;
    color: var(--navy) !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
}

.hp-template--listing-view-page .hp-page__sidebar .hp-vendor__name a {
    color: var(--navy) !important;
    text-decoration: none !important;
}

.hp-template--listing-view-page .hp-page__sidebar .hp-vendor__name a:hover {
    color: var(--blue) !important;
}

.hp-template--listing-view-page .hp-page__sidebar .hp-vendor__verified-badge {
    margin: 0 !important;
    color: var(--green) !important;
    font-size: 14px !important;
}

/* Member since */
.hp-template--listing-view-page .hp-page__sidebar .hp-vendor__details {
    margin: 0 !important;
    text-align: center !important;
}

.hp-template--listing-view-page .hp-page__sidebar .hp-vendor__registered-date {
    display: block !important;
    color: var(--text-muted) !important;
    font-size: 12.5px !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    line-height: 1.5 !important;
}

/* ---------- Message icon — AMBER, icon only, centered ---------- */
.hp-template--listing-view-page .hp-page__sidebar .hp-vendor__footer {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin: 22px 0 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
}

.hp-template--listing-view-page .hp-page__sidebar .hp-vendor__actions {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.hp-template--listing-view-page .hp-page__sidebar .hp-vendor__action--message {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    height: auto !important;
    margin: 0 auto !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    color: var(--amber) !important;
    font-size: 0 !important;
    box-shadow: none !important;
    text-decoration: none !important;
}

/* hide "Message owner" text */
.hp-template--listing-view-page .hp-page__sidebar .hp-vendor__action--message::after {
    display: none !important;
    content: none !important;
}

.hp-template--listing-view-page .hp-page__sidebar .hp-vendor__action--message i {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    color: var(--amber) !important;
    font-size: 22px !important;
    line-height: 1 !important;
    transition: color .15s ease, transform .15s ease !important;
}

.hp-template--listing-view-page .hp-page__sidebar .hp-vendor__action--message:hover {
    background: transparent !important;
    border: 0 !important;
    color: var(--amber) !important;
}

.hp-template--listing-view-page .hp-page__sidebar .hp-vendor__action--message:hover i {
    color: var(--amber-dark) !important;
    transform: scale(1.08) !important;
}

/* Vendor message icon — amber everywhere (vendor profile page / vendor cards) */
.hp-vendor__action--message i,
.hp-vendor__action--message .hp-icon {
    color: var(--amber) !important;
    transition: color .15s ease !important;
}

.hp-vendor__action--message:hover i,
.hp-vendor__action--message:hover .hp-icon {
    color: var(--amber-dark) !important;
}

/* ---------- Sidebar: TABLET (768 – 1100px) ---------- */
@media (min-width: 768px) and (max-width: 1100px) {
    .hp-template--listing-view-page .hp-page__sidebar.hp-col-sm-4 {
        padding: 20px !important;
        border-radius: 14px !important;
    }

    /* stack Review + Report */
    .hp-template--listing-view-page .hp-page__sidebar .hp-listing__actions--primary {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .hp-template--listing-view-page .hp-page__sidebar .hp-listing__actions--primary .hp-listing__action--message {
        height: 48px !important;
    }

    .hp-template--listing-view-page .hp-page__sidebar .hp-vendor--view-block {
        margin-top: 22px !important;
        padding-top: 22px !important;
    }

    .hp-template--listing-view-page .hp-page__sidebar .hp-vendor__image {
        width: 84px !important;
        height: 84px !important;
    }

    .hp-template--listing-view-page .hp-page__sidebar .hp-vendor__footer {
        margin-top: 20px !important;
    }
}

/* ---------- Sidebar: MOBILE (max 767px) ---------- */
@media (max-width: 767px) {
    .hp-template--listing-view-page .hp-page__sidebar.hp-col-sm-4 {
        flex: 1 1 auto !important;
        width: 100% !important;
        padding: 18px !important;
        margin-top: 16px !important;
        border-radius: 14px !important;
    }

    /* stack all action buttons */
    .hp-template--listing-view-page .hp-page__sidebar .hp-listing__actions--primary {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .hp-template--listing-view-page .hp-page__sidebar .hp-listing__actions--primary .hp-listing__action--message {
        height: 48px !important;
    }

    .hp-template--listing-view-page .hp-page__sidebar .hp-listing__actions--primary .hp-listing__action {
        height: 42px !important;
    }

    .hp-template--listing-view-page .hp-page__sidebar .hp-vendor--view-block {
        margin-top: 22px !important;
        padding-top: 22px !important;
    }

    .hp-template--listing-view-page .hp-page__sidebar .hp-vendor--view-block::before {
        margin-bottom: 16px !important;
    }

    .hp-template--listing-view-page .hp-page__sidebar .hp-vendor__image {
        width: 78px !important;
        height: 78px !important;
    }

    .hp-template--listing-view-page .hp-page__sidebar .hp-vendor__header {
        margin-bottom: 16px !important;
    }

    .hp-template--listing-view-page .hp-page__sidebar .hp-vendor__name {
        margin-bottom: 6px !important;
    }

    .hp-template--listing-view-page .hp-page__sidebar .hp-vendor__footer {
        margin-top: 20px !important;
    }

    .hp-template--listing-view-page .hp-page__sidebar .hp-vendor__action--message i {
        font-size: 21px !important;
    }
}

/* =========================================================
   12. ADD LISTING + EDIT LISTING FORM — SECTIONED LAYOUT
   (desktop + tablet + mobile)
   Works with add-listing-sections.js AND edit-listing-sections.js
   (both write the same .bli-form-* classes).
   ========================================================= */

/* ---------- Layout: sidebar + sections ---------- */
.hp-template--listing-submit-page .bli-form-layout,
.hp-template--listing-edit-page .bli-form-layout {
    display: flex !important;
    align-items: flex-start !important;
    gap: 24px !important;
    width: 100% !important;
    max-width: 1100px !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
}

/* ---------- Sidebar nav ---------- */
.bli-form-sidebar {
    flex: 0 0 260px !important;
    position: sticky !important;
    top: 110px !important;
    background: #FFFFFF !important;
    border: 1px solid var(--border) !important;
    border-radius: 14px !important;
    padding: 12px !important;
    box-shadow: 0 6px 20px rgba(15,44,76,.05) !important;
    box-sizing: border-box !important;
}

.bli-form-sidebar__list {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
}

.bli-form-sidebar__item {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 10px 12px !important;
    border-radius: 10px !important;
    color: var(--text) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: background .15s ease, color .15s ease !important;
}

.bli-form-sidebar__item:hover {
    background: var(--light-bg) !important;
}

.bli-form-sidebar__item.is-active {
    background: #EFF6FF !important;
    color: var(--blue) !important;
}

.bli-form-sidebar__icon {
    flex: 0 0 32px !important;
    width: 32px !important;
    height: 32px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: var(--light-bg) !important;
    color: var(--text-muted) !important;
    border-radius: 9px !important;
    font-size: 13px !important;
}

.bli-form-sidebar__icon i {
    margin: 0 !important;
    color: inherit !important;
    font-size: 13px !important;
}

.bli-form-sidebar__item.is-active .bli-form-sidebar__icon {
    background: var(--blue) !important;
    color: #FFFFFF !important;
}

.bli-form-sidebar__text {
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
}

.bli-form-sidebar__title {
    line-height: 1.3 !important;
}

.bli-form-sidebar__desc:empty {
    display: none !important;
}

/* ---------- Sections column ---------- */
.bli-form-sections {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
}

.bli-form-section {
    background: #FFFFFF !important;
    border: 1px solid var(--border) !important;
    border-radius: 14px !important;
    padding: 24px 26px !important;
    box-shadow: 0 6px 20px rgba(15,44,76,.05) !important;
    box-sizing: border-box !important;
    scroll-margin-top: 120px !important;
}

.bli-form-section__header {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 6px 12px !important;
    margin: 0 0 20px !important;
    padding: 0 0 16px !important;
    border-bottom: 1px solid var(--border) !important;
}

.bli-form-section__num {
    flex: 0 0 30px !important;
    width: 30px !important;
    height: 30px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: var(--blue) !important;
    color: #FFFFFF !important;
    border-radius: 50% !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

.bli-form-section__heading {
    margin: 0 !important;
    padding: 0 !important;
}

.bli-form-section__heading h3 {
    margin: 0 !important;
    padding: 0 !important;
    color: var(--navy) !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
}

.bli-form-section__subtitle {
    margin-left: auto !important;
    color: var(--text-muted) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
}

/* fields inside a section: simple vertical stack */
.bli-form-section__body {
    display: flex !important;
    flex-direction: column !important;
    gap: 18px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.bli-form-section__body > .hp-form__field {
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}

/* ---------- Submit button column ---------- */
.bli-form-footer-col {
    max-width: 1100px !important;
    margin: 20px auto 0 !important;
    padding-left: 284px !important; /* 260 sidebar + 24 gap */
    box-sizing: border-box !important;
}

/* ---------- MOBILE (max 767px) ---------- */
@media (max-width: 767px) {

    .hp-template--listing-submit-page .bli-form-layout,
    .hp-template--listing-edit-page .bli-form-layout {
        flex-direction: column !important;
        gap: 14px !important;
    }

    /* sidebar becomes a horizontal scroll strip */
    .bli-form-sidebar {
        flex: none !important;
        position: static !important;
        width: 100% !important;
        padding: 8px !important;
        border-radius: 12px !important;
        overflow: hidden !important;
    }

    .bli-form-sidebar__list {
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        gap: 6px !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: none !important;
    }

    .bli-form-sidebar__list::-webkit-scrollbar {
        display: none !important;
    }

    .bli-form-sidebar__item {
        flex: 0 0 auto !important;
        padding: 8px 12px !important;
        gap: 8px !important;
        font-size: 13px !important;
        white-space: nowrap !important;
    }

    .bli-form-sidebar__icon {
        flex: 0 0 26px !important;
        width: 26px !important;
        height: 26px !important;
        font-size: 11px !important;
    }

    .bli-form-sidebar__desc {
        display: none !important;
    }

    /* section cards */
    .bli-form-sections {
        gap: 14px !important;
    }

    .bli-form-section {
        padding: 16px 14px !important;
        border-radius: 12px !important;
        scroll-margin-top: 90px !important;
    }

    .bli-form-section__header {
        margin-bottom: 14px !important;
        padding-bottom: 12px !important;
    }

    .bli-form-section__heading h3 {
        font-size: 16px !important;
    }

    /* subtitle goes on its own line under the title */
    .bli-form-section__subtitle {
        flex-basis: 100% !important;
        margin-left: 0 !important;
        font-size: 12.5px !important;
    }

    .bli-form-section__body {
        gap: 14px !important;
    }

    .bli-form-footer-col {
        padding-left: 0 !important;
        margin-top: 14px !important;
    }
}

/* ---------- MOBILE: hide the form sidebar nav, sections full width ---------- */
@media (max-width: 767px) {
    .hp-template--listing-submit-page .bli-form-sidebar,
    .hp-template--listing-edit-page .bli-form-sidebar {
        display: none !important;
    }

    .hp-template--listing-submit-page .bli-form-layout,
    .hp-template--listing-edit-page .bli-form-layout {
        display: block !important;
    }

    .hp-template--listing-submit-page .bli-form-sections,
    .hp-template--listing-edit-page .bli-form-sections {
        width: 100% !important;
    }
}

/* =========================================================
   13. ELEMENTOR FOOTER ...
   ========================================================= */
...
.bli-footer .elementor-divider-separator {
    border-top-color: #f2c274 !important;
    border-top-width: 2px !important;
}