/* ============================================================
   TOMATE VACACIONES — Responsive layer
   Breakpoints: mobile < 600px | tablet 600-1024px | desktop > 1024px
   ============================================================ */

/* ── Base: quitar min-width fijo del contenedor principal ── */
.w_rap_center {
    min-width: 0 !important;
    max-width: 1200px !important;
    width: 100% !important;
    box-sizing: border-box;
    padding: 0 !important;
    overflow: hidden;
}


/* ── Cards de publicar (inmueble / hotel / comercio) ── */
.aviso_publicada_inmueble,
.aviso_publicada_hotel,
.aviso_publicada_comercio {
    width: 100%;
    max-width: 314px;
    box-sizing: border-box;
}

/* ── Grid de cards destacados en index ── */
.cards_grid {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    width: 100%;
}

.cards_grid .card_item {
    flex: 1 1 200px;
    max-width: 100%;
    box-sizing: border-box;
}

/* ── Secciones del index (Hoteles / Destacados) ── */
.section_avisos {
    position: relative;
    width: 100% !important;
    max-width: none !important;
    margin-top: 10px;
    height: auto;
    display: block;
    box-sizing: border-box;
}

.section_header {
    width: 100% !important;
    box-sizing: border-box;
}

/* ── Banner de búsqueda ── */
.banner_search {
    width: 100% !important;
    height: auto !important;
    min-height: 120px;
    box-sizing: border-box;
}

/* ── Publicar aviso lateral ── */
.publicar_lateral {
    display: none;
}

/* ── Layout panel de usuario: menú izq + contenido der ── */
.bar_user {
    float: left;
    width: 220px;
    flex-shrink: 0;
}

.content_right {
    float: left;
    min-width: 0 !important;
    max-width: none !important;
    width: calc(100% - 225px) !important;
    box-sizing: border-box;
    margin-left: 5px;
    margin-top: 60px;
}

/* ============================================================
   TABLET  600px – 1024px
   ============================================================ */
@media (max-width: 1024px) {

    .w_rap_center {
        padding: 0 !important;
    }

    /* Ocultar publicar lateral en tablet */
    .aviso_publicada_hotel {
        display: none;
    }

    /* Nav menu: scroll horizontal en tablet */
    .menu_orange_nav {
        overflow-x: auto;
        white-space: nowrap;
    }

    .menu_orange_ul {
        display: inline-flex !important;
        flex-wrap: nowrap;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* Buscador del header */
    .div_search {
        width: 60% !important;
    }

    .input_search {
        width: 80% !important;
    }
}

/* ============================================================
   MOBILE  < 600px
   ============================================================ */
@media (max-width: 600px) {

    /* Header */
    .bar_green_center {
        flex-direction: column !important;
        height: auto !important;
        padding: 8px !important;
    }

    .img_logo img.logo {
        height: 40px !important;
        width: auto !important;
    }

    .div_search {
        width: 100% !important;
        margin: 6px 0 0 0 !important;
        float: none !important;
    }

    .input_search {
        width: calc(100% - 40px) !important;
    }

    /* Nav menú: scroll horizontal */
    .menu_orange_nav {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .menu_orange_ul {
        display: inline-flex !important;
        flex-wrap: nowrap;
        list-style: none;
        padding: 0 !important;
        margin: 0 !important;
    }

    .menu_orange_il {
        flex-shrink: 0;
    }

    /* Ocultar "Publica tu Hotel" lateral */
    .aviso_publicada_hotel {
        display: none !important;
    }

    /* Cards grid: 1 columna en mobile */
    .cards_grid {
        flex-direction: column;
        align-items: center;
    }

    .cards_grid .card_item {
        max-width: 100%;
        width: 100%;
    }

    /* Secciones full width */
    .section_avisos {
        max-width: 100% !important;
    }

    /* Barra negra superior */
    .bar_black_100 {
        text-align: center;
    }

    .bar_black_right {
        float: none !important;
        display: block;
        text-align: center;
    }
}

@media (max-width: 1024px) {
}

@media (max-width: 600px) {
    .head_search_multi_form {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    .head_search_multi {
        flex-direction: column !important;
        width: 100% !important;
        min-height: 0 !important;
        padding: 10px !important;
    }

    .head_search_item {
        width: 100% !important;
        min-height: 58px !important;
        padding: 8px 0 !important;
        border-right: 0 !important;
        border-bottom: 1px solid #e3e3e3 !important;
    }

    .head_search_item_destino,
    .head_search_item_fechas,
    .head_search_item_viajeros {
        flex: 0 0 auto !important;
    }

    .head_search_multi .head_search_input {
        width: 100% !important;
    }

    .head_search_dates input {
        width: 112px !important;
    }

    .head_viajeros_panel {
        top: 58px !important;
        right: 0 !important;
        width: 100% !important;
    }

    .head_search_multi .head_search_submit {
        width: 100% !important;
        flex: 0 0 auto !important;
        min-width: 0 !important;
        max-width: none !important;
        min-height: 48px !important;
        margin: 10px 0 0 0 !important;
        background-position: calc(50% - 40px) center !important;
    }

    .head_search_multi .head_search_submit span {
        display: block !important;
        margin-left: 26px !important;
        font-size: 16px !important;
    }
}