/* Estilos para la sección de inmuebles */
.inmuebles-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
}

.inmueble-card {
    box-shadow: 0 4px 8px rgba(0,0,0,0.1), 0 8px 20px rgba(0,0,0,0.15);
    display: flex;
    flex-direction: column;
    overflow: hidden; /* Asegura que el contenido respete el border-radius */
    border-radius: 8px; /* Bordes redondeados para un aspecto más suave */
    
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.5s ease-out, transform 0.5s ease-out, box-shadow 0.3s ease;
}

.inmueble-card.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.inmueble-card:hover {
    transform: translateY(-5px); /* Eleva la tarjeta ligeramente */
    box-shadow: 0 8px 16px rgba(0,0,0,0.2), 0 12px 30px rgba(0,0,0,0.25); /* Sombra más pronunciada */
}



.inmueble-card .card-img-top {
    transition: transform 0.3s ease;
}

/* --- Estilos para Tarjeta de Oferta --- */
.oferta-card {
    display: flex;
    flex-direction: column;
    background-color: #fff !important;
    border: 1px solid #e0e0e0; /* Borde explícito */
    border-radius: 12px; /* All corners rounded */
    overflow: hidden;
    /* box-shadow: 0 4px 8px rgba(0,0,0,0.1), 0 8px 20px rgba(0,0,0,0.15); */ /* Solo sombra */
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    cursor: pointer; /* Añadido para que toda la tarjeta sea clickeable */
}

.oferta-card:hover {
    transform: translateY(-5px);
    /* box-shadow: 0 8px 16px rgba(0,0,0,0.2); */
}

.oferta-card-img {
    width: 100%;
    height: 220px; /* Altura original para ofertas */
    object-fit: cover;
}

.inmuebles-card-img { /* Nueva clase para "Explora nuestros Inmuebles" */
    width: 100%;
    height: 280px; /* Nueva altura para inmuebles */
    object-fit: cover;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.oferta-card-body {
    padding: 15px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.oferta-card-title {
    font-size: 1.4em;
    font-weight: 600;
    margin-top: 0;
    margin-bottom: 10px;
}

.oferta-card-dates {
    font-size: 0.9em;
    color: #666;
    margin-bottom: 10px;
}

.oferta-card-dates i {
    margin-right: 5px;
}

.oferta-card-distancia {
    font-size: 0.9em;
    color: #666;
    margin-bottom: 5px;
}

.oferta-card-distancia i {
    margin-right: 5px;
}

.oferta-card-price {
    font-size: 1.3em;
    font-weight: 700;
    color: #FEA116;
    margin-bottom: 15px;
}

.oferta-card .btn {
    margin-top: auto; /* Pushes button to the bottom */
}

.oferta-card .ver-oferta-btn {
    cursor: pointer !important;
    z-index: 10; /* Valor original */
    position: relative; /* Crea un nuevo contexto de apilamiento */
    display: block; /* Ocupa todo el ancho disponible */
    width: 100%; /* Ocupa todo el ancho disponible */
    transition: background-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease; /* Restaurar transiciones */
}

.oferta-card .ver-oferta-btn:hover,
.oferta-card .ver-oferta-btn:active {
    transform: none !important; /* Desactivar transformaciones en hover/active */
    box-shadow: none !important; /* Desactivar sombra en hover/active */
}

.inmueble-card img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    display: block;
    border-top-left-radius: 8px; /* Bordes superiores redondeados */
    border-top-right-radius: 8px; /* Bordes superiores redondeados */
}


.inmueble-card-content {
    padding: 0 15px; /* Horizontal padding for inset */
    flex-grow: 1; 
}

.inmueble-card h3 {
    color: #2c3e50;
    padding: 15px 0 10px 0; /* Vertical padding */
    margin: 0;
    font-size: 1.5em;
}

.inmueble-card p {
    padding: 0 0 15px 0; /* Vertical padding */
    margin: 0;
    color: #000;
}

/* --- Amenities Preview Styles --- */
.amenities-preview {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 15px 0; /* Vertical padding */
    margin-top: 15px;
    border-top: 1px solid #f0f0f0;
}

.amenity-item {
    display: flex;
    align-items: center;
    gap: 8px;
    background-color: #f8f9fa;
    padding: 5px 10px;
    border-radius: 5px;
    font-size: 0.85em;
    color: #555;
}

.amenity-item i {
    color: #1abc9c; /* Teal color for icons */
}

.inmueble-card-actions {
    margin-top: auto; /* Pushes actions to the very bottom */
    padding: 15px; /* Añadir padding para separar el botón de los bordes */
}

.inmueble-card .precio {
    font-weight: bold;
    color: #1abc9c;
    font-size: 1.2em;
    padding: 15px; /* Adjusted padding */
    cursor: pointer; /* Para indicar que es clickeable */
    border: none; /* Eliminar borde por defecto de botón */
    background: none; /* Eliminar fondo por defecto de botón */
    text-align: left; /* Alinear el texto a la izquierda */
    width: 100%; /* Ocupar todo el ancho disponible */
}

/* Ajuste específico para la imagen de la Cabaña 2 */
#cabana_2 img {
    object-position: center 48%;
}

/* Ajuste específico para la imagen de la Cabaña 3 */
#cabana_3 img {
    object-position: center 55%;
}

/* Ajuste específico para la imagen de la Cabaña 1 */
#cabana_1 img {
    object-position: center 52%;
}

/* Ajuste específico para la imagen del Dúplex 2 */
#duplex_2 img {
    object-position: center 80%;
}

@media (max-width: 768px) {
    .inmuebles-grid {
        grid-template-columns: 1fr;
        padding: 0 15px;
    }

    .ofertas-swiper {
        padding-left: 15px;
        padding-right: 15px;
    }

    .oferta-card-img {
        height: 250px !important; /* Altura original para ofertas en móviles */
    }
    .inmuebles-card-img { /* Nueva clase para "Explora nuestros Inmuebles" en móviles */
        height: 300px !important;
    }
}

/* Fix: Añadir espacio para la paginación del carrusel de ofertas */
.ofertas-swiper {
    padding-bottom: 40px;
}

/* Nuevos estilos para mostrar precios con descuento */
.original-price-tachado {
    color: #e74c3c; /* Rojo de las ofertas especiales */
    text-decoration: line-through;
    font-size: 1em; /* Tamaño de las ofertas especiales */
}

.discount-badge {
    background-color: #27ae60 !important; /* Verde de las ofertas especiales */
    font-size: 1em; /* Tamaño de las ofertas especiales */
    font-weight: 700; /* Negrita de las ofertas especiales */
    padding: 0.3em 0.6em;
    border-radius: 0.25rem;
    white-space: nowrap;
}

.category-price {
    font-size: 1.2em;
    font-weight: normal;
}

.precio-con-descuento {
    color: black;
    font-weight: normal;
    font-size: 1.5em; /* Tamaño de las ofertas especiales */
}

/* Badge de Oferta para Tarjetas de Inmueble en Index */
.oferta-card {
    position: relative; /* Necesario para posicionar el badge de forma absoluta */
    overflow: hidden; /* Asegura que el badge no se salga de los bordes redondeados */
}

.inmueble-card-badge, .oferta-card-badge {
    position: absolute;
    top: 25px;
    left: -55px;
    background-color: #e74c3c; /* Rojo para ofertas calientes */
    color: white;
    padding: 5px 40px;
    font-size: 0.9em;
    font-weight: bold;
    transform: rotate(-45deg) translateZ(0); /* Añadido translateZ(0) */
    z-index: 20;
    box-shadow: 0 2px 5px rgba(0,0,0,0.3);
    text-align: center;
    width: 200px;
}

.inmueble-card-badge i, .oferta-card-badge i {
    margin-right: 5px;
}

/* Estilos para el carrusel de tarjetas de tipo de inmueble */
.tipo-inmueble-swiper-container .swiper-pagination-bullet-active {
    background: #FEA116 !important;
}

.tipo-inmueble-swiper-container .swiper-pagination {
    bottom: 30px !important;
}

/* Nuevas clases para los badges de descuento */
.badge-red {
    background-color: #e74c3c !important; /* Rojo */
}
.badge-green {
    background-color: #28a745 !important; /* Verde */
}
.badge-yellow {
    background-color: #FEA116 !important; /* Naranja */
    color: white !important; /* Letras blancas */
}