/* ==========================================================
   DISCRETAX
   Ajuste vista compacta + imagen listado horizontal PC
   ========================================================== */

/* ==========================================================
   1) Precio/Pregúntame en tarjetas compactas
   ========================================================== */

.home-compact-card__price {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    max-width: 100% !important;

    font-size: .95rem !important;
    line-height: 1.1 !important;
    font-weight: 900 !important;
    letter-spacing: -0.015em !important;

    color: #74306c !important;
    margin: .35rem 0 .25rem 0 !important;
}

/* Si Pregúntame sigue entrando justo, en PC lo hacemos un poco menor */
@media (min-width: 992px) {
    .home-compact-card__price {
        font-size: .88rem !important;
    }
}

/* En móvil se mantiene legible */
@media (max-width: 575.98px) {
    .home-compact-card__price {
        font-size: .86rem !important;
    }
}

/* ==========================================================
   2) Imagen de vista listado: rellenar hueco vertical en PC
   ========================================================== */

/*
   Esta regla afecta a la vista horizontal/listado donde aparece:
   .dx-list-card__media-shell
*/

@media (min-width: 768px) {
    .dx-list-card__media-shell {
        height: 100% !important;
        min-height: 100% !important;
        overflow: hidden !important;
        border-radius: 14px !important;
        background: #f4edf4 !important;
        display: block !important;
    }

    .dx-list-card__media-shell > a {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        min-height: 100% !important;
    }

    .dx-list-card__media-shell img,
    .dx-list-card__media-shell img.img-fluid,
    .dx-list-card__media-shell img.h-auto,
    .dx-list-card__media-shell img.w-100 {
        width: 100% !important;
        height: 100% !important;
        min-height: 100% !important;
        max-height: none !important;

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

        display: block !important;
        border-radius: 14px !important;
    }
}

/* Si la tarjeta usa columnas Bootstrap, aseguramos altura en PC */
@media (min-width: 768px) {
    .dx-list-card,
    .dx-list-card > .row,
    .dx-list-card .row.g-0 {
        align-items: stretch !important;
    }

    .dx-list-card [class*="col-"]:has(.dx-list-card__media-shell) {
        display: flex !important;
        align-items: stretch !important;
    }

    .dx-list-card [class*="col-"]:has(.dx-list-card__media-shell) .dx-list-card__media-shell {
        flex: 1 1 auto !important;
    }
}

/* Fallback para navegadores sin :has */
@media (min-width: 768px) {
    .dx-list-card__media-shell {
        align-self: stretch !important;
    }
}

/* En móvil mantenemos proporción natural para que no recorte demasiado */
@media (max-width: 767.98px) {
    .dx-list-card__media-shell {
        height: auto !important;
        overflow: hidden !important;
        border-radius: 14px !important;
    }

    .dx-list-card__media-shell img {
        width: 100% !important;
        height: auto !important;
        object-fit: cover !important;
        border-radius: 14px !important;
    }
}

/* ==========================================================
   3) Contador cámara dentro de esta vista
   ========================================================== */

.dx-list-card__media-shell .position-absolute.bottom-0.end-0,
.dx-list-card__media-shell .position-absolute.top-0.end-0 {
    opacity: 1 !important;
    background: rgba(255,255,255,.92) !important;
    color: #4a1846 !important;
    border: 1px solid rgba(116,48,108,.18) !important;
    border-radius: 999px !important;
    padding: .26rem .48rem !important;
    font-size: .68rem !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    box-shadow:
        0 5px 14px rgba(0,0,0,.13),
        inset 0 0 0 1px rgba(255,255,255,.85) !important;
}

.dx-list-card__media-shell .position-absolute.bottom-0.end-0 i,
.dx-list-card__media-shell .position-absolute.top-0.end-0 i {
    color: #74306c !important;
    font-size: .68rem !important;
    margin-right: .16rem !important;
}