/* Property Card Features Section Styling */
.property-meta {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    grid-template-rows: 1fr 1fr !important;
    gap: 8px !important;
}

.meta-item {
    display: flex;
    align-items: center;
    color: #666;
    margin-bottom: 5px;
}

.meta-item i {
    margin-right: 5px;
    color: #E03103;
}

/* Default layout */
.property-meta .meta-item {
    flex: 0 0 auto;
    margin-right: 15px;
}

/* Property card feature icons - the ones shown in the screenshot */
.property-card-meta {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 15px;
}

.property-card-meta-item {
    display: flex;
    align-items: center;
    margin-right: 10px;
}

/* Direct targeting of the elements in the screenshot */
.property-card [class*="Bd"],
.property-card [class*="Ba"],
.property-card [class*="sqft"],
.property-card [class*="Acres"] {
    display: flex;
    align-items: center;
}

/* Responsive layout for screens 1300px and below */
@media (max-width: 1300px) {
    .property-meta,
    .property-card-meta {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 1fr 1fr;
        gap: 8px;
    }
    
    .property-meta .meta-item,
    .property-card-meta .property-card-meta-item {
        margin-right: 0;
        flex: 1;
    }
    
    /* Target the specific layout shown in the screenshot */
    .property-card .bd-ba-sqft-acres,
    div[style*="grid-template-columns"] {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        grid-template-rows: 1fr 1fr !important;
        gap: 5px !important;
    }
    
    /* Directly target the elements in the screenshot */
    body .property-card [class*="Bd"],
    body .property-card [class*="Ba"],
    body .property-card [class*="sqft"],
    body .property-card [class*="Acres"],
    body [class*="Bd"],
    body [class*="Ba"],
    body [class*="sqft"],
    body [class*="Acres"] {
        display: flex !important;
        flex: 1 !important;
    }
    
    /* Ultra-specific selector targeting */
    @media (max-width: 1300px) {
        body div.property-card > div,
        body div[style*="display: grid"],
        body div[style*="display:grid"] {
            display: grid !important;
            grid-template-columns: 1fr 1fr !important;
            grid-template-rows: auto auto !important;
            gap: 8px !important;
        }
    }
}