@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap');

/* =========================================================
   ACCESSIBLE STAY — HIDE DEFAULT HIVEPRESS LISTING UI
   ========================================================= */

body.accessible-stay .hp-listing__title,
body.accessible-stay .hp-listing__details--primary,
body.accessible-stay .hp-listing__images,
body.accessible-stay .hp-listing__tabs,
body.accessible-stay .hp-listing__attributes,
body.single-hp_listing.accessible-stay .hp-page__sidebar {
    display: none !important;
}

/* Ensure sidebar is VISIBLE on archive/home pages */
body.accessible-stay:not(.single-hp_listing) .hp-page__sidebar {
    display: block !important;
}


/* Keep the HivePress content wrapper,
   but allow our custom layout to control width */

body.accessible-stay .hp-page__content,
body.accessible-stay .hp-content {
    width: 100% !important;
    max-width: 1100px !important;
}


/* Our custom layout should not inherit
   unwanted theme/HivePress column behaviour */

body.accessible-stay #accessible-stay-layout {
    width: 100%;
    display: block;
    clear: both;
}


body.accessible-stay .as-page {
    width: 100%;
    display: block;
}


body.accessible-stay .as-main {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    display: block;
}

/* =========================================================
   HIDE DEFAULT HIVEPRESS LISTING CONTENT
   Keep wrapper and management controls.
   ========================================================= */

/* Default title */
.hp-listing--view-page .hp-listing__title {
    display: none !important;
}

/* Default listing date/category/details */
.hp-listing--view-page .hp-listing__details--primary {
    display: none !important;
}

/* Default HivePress gallery */
.hp-listing--view-page .hp-listing__images {
    display: none !important;
}

/* Old HivePress listing attributes that are duplicated */
.hp-listing__attribute--location,
.hp-listing__attribute--upload-video,
.hp-listing__attributes--secondary,
.hp-page__sidebar .hp-listing__attributes,
.hp-page__sidebar .hp-widget[data-block*="listing_attributes"] {
    display: none !important;
}


/* =========================================================
   PAGE WIDTH
   ========================================================= */

.hp-page__content,
.hp-content {
    width: 100%;
    max-width: 1100px !important;
    margin-left: auto;
    margin-right: auto;
}

.as-page {
    width: 100%;
}

.as-main {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
}


/* =========================================================
   OLD GENERIC SECTION SUPPORT
   ========================================================= */

.as-section {
    width: 100%;
    margin: 0 0 24px;
    padding: 30px;
    background: var(--as-white);
    border: 1px solid var(--as-border-light);
    border-radius: var(--as-radius);
    box-shadow: var(--as-shadow);
}

.as-section-title {
    margin: 0 0 24px;
    color: var(--as-blue);
    font-size: 24px;
    line-height: 1.25;
    font-weight: 700;
}

.as-section-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
}


/* =========================================================
   ACCESSIBLE STAY — HERO SECTION
   STEP 1F — FINAL HERO CSS
   ========================================================= */


/* ---------------------------------------------------------
   HERO WRAPPER
   --------------------------------------------------------- */

.as-hero {
    width: 100%;
    max-width: 900px;
    margin: 0 auto 32px;
    padding: 34px 36px 36px;

    background: #ffffff;

    border: 1px solid #e7eef1;
    border-radius: 22px;

    box-shadow:
        0 10px 35px rgba(20, 50, 70, 0.08);

    box-sizing: border-box;
}


/* ---------------------------------------------------------
   HERO — 1. PROPERTY NAME + PRICE
   --------------------------------------------------------- */

.as-hero-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    gap: 30px;

    width: 100%;
    margin: 0 0 17px;
}


.as-hero-title {
    flex: 1 1 auto;

    min-width: 0;

    margin: 0;
    padding: 0;

    color: #063f5c;

    font-size: 34px;
    line-height: 1.15;

    font-weight: 800;

    letter-spacing: -0.7px;
}


.as-hero-price {
    flex: 0 0 auto;

    display: flex;
    align-items: baseline;

    gap: 5px;

    padding-top: 5px;

    color: #063f5c;

    white-space: nowrap;
}


.as-hero-price strong {
    display: inline-block;

    margin: 0;

    font-size: 25px;
    line-height: 1;

    font-weight: 800;
}


.as-hero-price span {
    display: inline-block;

    color: #6b7c87;

    font-size: 13px;
    line-height: 1.2;

    font-weight: 500;
}


/* ---------------------------------------------------------
   HERO — 2. LOCATION + RATING
   --------------------------------------------------------- */

.as-hero-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 20px;

    width: 100%;

    margin: 0 0 22px;
    padding: 0 0 18px;

    border-bottom: 1px solid #e8eef1;
}


.as-hero-location {
    display: flex;
    align-items: center;

    min-width: 0;

    gap: 9px;

    color: #536773;

    font-size: 14px;
    line-height: 1.4;

    font-weight: 500;
}


.as-location-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 30px;
    height: 30px;

    flex: 0 0 30px;

    border-radius: 50%;

    background: #e9f9f2;

    color: #00b875;

    font-size: 13px;
}


.as-hero-rating {
    display: flex;
    align-items: center;

    gap: 6px;

    flex: 0 0 auto;

    color: #52636e;

    font-size: 13px;
    line-height: 1.4;

    white-space: nowrap;
}


.as-rating-stars {
    color: #f5a623;

    font-size: 16px;

    line-height: 1;

    letter-spacing: 1px;
}


.as-hero-rating strong {
    color: #304957;

    font-weight: 700;
}


.as-rating-count {
    color: #71818b;

    font-weight: 400;
}


/* ---------------------------------------------------------
   HERO — 3. LARGE MAIN IMAGE
   --------------------------------------------------------- */

.as-hero-main-image {
    position: relative;

    width: 100%;
    height: 460px;

    margin: 0 0 12px;

    overflow: hidden;

    border-radius: 18px;

    background: #f1f4f5;
}


.as-hero-main-image img {
    display: block;

    width: 100%;
    height: 100%;

    margin: 0;
    padding: 0;

    object-fit: cover;
    object-position: center;

    border: 0;

    opacity: 1;

    transition:
        opacity 0.2s ease,
        transform 0.25s ease;
}


/* ---------------------------------------------------------
   HERO — 4. THREE THUMBNAILS + VIEW MORE
   --------------------------------------------------------- */

.as-gallery-strip {
    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 12px;

    width: 100%;

    margin: 0 0 28px;
}


.as-gallery-thumb {
    position: relative;

    display: block;

    width: 100%;
    height: 105px;

    min-width: 0;

    margin: 0;
    padding: 0;

    overflow: hidden;

    border: 2px solid transparent;
    border-radius: 13px;

    background: #f2f4f5;

    cursor: pointer;

    appearance: none;
    -webkit-appearance: none;

    box-sizing: border-box;

    transition:
        border-color 0.2s ease,
        transform 0.2s ease,
        box-shadow 0.2s ease;
}


.as-gallery-thumb:hover {
    border-color: #00b875;

    transform: translateY(-2px);

    box-shadow:
        0 7px 18px rgba(20, 60, 70, 0.12);
}


.as-gallery-thumb:focus {
    outline: none;
}


.as-gallery-thumb:focus-visible {
    outline: 3px solid rgba(0, 184, 117, 0.35);
    outline-offset: 2px;
}


.as-gallery-thumb.is-active {
    border-color: #00b875;
}


.as-gallery-thumb img {
    display: block;

    width: 100%;
    height: 100%;

    margin: 0;
    padding: 0;

    object-fit: cover;

    border: 0;

    transition:
        transform 0.25s ease;
}


.as-gallery-thumb:hover img {
    transform: scale(1.04);
}


/* ---------------------------------------------------------
   VIEW MORE OVERLAY
   --------------------------------------------------------- */

.as-gallery-more {
    position: absolute;

    inset: 0;

    z-index: 2;

    display: flex;
    flex-direction: column;

    align-items: center;
    justify-content: center;

    gap: 2px;

    background:
        rgba(5, 32, 45, 0.66);

    color: #ffffff;

    font-size: 20px;
    line-height: 1.2;

    font-weight: 800;

    text-align: center;

    pointer-events: none;
}


.as-gallery-more small {
    display: block;

    margin: 0;

    color: #ffffff;

    font-size: 11px;
    line-height: 1.2;

    font-weight: 600;

    letter-spacing: 0.2px;
}


/* =========================================================
   ACCESSIBLE STAY
   CONTACT INFORMATION
   FINAL VERSION
   ========================================================= */

.as-hero-contact {
    width: 100%;
    margin: 28px 0 0;
    padding-top: 26px;

    border-top: 1px solid #e5e7eb;

    box-sizing: border-box;
}


/* ---------------------------------------------------------
   CONTACT TITLE
   --------------------------------------------------------- */

.as-contact-title {
    margin: 0 0 18px;
    padding: 0;

    color: #073b5c;

    font-size: 22px;
    line-height: 1.3;
    font-weight: 700;

    font-family: 'Poppins', sans-serif;
}


/* ---------------------------------------------------------
   TWO COLUMN LAYOUT

   LEFT:
   Mobile
   WhatsApp

   RIGHT:
   Email
   Website
   --------------------------------------------------------- */

.as-contact-grid {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 1fr);

    gap: 12px;

    width: 100%;
    margin: 0;
    padding: 0;

    box-sizing: border-box;
}


/* ---------------------------------------------------------
   COLUMN
   --------------------------------------------------------- */

.as-contact-column {
    display: flex;

    flex-direction: column;

    gap: 12px;

    min-width: 0;
}


/* ---------------------------------------------------------
   CONTACT CARD
   --------------------------------------------------------- */

.as-contact-card {
    display: flex !important;

    align-items: center !important;

    width: 100% !important;

    min-width: 0 !important;
    min-height: 76px;

    margin: 0 !important;
    padding: 12px 14px !important;

    box-sizing: border-box !important;

    background: #ffffff !important;

    border: 1px solid #dbe5eb !important;
    border-radius: 13px !important;

    text-decoration: none !important;

    float: none !important;
    clear: none !important;

    overflow: hidden;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        transform 0.2s ease;
}


/* ---------------------------------------------------------
   CARD HOVER
   --------------------------------------------------------- */

.as-contact-card:hover {
    border-color: #b9d5e2 !important;

    box-shadow:
        0 5px 16px rgba(0, 60, 80, 0.08);

    transform: translateY(-1px);

    text-decoration: none !important;
}


/* ---------------------------------------------------------
   CARD ICON
   --------------------------------------------------------- */

.as-contact-card-icon {
    display: flex !important;

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

    flex: 0 0 42px !important;

    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;

    margin: 0 12px 0 0 !important;
    padding: 0 !important;

    border-radius: 11px !important;

    box-sizing: border-box !important;

    font-size: 17px;

    line-height: 1;
}


/* ---------------------------------------------------------
   PHONE
   --------------------------------------------------------- */

.as-contact-card-icon.phone {
    background: #edf6fa !important;
    color: #07577a !important;
}


/* ---------------------------------------------------------
   WHATSAPP
   --------------------------------------------------------- */

.as-contact-card-icon.whatsapp {
    background: #e7f9ef !important;
    color: #16a05d !important;
}


/* ---------------------------------------------------------
   EMAIL + WEBSITE
   --------------------------------------------------------- */

.as-contact-card-icon.email,
.as-contact-card-icon.website {
    background: #eaf5ff !important;
    color: #087fc1 !important;
}


/* ---------------------------------------------------------
   ICON
   --------------------------------------------------------- */

.as-contact-card-icon i {
    display: block;

    margin: 0;

    font-size: 17px;
    line-height: 1;
}


/* ---------------------------------------------------------
   CONTENT

   VERY IMPORTANT:
   Label + value stay INSIDE card.
   --------------------------------------------------------- */

.as-contact-card-content {
    display: flex !important;

    flex: 1 1 auto !important;

    flex-direction: column !important;

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

    width: auto !important;

    min-width: 0 !important;
    max-width: 100% !important;

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

    overflow: hidden !important;

    position: static !important;

    float: none !important;
}


/* ---------------------------------------------------------
   LABEL
   --------------------------------------------------------- */

.as-contact-card-label {
    display: block !important;

    width: 100% !important;

    margin: 0 0 4px !important;
    padding: 0 !important;

    color: #7b8b94 !important;

    font-size: 9px !important;
    line-height: 1.2 !important;

    font-weight: 600 !important;

    letter-spacing: 0.7px;

    text-transform: uppercase;

    position: static !important;

    float: none !important;
}


/* ---------------------------------------------------------
   VALUE
   --------------------------------------------------------- */

.as-contact-card-value {
    display: block !important;

    width: 100% !important;

    min-width: 0 !important;
    max-width: 100% !important;

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

    color: #07577a !important;

    font-size: 14px !important;
    line-height: 1.4 !important;

    font-weight: 500 !important;

    white-space: normal !important;

    overflow-wrap: anywhere !important;
    word-break: break-word !important;

    position: static !important;

    float: none !important;

    overflow: hidden !important;
}


/* ---------------------------------------------------------
   LINK RESET
   --------------------------------------------------------- */

.as-contact-card,
.as-contact-card:hover,
.as-contact-card:focus,
.as-contact-card:active,
.as-contact-card:visited {
    text-decoration: none !important;
}


/* ---------------------------------------------------------
   PREVENT THEME FROM MOVING THE CONTENT OUT
   --------------------------------------------------------- */

.as-contact-grid .as-contact-column {
    width: 100% !important;

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

    float: none !important;
}


.as-contact-grid .as-contact-card {
    position: relative !important;
}


.as-contact-grid .as-contact-card-content,
.as-contact-grid .as-contact-card-label,
.as-contact-grid .as-contact-card-value {
    position: static !important;

    float: none !important;

    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 650px) {

    .as-contact-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .as-contact-column {
        gap: 10px;
    }

    .as-contact-card {
        min-height: 68px;

        padding: 10px 12px !important;
    }

    .as-contact-card-icon {
        flex-basis: 40px !important;

        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;

        margin-right: 10px !important;
    }

    .as-contact-card-value {
        font-size: 13px !important;
    }
}


/* =========================================================
   VERY SMALL MOBILE
   ========================================================= */

@media (max-width: 400px) {

    .as-contact-card {
        min-height: 62px;

        padding: 9px 10px !important;
    }

    .as-contact-card-icon {
        flex-basis: 36px !important;

        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;

        margin-right: 9px !important;
    }

    .as-contact-card-label {
        font-size: 8px !important;
    }

    .as-contact-card-value {
        font-size: 12px !important;
    }
}

/* ---------------------------------------------------------
   IMPORTANT:
   Prevent theme styles from breaking Hero
   --------------------------------------------------------- */

.as-hero h1,
.as-hero h2,
.as-hero h3,
.as-hero p {
    font-family: 'Poppins', sans-serif;
}


.as-hero img {
    max-width: none;
}


.as-hero button {
    font-family: 'Poppins', sans-serif;
}


/* ---------------------------------------------------------
   RESPONSIVE — TABLET
   --------------------------------------------------------- */

@media (max-width: 900px) {

    .as-hero {
        padding: 28px 28px 30px;
    }

    .as-hero-title {
        font-size: 30px;
    }

    .as-hero-main-image {
        height: 400px;
    }

    .as-gallery-thumb {
        height: 95px;
    }

}


/* ---------------------------------------------------------
   RESPONSIVE — MOBILE
   --------------------------------------------------------- */

@media (max-width: 650px) {

    .as-hero {
        padding: 22px 18px 25px;

        border-radius: 16px;
    }


    /* TITLE + PRICE */

    .as-hero-heading {
        flex-direction: column;

        gap: 10px;
    }


    .as-hero-title {
        width: 100%;

        font-size: 27px;

        line-height: 1.15;

        letter-spacing: -0.4px;
    }


    .as-hero-price {
        padding-top: 0;
    }


    .as-hero-price strong {
        font-size: 22px;
    }


    /* LOCATION + RATING */

    .as-hero-meta {
        align-items: flex-start;

        flex-direction: column;

        gap: 12px;
    }


    .as-hero-rating {
        white-space: normal;
    }


    /* MAIN IMAGE */

    .as-hero-main-image {
        height: 300px;

        border-radius: 14px;
    }


    /* GALLERY */

    .as-gallery-strip {
        grid-template-columns:
            repeat(4, minmax(0, 1fr));

        gap: 7px;
    }


    .as-gallery-thumb {
        height: 78px;

        border-radius: 9px;
    }


    .as-gallery-more {
        font-size: 16px;
    }


    .as-gallery-more small {
        font-size: 9px;
    }


   .as-contact-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.as-contact-column {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
}

.as-contact-card {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 68px;
    box-sizing: border-box !important;
}


/* ---------------------------------------------------------
   VERY SMALL MOBILE
   --------------------------------------------------------- */

@media (max-width: 400px) {

    .as-hero {
        padding: 18px 14px 22px;
    }


    .as-hero-title {
        font-size: 24px;
    }


    .as-hero-price strong {
        font-size: 20px;
    }


    .as-hero-main-image {
        height: 250px;
    }


    .as-gallery-thumb {
        height: 65px;
    }


    .as-contact-card {
        min-height: 60px;

        padding: 9px 10px;
    }


    .as-contact-card-icon {
        width: 36px;
        height: 36px;

        flex-basis: 36px;
    }


    .as-contact-card-content strong {
        font-size: 12px;
    }

}

/* =========================================================
   VIRTUAL TOUR
   ========================================================= */

.as-video {
    width: 100%;
    margin: 0 0 24px;
    padding: 0;
}

.as-video h2,
.as-video h3,
.as-video .as-section-title {
    margin: 0 0 18px;
    color: #005dff;
    font-size: 23px;
    line-height: 1.25;
    font-weight: 700;
}

.as-video iframe {
    display: block;
    width: 100%;
    height: 500px;
    border: none;
    border-radius: 16px;
}


/* ============================================================
   ACCESSIBLE STAY
   LOCATION SECTION — FINAL
   Address left + Map right
   Hospital left + Walking Time right
   ============================================================ */

.as-location-section {
    width: 100% !important;
    margin: 0 0 30px !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    float: none !important;
    clear: both !important;
}


/* ============================================================
   SECTION TITLE
   ============================================================ */

.as-location-section .as-section-title {
    display: block !important;
    width: 100% !important;
    margin: 0 0 22px !important;
    padding: 0 !important;
}


/* ============================================================
   TOP ROW
   ADDRESS LEFT + MAP RIGHT
   ============================================================ */

.as-location-top {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 18px !important;

    width: 100% !important;
    max-width: 100% !important;

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

    align-items: stretch !important;
    box-sizing: border-box !important;
}


/* ============================================================
   ADDRESS CARD
   ============================================================ */

.as-location-address-card {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;

    width: 100% !important;
    min-width: 0 !important;
    min-height: 230px !important;

    margin: 0 !important;
    padding: 24px !important;

    box-sizing: border-box !important;

    background: #ffffff !important;
    border: 1px solid #dbe5eb !important;
    border-radius: 14px !important;

    float: none !important;
    clear: none !important;
}


/* Address icon */

.as-location-address-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    flex: 0 0 44px !important;

    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;

    margin: 0 14px 0 0 !important;
    padding: 0 !important;

    border-radius: 11px !important;

    background: #edf6fa !important;
    color: #087fb8 !important;

    font-size: 18px !important;
    line-height: 1 !important;

    box-sizing: border-box !important;
}


/* Address content */

.as-location-address-content {
    display: flex !important;
    flex-direction: column !important;

    flex: 1 1 auto !important;

    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;

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

    box-sizing: border-box !important;
}


/* Address label */

.as-location-address-label {
    display: block !important;

    width: 100% !important;

    margin: 0 0 7px !important;
    padding: 0 !important;

    color: #718096 !important;

    font-size: 11px !important;
    line-height: 1.3 !important;

    font-weight: 600 !important;
    letter-spacing: .45px !important;

    text-transform: uppercase !important;
}


/* Address value */

.as-location-address-value {
    display: block !important;

    width: 100% !important;
    max-width: 100% !important;

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

    color: #123f56 !important;

    font-size: 17px !important;
    line-height: 1.55 !important;

    font-weight: 500 !important;

    overflow-wrap: anywhere !important;
    word-break: break-word !important;
}

.as-location-empty {
    color: #718096 !important;
}


/* ============================================================
   MAP CARD
   ============================================================ */

.as-location-map-card {
    display: block !important;

    width: 100% !important;
    min-width: 0 !important;

    height: 230px !important;
    min-height: 230px !important;

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

    overflow: hidden !important;

    box-sizing: border-box !important;

    background: #ffffff !important;
    border: 1px solid #dbe5eb !important;
    border-radius: 14px !important;

    float: none !important;
    clear: none !important;
}


.as-location-map-card iframe {
    display: block !important;

    width: 100% !important;
    height: 230px !important;
    min-height: 230px !important;

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

    border: 0 !important;

    box-sizing: border-box !important;
}


.as-location-map-placeholder {
    display: flex !important;

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

    gap: 9px !important;

    width: 100% !important;
    height: 230px !important;

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

    color: #718096 !important;

    font-size: 14px !important;
}


/* ============================================================
   BOTTOM ROW
   NEAREST HOSPITAL LEFT + WALKING TIME RIGHT
   ============================================================ */

.as-location-info-grid {
    display: grid !important;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 1fr) !important;

    gap: 18px !important;

    width: 100% !important;
    max-width: 100% !important;

    margin: 18px 0 0 !important;
    padding: 0 !important;

    box-sizing: border-box !important;
}


/* ============================================================
   INFORMATION CARD
   ============================================================ */

.as-location-info-card {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;

    width: 100% !important;
    min-width: 0 !important;
    min-height: 112px !important;

    margin: 0 !important;
    padding: 18px 20px !important;

    box-sizing: border-box !important;

    background: #ffffff !important;
    border: 1px solid #dbe5eb !important;
    border-radius: 14px !important;

    box-shadow: none !important;

    float: none !important;
    clear: none !important;

    transition:
        border-color .2s ease,
        box-shadow .2s ease,
        transform .2s ease;
}


.as-location-info-card:hover {
    border-color: #b8d5e2 !important;

    box-shadow:
        0 5px 16px rgba(0, 60, 80, 0.08) !important;

    transform: translateY(-1px) !important;
}


/* ============================================================
   INFORMATION ICON
   ============================================================ */

.as-location-info-icon {
    display: flex !important;

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

    flex: 0 0 46px !important;

    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;

    margin: 0 14px 0 0 !important;
    padding: 0 !important;

    border-radius: 11px !important;

    font-size: 18px !important;
    line-height: 1 !important;

    box-sizing: border-box !important;
}


.as-location-info-icon.hospital {
    background: #edf6fa !important;
    color: #087fb8 !important;
}


.as-location-info-icon.walking {
    background: #e7f9ef !important;
    color: #16a05d !important;
}


.as-location-info-icon i {
    display: block !important;

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

    font-size: 18px !important;
    line-height: 1 !important;
}


/* ============================================================
   INFORMATION CONTENT
   ============================================================ */

.as-location-info-content {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;

    flex: 1 1 auto !important;

    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;

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

    box-sizing: border-box !important;
}


/* ============================================================
   TITLE
   The PHP currently contains emoji in the title.
   Hide the text node visually and recreate clean title text
   so there is only one icon in the card.
   ============================================================ */

.as-location-info-title {
    display: block !important;
    order: 1 !important;

    width: 100% !important;

    margin: 0 0 3px !important;
    padding: 0 !important;

    color: #123f56 !important;

    font-size: 0 !important;
    line-height: 1.35 !important;

    font-weight: 600 !important;

    white-space: normal !important;
}


.as-location-info-card:first-child .as-location-info-title::after {
    content: "Nearest Hospital";
    display: inline !important;

    color: #123f56 !important;

    font-size: 16px !important;
    line-height: 1.35 !important;

    font-weight: 600 !important;
}


.as-location-info-card:last-child .as-location-info-title::after {
    content: "Walking Time";
    display: inline !important;

    color: #123f56 !important;

    font-size: 16px !important;
    line-height: 1.35 !important;

    font-weight: 600 !important;
}


/* ============================================================
   SUBTITLE
   ============================================================ */

.as-location-info-label {
    display: block !important;
    order: 2 !important;

    width: 100% !important;

    margin: 0 0 5px !important;
    padding: 0 !important;

    color: #718096 !important;

    font-size: 11px !important;
    line-height: 1.3 !important;

    font-weight: 600 !important;
    letter-spacing: .3px !important;

    text-transform: uppercase !important;
}


/* ============================================================
   VALUE
   ============================================================ */

.as-location-info-value {
    display: block !important;
    order: 3 !important;

    width: 100% !important;

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

    color: #087fb8 !important;

    font-size: 17px !important;
    line-height: 1.35 !important;

    font-weight: 700 !important;
}


/* ============================================================
   TABLET
   ============================================================ */

@media (max-width: 800px) {

    .as-location-top {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    .as-location-info-grid {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(0, 1fr) !important;

        gap: 12px !important;
    }

}


/* ============================================================
   MOBILE
   ============================================================ */

@media (max-width: 650px) {

    .as-location-top {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .as-location-address-card {
        min-height: 140px !important;
        padding: 18px !important;
    }

    .as-location-map-card {
        height: 210px !important;
        min-height: 210px !important;
    }

    .as-location-map-card iframe {
        height: 210px !important;
        min-height: 210px !important;
    }

    .as-location-map-placeholder {
        height: 210px !important;
    }

    .as-location-info-grid {
        grid-template-columns: 1fr !important;
        gap: 10px !important;

        margin-top: 10px !important;
    }

    .as-location-info-card {
        min-height: 95px !important;
        padding: 16px !important;
    }

    .as-location-info-icon {
        flex-basis: 42px !important;

        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;

        margin-right: 12px !important;
    }

    .as-location-info-title::after {
        font-size: 15px !important;
    }

    .as-location-info-value {
        font-size: 16px !important;
    }

}


/* ============================================================
   VERY SMALL MOBILE
   ============================================================ */

@media (max-width: 400px) {

    .as-location-address-card {
        padding: 15px !important;
    }

    .as-location-address-icon {
        flex-basis: 40px !important;

        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;

        margin-right: 10px !important;
    }

    .as-location-address-value {
        font-size: 15px !important;
    }

    .as-location-info-card {
        min-height: 88px !important;
        padding: 14px !important;
    }

    .as-location-info-icon {
        flex-basis: 40px !important;

        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;

        margin-right: 10px !important;
    }

}
/* =========================================================
   GENERIC CARD BODY
   ========================================================= */

.as-card-body {
    display: flex;
    gap: 40px;
    align-items: stretch;
}

.as-card-left {
    width: 35%;
}

.as-card-right {
    width: 65%;
}

.as-card-right iframe {
    width: 100%;
    height: 350px;
    border: none;
    border-radius: 16px;
}

.as-info-row {
    margin-bottom: 24px;
}

.as-label {
    display: block;
    margin-bottom: 6px;
    color: #6b7280;
    font-size: 13px;
}

.as-value {
    color: #111827;
    font-size: 17px;
    font-weight: 600;
}


/* =========================================================
   ACCESSIBILITY CARD
   ========================================================= */

.as-accessibility {
    width: 100%;
    margin: 0 0 24px;
    padding: 28px 30px;
    background: #fff;
    border: 1px solid var(--as-border-light);
    border-radius: var(--as-radius);
    box-shadow: var(--as-shadow);
}

.as-accessibility > h2,
.as-accessibility > h3,
.as-accessibility .as-section-title {
    margin: 0 0 24px;
    color: #005dff;
    font-size: 21px;
    line-height: 1.25;
    font-weight: 700;
}


/* Accessibility groups */
.as-accessibility .as-feature-group {
    margin: 0 0 25px;
    padding: 0 0 22px;
    border-bottom: 1px solid #edf1f4;
}

.as-accessibility .as-feature-group:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: 0;
}


/* Accessibility heading */
.as-accessibility .as-feature-group h3,
.as-accessibility .as-feature-group h4 {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0 0 12px;
    color: #17384d;
    font-size: 16px;
    line-height: 1.3;
    font-weight: 700;
}


/* Accessibility values */
.as-accessibility ul,
.as-accessibility .as-values,
.as-accessibility .as-feature-values {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.as-accessibility li,
.as-accessibility .as-value {
    display: inline-flex;
    align-items: center;
    margin: 0;
    padding: 7px 12px;
    background: #f3f9ff;
    border: 1px solid #d8eaff;
    border-radius: 18px;
    color: #1769aa;
    font-size: 12px;
    line-height: 1.4;
}

.as-accessibility li::before,
.as-accessibility .as-value::before {
    content: "✓";
    margin-right: 6px;
    color: var(--as-green);
    font-weight: 700;
}


/* =========================================================
   SERVICES & AMENITIES
   ========================================================= */

.as-services {
    width: 100%;
    margin: 0 0 24px;
    padding: 28px 30px;
    background: #fff;
    border: 1px solid var(--as-border-light);
    border-radius: var(--as-radius);
    box-shadow: var(--as-shadow);
}

.as-services > h2,
.as-services > h3,
.as-services .as-section-title {
    margin: 0 0 24px;
    color: #005dff;
    font-size: 21px;
    line-height: 1.25;
    font-weight: 700;
}


/* Service groups */
.as-services .as-service-group {
    margin: 0;
    padding: 17px 0;
    border-bottom: 1px solid #edf1f4;
}

.as-services .as-service-group:first-of-type {
    padding-top: 0;
}

.as-services .as-service-group:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}


/* Service heading */
.as-services .as-service-group h3,
.as-services .as-service-group h4 {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0 0 10px;
    color: #17384d;
    font-size: 16px;
    line-height: 1.3;
    font-weight: 700;
}


/* Service values */
.as-services ul,
.as-services .as-values,
.as-services .as-service-values {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.as-services li,
.as-services .as-value {
    display: inline-flex;
    align-items: center;
    margin: 0;
    padding: 7px 11px;
    background: #f8fafc;
    border: 1px solid #e5ebf0;
    border-radius: 15px;
    color: #4b6270;
    font-size: 12px;
    line-height: 1.4;
}


/* =========================================================
   FALLBACK TEXT FORMATTING
   Prevent values from collapsing into one line.
   ========================================================= */

.as-accessibility p,
.as-services p {
    margin: 0 0 8px;
    color: #687982;
    font-size: 12px;
    line-height: 1.65;
}

.as-accessibility p:last-child,
.as-services p:last-child {
    margin-bottom: 0;
}


/* =========================================================
   GALLERY / OLD UPLOAD GALLERY
   ========================================================= */

.as-gallery-field {
    margin-bottom: 35px;
}

.as-gallery-field h3 {
    margin-bottom: 15px;
    color: var(--as-blue);
    font-size: 22px;
    font-weight: 600;
    font-family: 'Poppins', sans-serif;
}

.as-upload-btn {
    margin-bottom: 18px;
}

.as-gallery {
    display: grid;
    grid-template-columns: repeat(3, minmax(150px, 1fr));
    gap: 18px;
}

.as-gallery img {
    display: block;
    width: 100%;
    height: 180px;
    object-fit: cover;
    border-radius: 12px;
}

.as-thumb {
    overflow: hidden;
    border-radius: 10px;
}


/* =========================================================
   RESPONSIVE — TABLET
   ========================================================= */

@media (max-width: 991px) {

    .hp-page__content,
    .hp-content {
        max-width: 900px !important;
    }

    .as-main {
        max-width: 850px;
    }

    .as-hero {
        padding: 30px;
    }

    .as-hero-main-image {
        height: 430px;
    }

    .as-video iframe {
        height: 380px;
    }

    .as-card-body {
        flex-direction: column;
    }

    .as-card-left,
    .as-card-right {
        width: 100%;
    }

    .as-location-content {
        grid-template-columns: 1fr;
    }

    .as-location-map {
        min-height: 280px;
    }

    .as-gallery {
        grid-template-columns: repeat(2, minmax(150px, 1fr));
    }
}


/* =========================================================
   RESPONSIVE — MOBILE
   ========================================================= */

@media (max-width: 650px) {

    .hp-page__content,
    .hp-content {
        width: 100% !important;
        padding-left: 12px;
        padding-right: 12px;
    }

    .as-main {
        width: 100%;
    }

    .as-hero {
        width: 100%;
        padding: 24px 18px 28px;
        border-radius: 16px;
    }

    .as-hero-heading {
        flex-direction: column;
        gap: 10px;
    }

    .as-hero-title {
        max-width: 100%;
        font-size: 28px;
    }

    .as-hero-price {
        padding-top: 0;
    }

    .as-hero-meta {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
    }

    .as-hero-rating {
        white-space: normal;
    }

    .as-hero-main-image {
        height: 300px;
        border-radius: 14px;
    }

    .as-gallery-strip {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 7px;
    }

    .as-gallery-thumb {
        height: 75px;
        border-radius: 9px;
    }

    .as-gallery-more {
        font-size: 13px;
    }

    .as-gallery-more small {
        font-size: 9px;
    }

    .as-contact-grid {
        grid-template-columns: 1fr;
    }

    .as-location,
    .as-location-card,
    .as-accessibility,
    .as-services,
    .as-section {
        padding: 22px 18px;
        border-radius: 15px;
    }

    .as-video iframe {
        height: 260px;
    }

    .as-video h2,
    .as-video h3,
    .as-video .as-section-title {
        font-size: 20px;
    }

    .as-location h2,
    .as-location h3,
    .as-location-card h2,
    .as-location-card h3,
    .as-accessibility > h2,
    .as-accessibility > h3,
    .as-services > h2,
    .as-services > h3 {
        font-size: 19px;
    }

    .as-accessibility ul,
    .as-accessibility .as-values,
    .as-accessibility .as-feature-values,
    .as-services ul,
    .as-services .as-values,
    .as-services .as-service-values {
        display: block;
    }

    .as-accessibility li,
    .as-accessibility .as-value,
    .as-services li,
    .as-services .as-value {
        display: flex;
        width: 100%;
        margin-bottom: 7px;
    }

    .as-gallery {
        grid-template-columns: repeat(2, minmax(140px, 1fr));
        gap: 12px;
    }

    .as-gallery img {
        height: 150px;
    }
}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 400px) {

    .as-hero {
        padding: 20px 14px 24px;
    }

    .as-hero-title {
        font-size: 24px;
    }

    .as-hero-main-image {
        height: 250px;
    }

    .as-gallery-thumb {
        height: 62px;
    }

    .as-contact-card {
        min-height: 60px;
        padding: 9px;
    }

    .as-contact-icon {
        width: 35px;
        height: 35px;
        min-width: 35px;
    }

    .as-contact-content a {
        font-size: 12px;
    }
}


/* =========================================================
   IMPORTANT: DO NOT ALLOW THEME FLOATS TO BREAK OUR CARDS
   ========================================================= */

.as-hero,
.as-video,
.as-location,
.as-location-card,
.as-accessibility,
.as-services,
.as-section {
    float: none !important;
    clear: both;
}


/* =========================================================
   CONTACT ICON — FONT AWESOME SUPPORT
   ========================================================= */

.as-contact-icon i {
    font-size: 16px;
    line-height: 1;
}

.as-contact-icon.whatsapp i {
    color: #18b866;
}


/* =========================================================
   BUTTON RESET FOR GALLERY
   ========================================================= */

button.as-gallery-thumb {
    appearance: none;
    -webkit-appearance: none;
    font-family: inherit;
    text-align: center;
}


/* =========================================================
   LINK SAFETY
   ========================================================= */

.as-contact-card a {
    text-decoration: none !important;
}

/* =========================================================
   ACCESSIBLE STAY
   CONTACT INFORMATION
   ========================================================= */

.as-hero-contact {
    width: 100%;
    margin: 24px 0 0;
    padding-top: 24px;
    border-top: 1px solid #e5e7eb;
    box-sizing: border-box;
}

.as-contact-title {
    margin: 0 0 16px;
    padding: 0;
    color: #073b5c;
    font-size: 20px;
    line-height: 1.3;
    font-weight: 700;
}

.as-contact-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    width: 100%;
    margin: 0;
    padding: 0;
}

.as-contact-column {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
}

.as-contact-card {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 68px;

    margin: 0 !important;
    padding: 10px 12px !important;

    box-sizing: border-box !important;

    border: 1px solid #dbe5eb !important;
    border-radius: 12px !important;

    background: #ffffff !important;

    text-decoration: none !important;

    float: none !important;
    clear: none !important;

    overflow: hidden;

    transition:
        border-color .2s ease,
        box-shadow .2s ease,
        transform .2s ease;
}

.as-contact-card:hover {
    border-color: #b8d5e2 !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .06);
    transform: translateY(-1px);
}

.as-contact-card:focus,
.as-contact-card:active,
.as-contact-card:visited {
    text-decoration: none !important;
}

.as-contact-card-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    flex: 0 0 40px !important;

    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;

    margin: 0 10px 0 0 !important;
    padding: 0 !important;

    border-radius: 10px !important;

    font-size: 16px;
    line-height: 1;
}

.as-contact-card-icon.phone {
    background: #edf6fa !important;
    color: #07577a !important;
}

.as-contact-card-icon.whatsapp {
    background: #e7f9ef !important;
    color: #16a05d !important;
}

.as-contact-card-icon.email {
    background: #edf6fa !important;
    color: #087fb8 !important;
}

.as-contact-card-icon.website {
    background: #edf6fa !important;
    color: #087fb8 !important;
}

.as-contact-card-content {
    display: flex !important;
    flex-direction: column !important;

    min-width: 0 !important;

    flex: 1 1 auto !important;
}

.as-contact-card-label {
    display: block !important;

    margin: 0 0 3px !important;
    padding: 0 !important;

    color: #718096 !important;

    font-size: 11px !important;
    line-height: 1.2 !important;

    font-weight: 600 !important;

    text-transform: uppercase;
    letter-spacing: .5px;
}

.as-contact-card-value {
    display: block !important;

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

    color: #087fb8 !important;

    font-size: 16px !important;
    line-height: 1.35 !important;

    font-weight: 500 !important;

    overflow-wrap: anywhere;
    word-break: break-word;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 650px) {

    .as-contact-grid {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .as-contact-column {
        gap: 10px !important;
    }

    .as-contact-card {
        min-height: 68px !important;
        width: 100% !important;
    }

}

/* =========================================================


/* =========================================================
   GLOBAL TYPOGRAPHY & FONT STANDARDIZATION (V3 - FINAL REFINEMENT)
   - Standardized font family (Poppins)
   - Consistent Heading & Subheading sizes
   - Increased weight for "Value Texts" (Chips & Content)
   - Refined Subheading style based on user preference
   ========================================================= */

/* 1. Universal Font Family */
body.accessible-stay,
body.accessible-stay *,
#accessible-stay-layout,
#accessible-stay-layout *,
.as-page,
.as-page *,
.as-main,
.as-main * {
    font-family: 'Poppins', sans-serif !important;
}

/* 2. Main Section Headings (e.g., "Services & Amenities", "Accessibility Features") */
.as-section-title,
.as-hero-title,
.as-page h1,
.as-page h2 {
    font-size: 28px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    color: #063f5c !important;
    margin-bottom: 24px !important;
    letter-spacing: -0.5px !important;
}

/* 3. Card Titles / Section Sub-headings (e.g., "On-site Support", "Bathroom", "Grab Bars") */
.as-acc-block-title,
.as-svc-card-title,
.as-contact-title,
.as-hero-contact .as-contact-title,
.as-page h3 {
    font-size: 20px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
    color: #1e293b !important;
}

/* 4. Labels & Small Subtitles (The "BAR PLACEMENT" style from Screenshot 1) */
.as-acc-subtitle,
.as-acc-photo-label,
.as-contact-card-label,
.as-hero-location,
.as-hero-rating,
.as-section-subtitle,
.as-page h4,
.as-page h5 {
    font-size: 12px !important;
    line-height: 1.4 !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    color: #64748b !important;
    margin-bottom: 8px !important;
    display: block !important;
}

/* 5. Value Texts & Chip Content (Increased Weightage to 700) */
.as-acc-chip,
.as-svc-chip,
.as-contact-card-value,
.as-hero-price strong,
.as-page p,
.as-page li,
.as-page span:not([class*="icon"]):not([class*="badge"]):not([class*="star"]):not([class*="label"]):not([class*="count"]):not([class*="currency"]) {
    font-size: 16px !important;
    line-height: 1.6 !important;
    font-weight: 700 !important; /* Increased from 500 to 700 */
    color: #1e293b !important; /* Darker for better contrast */
}

/* Adjusting chip padding for the larger text */
.as-acc-chip, .as-svc-chip {
    padding: 8px 18px !important;
    border-radius: 999px !important;
}

/* Adjusting icon sizes to match larger text */
.as-acc-block-icon, .as-svc-icon {
    width: 52px !important;
    height: 52px !important;
    font-size: 1.5rem !important;
    border-radius: 14px !important;
}

/* Ensuring checkmarks are also bold */
.as-acc-chip-check, .as-svc-chip-check {
    font-weight: 900 !important;
    margin-right: 4px !important;
}


/* =========================================================
   BULLETPROOF GALLERY UI (FORCE 5-COLUMN HORIZONTAL)
   Targeting elements directly to bypass theme/body-class issues.
   ========================================================= */

.as-gallery-preview {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    width: 100% !important;
    margin: 15px 0 !important;
    padding: 0 !important;
    clear: both !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
}

.as-thumb {
    flex: 0 0 calc(20% - 10px) !important;
    width: calc(20% - 10px) !important;
    max-width: calc(20% - 10px) !important;
    min-width: 80px !important;
    aspect-ratio: 1 / 1 !important;
    position: relative !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    border: 2px solid #e2e8f0 !important;
    background: #f8fafc !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05) !important;
    display: block !important;
    float: none !important;
}

.as-thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    margin: 0 !important;
}

.as-remove-thumb {
    position: absolute !important;
    top: 5px !important;
    right: 5px !important;
    width: 22px !important;
    height: 22px !important;
    background: rgba(239, 68, 68, 0.9) !important;
    color: white !important;
    border: none !important;
    border-radius: 50% !important;
    font-size: 14px !important;
    line-height: 22px !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    z-index: 999 !important;
}

.as-set-main-btn {
    position: absolute !important;
    bottom: 5px !important;
    right: 5px !important;
    width: 26px !important;
    height: 26px !important;
    background: rgba(255, 255, 255, 0.9) !important;
    color: #94a3b8 !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 5px !important;
    font-size: 16px !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    z-index: 999 !important;
}

.as-set-main-btn.is-main {
    background: #f59e0b !important;
    color: white !important;
    border-color: #d97706 !important;
}

.as-thumb:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1) !important;
}

/* Mobile Adjustments */
@media (max-width: 600px) {
    .as-thumb {
        flex: 0 0 calc(33.33% - 10px) !important;
        width: calc(33.33% - 10px) !important;
    }
}

/* =========================================================
   HOME PAGE (ARCHIVE) REDESIGN
   - Left Sidebar Filter
   - 2-Column Listing Grid on Right
   ========================================================= */

/* 1. Main Layout Container - Force Flexbox */
body.accessible-stay:not(.single-hp_listing) .hp-page__container,
body.accessible-stay:not(.single-hp_listing) .hp-row {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 30px !important;
    max-width: 1300px !important;
    margin: 0 auto !important;
    padding: 20px !important;
}

/* 2. Left Sidebar (Filter) - Fix Width */
body.accessible-stay:not(.single-hp_listing) .hp-page__sidebar,
body.accessible-stay:not(.single-hp_listing) .hp-col-lg-3,
body.accessible-stay:not(.single-hp_listing) .hp-col-md-4 {
    flex: 0 0 320px !important;
    width: 320px !important;
    max-width: 320px !important;
    display: block !important;
    position: sticky !important;
    top: 20px !important;
}

/* 3. Right Content (Listings) - Grow to fill space */
body.accessible-stay:not(.single-hp_listing) .hp-page__content,
body.accessible-stay:not(.single-hp_listing) .hp-col-lg-9,
body.accessible-stay:not(.single-hp_listing) .hp-col-md-8 {
    flex: 1 !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: none !important;
}

/* 4. Two-Column Listing Grid */
body.accessible-stay:not(.single-hp_listing) .hp-listings,
body.accessible-stay:not(.single-hp_listing) .hp-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 25px !important;
}

/* 5. Clean up Filter Form Styling */
.hp-form--listing-filter,
.hp-widget--listing-filter {
    background: #fff !important;
    padding: 25px !important;
    border-radius: 16px !important;
    border: 1px solid #e5eeff !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05) !important;
    margin-bottom: 20px !important;
}

.hp-form--listing-filter label {
    font-size: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    color: #64748b !important;
    margin-bottom: 6px !important;
    display: block !important;
}

.hp-form--listing-filter input,
.hp-form--listing-filter select {
    width: 100% !important;
    border-radius: 8px !important;
    border: 1.5px solid #e2e8f0 !important;
    padding: 10px 12px !important;
    font-size: 14px !important;
}

.hp-form--listing-filter .hp-form__button {
    width: 100% !important;
    background: #00b875 !important;
    color: #fff !important;
    border-radius: 8px !important;
    padding: 12px !important;
    font-weight: 700 !important;
    border: none !important;
    margin-top: 10px !important;
}

/* 6. Archive Card Styling */
.hp-listing--view-block {
    background: #fff !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    border: 1px solid #e5eeff !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    margin-bottom: 0 !important;
}

.hp-listing--view-block:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 8px 25px rgba(59, 130, 246, 0.12) !important;
}

.hp-listing--view-block .hp-listing__image {
    aspect-ratio: 4 / 3 !important;
    width: 100% !important;
    height: auto !important;
}

.hp-listing--view-block .hp-listing__image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

.hp-listing--view-block .hp-listing__content {
    padding: 20px !important;
    display: flex !important;
    flex-direction: column !important;
    flex-grow: 1 !important;
}

.hp-listing--view-block .hp-listing__title {
    font-size: 18px !important;
    font-weight: 700 !important;
    margin-bottom: 10px !important;
    color: #063f5c !important;
}

.as-archive-price {
    margin-top: auto !important;
    padding-top: 15px !important;
    border-top: 1px solid #f1f5f9 !important;
    display: flex !important;
    align-items: baseline !important;
    gap: 6px !important;
}

.as-archive-price strong {
    font-size: 20px !important;
    color: #063f5c !important;
    font-weight: 800 !important;
}

.as-archive-price span {
    font-size: 11px !important;
    color: #64748b !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
}

.as-placeholder-img {
    width: 100%;
    aspect-ratio: 4 / 3;
    background: #f1f5f9;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #cbd5e1;
    font-size: 40px;
}

/* Mobile Responsive */
@media (max-width: 992px) {
    body.accessible-stay:not(.single-hp_listing) .hp-page__container,
    body.accessible-stay:not(.single-hp_listing) .hp-row {
        flex-direction: column !important;
    }
    
    body.accessible-stay:not(.single-hp_listing) .hp-page__sidebar,
    body.accessible-stay:not(.single-hp_listing) .hp-col-lg-3 {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        position: static !important;
    }
}

@media (max-width: 640px) {
    body.accessible-stay:not(.single-hp_listing) .hp-listings,
    body.accessible-stay:not(.single-hp_listing) .hp-grid {
        grid-template-columns: 1fr !important;
    }
}

/* =========================================================
   FORCE 2-COLUMN GRID & BREAK NARROW CONTAINERS
   ========================================================= */

/* Break out of narrow theme containers */
body .hp-page__container, 
body .hp-row, 
body .hp-content,
body .container, 
body #content {
    max-width: 98% !important;
    width: 1400px !important;
    margin: 0 auto !important;
    display: block !important;
}

/* Force the 2-column main structure (Sidebar | Content) */
body .hp-page__container, 
body .hp-row:has(.hp-page__sidebar),
body .hp-row:has([class*="hp-col-"]) {
    display: grid !important;
    grid-template-columns: 320px 1fr !important;
    gap: 40px !important;
    align-items: flex-start !important;
}

/* Pin Sidebar to Column 1 */
body .hp-page__sidebar, 
body [class*="hp-col-lg-3"], 
body [class*="hp-col-md-4"] {
    grid-column: 1 !important;
    width: 320px !important;
    max-width: 320px !important;
    min-width: 320px !important;
    display: block !important;
    position: sticky !important;
    top: 20px !important;
}

/* Pin Content to Column 2 */
body .hp-page__content, 
body [class*="hp-col-lg-9"], 
body [class*="hp-col-md-8"] {
    grid-column: 2 !important;
    width: 100% !important;
    max-width: none !important;
}

/* Force Listing Grid (Strict 2 Columns) */
body .hp-listings, 
body .hp-grid, 
body .hp-row.hp-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 30px !important;
    width: 100% !important;
}

/* Stop cards from being narrow */
body .hp-listings > *, 
body .hp-grid > *, 
body [class*="hp-col-"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    padding: 0 !important;
}

/* =========================================================
   GALLERY UI FIX (HORIZONTAL & VISIBLE)
   ========================================================= */

.as-gallery-preview {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 15px !important;
    padding: 20px 0 !important;
    width: 100% !important;
}

.as-thumb {
    position: relative !important;
    width: 120px !important;
    height: 120px !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    border: 2px solid #eef2f6 !important;
    background: #f8fafc !important;
    flex-shrink: 0 !important;
}

.as-thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.as-set-main-btn {
    position: absolute !important;
    top: 5px !important;
    left: 5px !important;
    width: 28px !important;
    height: 28px !important;
    background: rgba(255, 255, 255, 0.9) !important;
    border-radius: 6px !important;
    z-index: 10 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.as-set-main-btn.is-main {
    background: #f5a623 !important;
    color: #fff !important;
}

.as-remove-thumb {
    position: absolute !important;
    top: 5px !important;
    right: 5px !important;
    width: 28px !important;
    height: 28px !important;
    background: rgba(239, 68, 68, 0.9) !important;
    color: #fff !important;
    border-radius: 6px !important;
    z-index: 10 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* =========================================================
   GALLERY UI FIX (SUBMISSION FORM)
   ========================================================= */

.as-gallery-field {
    margin-bottom: 30px !important;
    padding: 25px !important;
    background: #fff !important;
    border-radius: 16px !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05) !important;
}

.as-gallery-preview {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 15px !important;
    margin-top: 20px !important;
    min-height: 120px !important;
    width: 100% !important;
    clear: both !important;
}

.as-thumb {
    position: relative !important;
    width: 120px !important;
    height: 120px !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    border: 2px solid #edf2f7 !important;
    background: #f7fafc !important;
    flex-shrink: 0 !important;
    display: block !important;
}

.as-thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

.as-set-main-btn {
    position: absolute !important;
    top: 8px !important;
    left: 8px !important;
    width: 30px !important;
    height: 30px !important;
    background: rgba(255,255,255,0.95) !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 6px !important;
    color: #94a3b8 !important;
    cursor: pointer !important;
    z-index: 10 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    font-size: 16px !important;
}

.as-set-main-btn.is-main {
    background: #f59e0b !important;
    color: #fff !important;
    border-color: #d97706 !important;
}

.as-remove-thumb {
    position: absolute !important;
    top: 8px !important;
    right: 8px !important;
    width: 30px !important;
    height: 30px !important;
    background: rgba(239,68,68,0.95) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    z-index: 10 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    font-size: 20px !important;
}

.as-upload-btn {
    margin-bottom: 10px !important;
}