/* ============================================================
   Property Cards — Shared across all themes
   Works with BS3 (app, layout_2) and BS5 (layout_1)
   ============================================================ */

/* --- Grid: flexbox row, equal-height columns --- */
.row.g-4,
.row.gx-4.gy-4,
ul.aa-properties-nav.row {
    display: flex !important;
    flex-wrap: wrap !important;
    margin-left: -12px !important;
    margin-right: -12px !important;
    padding-left: 0 !important;
    list-style: none !important;
}
/* Remove BS3 clearfix pseudo-elements that break flexbox */
.row.g-4::before, .row.g-4::after,
.row.gx-4.gy-4::before, .row.gx-4.gy-4::after,
ul.aa-properties-nav.row::before, ul.aa-properties-nav.row::after {
    display: none !important;
}
.row.g-4 > [class*="col-"],
.row.gx-4.gy-4 > [class*="col-"],
.row.gx-4.gy-4 > li[class*="col-"],
ul.aa-properties-nav > li[class*="col-"] {
    float: none !important;
    padding: 0 12px !important;
    margin-bottom: 24px !important;
    margin-left: 0 !important;
    list-style: none !important;
}

/*
   Override old #aa-properties ID-scoped rules from style.css:
     #aa-properties ... .aa-properties-nav { margin-left: -30px }
     #aa-properties ... .aa-properties-nav li { width: 45.1%; margin: 0 0 20px 30px }
     .aa-properties-item { max-height: 435px; display: inline }
   These have high specificity due to the #id selector.
*/
#aa-properties .aa-properties-content .aa-properties-content-body .aa-properties-nav {
    display: flex !important;
    flex-wrap: wrap !important;
    margin-left: -12px !important;
    margin-right: -12px !important;
    padding-left: 0 !important;
    list-style: none !important;
}
#aa-properties .aa-properties-content .aa-properties-content-body .aa-properties-nav::before,
#aa-properties .aa-properties-content .aa-properties-content-body .aa-properties-nav::after {
    display: none !important;
}
#aa-properties .aa-properties-content .aa-properties-content-body .aa-properties-nav li {
    float: none !important;
    width: 50% !important;
    margin: 0 0 24px 0 !important;
    padding: 0 12px !important;
    list-style: none !important;
}


/* ==========================================================
   PROPERTY-ITEM CARD (landing-page template)
   ========================================================== */

.property-item {
    width: 100%;
    height: 100%;
    border-radius: 10px;
    box-shadow: 0 2px 16px rgba(0, 0, 0, 0.07);
    background: #fff;
    transition: box-shadow 0.3s ease, transform 0.3s ease;
}
.property-item:hover {
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.13);
    transform: translateY(-4px);
}

/* Image */
.property-item > .position-relative {
    position: relative !important;
    overflow: hidden !important;
    background: #f0f1f3;
    border-radius: 10px 10px 0 0;
}
.property-item > .position-relative img {
    width: 100% !important;
    display: block !important;
    transition: transform 0.5s ease;
}
.property-item:hover > .position-relative img {
    transform: scale(1.05);
}

/* Badges — BS3 doesn't have position-absolute, start-0, top-0 */
.property-item > .position-relative .btn-custom-primary {
    position: absolute !important;
    z-index: 2;
}
.property-item > .position-relative .start-0.top-0 {
    left: 0 !important; top: 0 !important;
}
.property-item > .position-relative .start-0.bottom-0 {
    left: 0 !important; bottom: 0 !important; position: absolute !important;
}

/* Content — BS3 doesn't have p-4, pb-0 */
.property-item > .p-4 {
    padding: 20px 22px 16px !important;
}

/* Address row */
.property-item > .p-4 > .mt-3 {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}
.property-item > .p-4 > .mt-3 p {
    margin-bottom: 0;
}

/* Specs footer — BS3 doesn't have d-flex, border-top, flex-fill, border-end */
.property-item > .d-flex {
    display: flex !important;
    border-top: 1px solid #eee !important;
    border-radius: 0 0 10px 10px;
    background: #fff;
}
.property-item > .d-flex > small {
    flex: 1 !important;
    text-align: center !important;
    padding: 10px 0 !important;
    font-size: 13px;
    color: #666;
}
.property-item > .d-flex > small:not(:last-child) {
    border-right: 1px solid #eee !important;
}


/* ==========================================================
   AA-PROPERTIES-ITEM CARD (search page template)
   ========================================================== */

/* Override old .aa-properties-item { max-height:435px; display:inline } */
.aa-properties-item {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-height: none !important;
    float: none !important;
    margin-top: 0 !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    background: #fff;
    box-shadow: 0 2px 16px rgba(0, 0, 0, 0.07) !important;
    transition: box-shadow 0.3s ease, transform 0.3s ease;
}
.aa-properties-item:hover {
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.13) !important;
    transform: translateY(-4px);
}

/* Image */
.aa-properties-item .aa-properties-item-img {
    display: block !important;
    width: 100% !important;
    overflow: hidden !important;
    background: #f0f1f3;
}
.aa-properties-item .aa-properties-item-img img {
    width: 100% !important;
    display: block !important;
}
.aa-properties-item:hover .aa-properties-item-img img {
    transform: scale(1.05);
    transition: transform 0.5s ease;
}

/* Content — p-3, d-flex, flex-column, justify-content-between, h-100 don't exist in BS3 */
.aa-properties-item .aa-properties-item-content {
    float: none !important;
    width: 100% !important;
    border: none !important;
    padding: 15px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    height: auto !important;
}
.aa-properties-item .aa-properties-item-content .aa-properties-info {
    float: none !important;
    display: flex !important;
    width: 100% !important;
    border-bottom: 1px solid #eee !important;
    padding-bottom: 10px;
    margin-bottom: 10px;
}
.aa-properties-item .aa-properties-item-content .aa-properties-about {
    float: none !important;
    width: 100% !important;
}
.aa-properties-item .aa-properties-item-content .aa-properties-about h5 a {
    color: #333;
    text-decoration: none;
}
.aa-properties-item .aa-properties-item-content .aa-properties-about h5 a:hover {
    color: var(--secondary, #daa520);
}
.aa-properties-item .aa-properties-item-content .aa-properties-detial {
    float: none !important;
    width: 100% !important;
    border-top: 1px solid #eee !important;
    padding-top: 12px;
}
.aa-properties-item .aa-properties-item-content .aa-properties-detial a {
    float: none !important;
}

/* Tag badge — fix old absolute positioning */
.aa-properties-item .aa-tag {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    border-radius: 0 !important;
    display: inline-block;
}

/* Detail footer — price, sqft, More, Share */
.aa-properties-item .aa-properties-detial > div {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
}
.aa-properties-item .aa-properties-detial > div > span {
    margin-right: 10px;
    margin-bottom: 4px;
}
.aa-properties-item .aa-properties-detial > div > span:first-child {
    font-weight: 700;
}
.aa-properties-item .aa-properties-detial > div > a {
    margin-bottom: 4px;
    margin-right: 4px;
}
.aa-properties-item .aa-properties-detial > div > a:first-of-type {
    margin-left: auto;
}

@media (max-width: 575px) {
    .row.g-4 > [class*="col-"],
    .row.gx-4.gy-4 > [class*="col-"],
    .row.gx-4.gy-4 > li[class*="col-"],
    ul.aa-properties-nav > li[class*="col-"],
    #aa-properties .aa-properties-content .aa-properties-content-body .aa-properties-nav li {
        margin-bottom: 16px !important;
    }
}
