/**
 * Unified Property Card Styles
 * Ensures consistent styling across all plugins: ps-idx-search, near-properties, etc.
 */

/* Base card container - applies to all property card variants */
.propertyCard,
.property3Card,
.near-property-card,
.property-card {
    width: 100%;
    min-width: 0;
    height: 425px;
    position: relative;
   /* padding-bottom: 10px;*/
}

/* Animation for newly loaded property cards */
@keyframes fadeInSlideUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.propertyCard.ps-idx-newly-loaded,
.property3Card.ps-idx-newly-loaded,
.near-property-card.ps-idx-newly-loaded,
.property-card.ps-idx-newly-loaded {
    animation: fadeInSlideUp 0.6s ease-out forwards;
    opacity: 0; /* Start invisible for animation */
}

/* Force base font-size for favorite cards to match others */
.ps-crm-favorite-card,
.ps-crm-favorite-card .propertyCard,
.ps-crm-favorite-card .ListingCard,
.ps-crm-favorite-card .ListingCard a {
    font-size: 16px !important;
}

/* Inner card wrapper */
.ListingCard {
    width: 100%;
    height: 100%;
    text-align: center;
    transition: transform 0.6s;
    transform-style: preserve-3d;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
}

.propertyCard:hover .ListingCard,
.property3Card:hover .ListingCard,
.near-property-card:hover,
.property-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.25);
}

/* Card links */
.ListingCard a,
.ListingCard a:hover,
.ListingCard a:visited,
.near-property-card a,
.property-card a {
    text-decoration: none;
    color: inherit;
}

/* Image container - unified height */
.ListingImg,
.property-image,
.property-card .property-image {
    height: 260px;
    overflow: hidden;
}

.ListingImg img,
.property-image img,
.property-card .property-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.propertyCard:hover .ListingImg img,
.property3Card:hover .ListingImg img,
.near-property-card:hover .property-image img,
.property-card:hover .property-image img {
    transform: scale(1.02);
}

/* Town/City/Location - unified typography */
.ListingTown,
.nearby-property-location,
.property-card .property-location,
.near-property-card .property-info p.nearby-property-location,
.propertyCard .ListingTown,
.property3Card .ListingTown,
.near-property-card .ListingTown,
.ps-crm-favorite-card .ListingTown {
    letter-spacing: 0.3em;
    font-size: 1.125em !important;
    font-family: 'Cinzel', serif;
    color: #152d4d;
    line-height: 1.56;
}

/* Address - unified typography */
.ListingAddress,
.nearby-property-address,
.property-card .property-address,
.property-info h3,
.near-property-card .property-info h3.nearby-property-address,
.propertyCard .ListingAddress,
.property3Card .ListingAddress,
.near-property-card .ListingAddress,
.ps-crm-favorite-card .ListingAddress {
    letter-spacing: 0.2em;
    font-size: 0.75em !important;
    font-family: 'Cinzel', serif;
    line-height: 1.67;
}

/* Price - unified typography */
.ListingPrice,
.meta-price,
.property-price,
.property-card .property-price,
.near-property-card .meta-price,
.propertyCard .ListingPrice,
.property3Card .ListingPrice,
.near-property-card .ListingPrice,
.ps-crm-favorite-card .ListingPrice {
    letter-spacing: 0.5em;
    font-size: 0.9em !important;
    font-weight: 500;
    font-family: 'Lato', sans-serif;
    line-height: 1.71;
}

/* MLS - unified typography */
.ListingMls,
.meta-mls,
.property-mls,
.property-card .property-mls,
.near-property-card .meta-mls {
    letter-spacing: 0.2em;
    font-size: 1em;
    font-family: 'Lato', sans-serif;
    line-height: 1.5;
}

/* Specs/Meta - unified typography */
.ListingSpecs,
.property-meta,
.property-card .property-meta,
.propertyCard .ListingSpecs,
.property3Card .ListingSpecs,
.near-property-card .ListingSpecs,
.ps-crm-favorite-card .ListingSpecs {
    letter-spacing: 0.1em;
    font-size: 0.8em !important;
    font-family: 'Lato', sans-serif;
    line-height: 1.54;
}

/* Status - unified typography */
.listingStatus,
.meta-status,
.property-status,
.property-card .property-status,
.near-property-card .meta-status,
.propertyCard .listingStatus,
.property3Card .listingStatus,
.near-property-card .listingStatus,
.ps-crm-favorite-card .listingStatus {
    font-size: 0.8em !important;
    font-weight: 700;
    font-family: 'Lato', sans-serif;
    color: #152d4d;
    text-align: center;
    margin-top: 10px;
    line-height: 1.54;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.listingStatus .status-favorited {
    text-align: left;
    flex: 1;
    padding-left: 8px;
}

.listingStatus .ps-crm-card-favorite-btn {
    background: none;
    border: none;
    padding: 8px;
    cursor: pointer;
    color: #152d4d;
    font-size: 1em;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    min-height: 36px;
    transition: transform 0.2s ease;
    position: relative;
    z-index: 100;
    pointer-events: auto;
    text-decoration: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Prevent link navigation when clicking the button */
.listingStatus .status-favorited {
    pointer-events: auto;
    position: relative;
    z-index: 100;
    display: inline-block;
}

.ListingCard > a {
    position: relative;
}

.ListingCard > a .listingStatus .status-favorited {
    pointer-events: auto;
    z-index: 100;
}

/* Ensure the button area blocks parent link clicks */
.ListingCard > a .listingStatus .status-favorited .ps-crm-card-favorite-btn {
    position: relative;
    z-index: 100;
    pointer-events: auto;
}

.listingStatus .ps-crm-card-favorite-btn:hover {
    transform: scale(1.15);
}

.listingStatus .ps-crm-card-favorite-btn i.fa-heart {
    font-size: 1.3em;
    display: inline-block;
}

.listingStatus .ps-crm-card-favorite-btn .fas.fa-heart {
    color: #d63638;
}

.listingStatus .ps-crm-card-favorite-btn .far.fa-heart {
    color: #152d4d;
}

.listingStatus .status-text {
    text-align: center;
    flex: 1;
}

.listingStatus .status-distance {
    text-align: right;
    flex: 1;
    padding-right: 8px;
}

/* Force base font-size for favorite cards to normalize em calculations */
.ps-crm-favorite-card,
.ps-crm-favorite-card .propertyCard,
.ps-crm-favorite-card .ListingCard,
.ps-crm-favorite-card .ListingCard a {
    font-size: 16px !important;
}

/* Near Properties specific adjustments to match unified style */
.near-property-card {
    background: white;
    border-radius: 0;
    overflow: hidden;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
    border: none;
}

.near-property-card .property-info {
    text-align: center;
}

.near-property-card .property-meta {
    display: block;
    font-size: 0.8em;
    font-family: 'Lato', sans-serif;
    letter-spacing: 0.1em;
}

.near-property-card .property-meta span {
    display: block;
    background: transparent;
    color: inherit;
    padding: 0;
    border-radius: 0;
    font-weight: inherit;
    text-transform: none;
}

.near-property-card .meta-price {
    line-height: 1.71;
}

.near-property-card .meta-mls {
    line-height: 1.5;
}

.near-property-card .meta-status {
    line-height: 1.54;
}

.near-property-card .meta-price {
    font-size: 0.9em;
    letter-spacing: 0.5em;
    font-weight: 500;
}

.near-property-card .meta-mls {
    font-size: 1em;
    letter-spacing: 0.2em;
}

.near-property-card .meta-status {
    font-size: 0.8em;
    font-weight: 700;
    color: #152d4d;
    text-align: center;
    margin-top: 10px;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .propertyCard,
    .property3Card,
    .near-property-card,
    .property-card {
        height: auto;
        min-height: 425px;
    }
    
    .ListingImg,
    .property-image {
        height: 240px;
    }
}

@media (max-width: 480px) {
    .ListingImg,
    .property-image {
        height: 200px;
    }
    
    .ListingTown,
    .nearby-property-location {
        font-size: 1em;
    }
    
    .ListingAddress,
    .nearby-property-address {
        font-size: 0.7em;
    }
    
    .ListingPrice,
    .meta-price {
        font-size: 0.85em;
    }
}