/*
Theme Name: ListingHive Child
Theme URI: https://hivepress.io/themes/listinghive
Template: listinghive
Author: HivePress
Author URI: https://hivepress.io
Description: A multipurpose WordPress theme that allows you to build any type of directory and listing websites. Whether it’s a business directory, job board, real estate, classifieds or basically any listing website — ListingHive is a great choice for it.
Tags: right-sidebar,custom-colors,custom-menu,custom-logo,custom-header,featured-image-header,featured-images,footer-widgets,theme-options,threaded-comments,translation-ready
Version: 1.2.11.1771322512
Updated: 2026-02-17 11:01:52

*/

/* Oculta el bloque del título de página en todo el sitio */
.header-hero--title {
    display: none !important;
}
@media screen and (max-width: 768px) {
    /* Forzamos al contenedor a comportarse como una fila única deslizable */
    .hp-listings .hp-row, 
    .hp-listings .hp-grid {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        padding-bottom: 15px !important;
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch;
        gap: 10px !important;
    }

    /* Ajustamos cada tarjeta para que no se encoja y ocupe casi todo el ancho */
    .hp-listings .hp-grid__item, 
    .hp-listings [class*="hp-col-"] {
        flex: 0 0 80% !important; /* El anuncio ocupa el 80% de la pantalla */
        max-width: 80% !important;
        width: 80% !important;
        margin-bottom: 0 !important;
        display: block !important;
    }

    /* Mejora visual: Ocultar la scrollbar pero permitir el movimiento */
    .hp-listings .hp-row::-webkit-scrollbar,
    .hp-listings .hp-grid::-webkit-scrollbar {
        height: 0px;
        background: transparent;
    }
}
@media (max-width: 768px) {
    /* 1. Atacamos el contenedor principal de ListingHive */
    .hp-template--listings-view .hp-page__container > div {
        display: flex !important;
        flex-direction: column !important;
    }

    /* 2. Buscamos el div del mapa (venga de donde venga) y lo mandamos abajo */
    .hp-listings-map, 
    .hp-map, 
    [class*="hp-col-"]:has(.hp-map) {
        order: 10 !important; 
        }

    /* 3. Buscamos los anuncios y los mandamos arriba */
    .hp-listings, 
    .hp-page__content {
        order: 1 !important;
    }
}
@media (min-width: 768px) {
    .hp-form--listing-search {
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
    }

    .hp-form--listing-search .hp-form__group {
        flex: 1 !important;
        margin-bottom: 0 !important;
    }