/* =========================================================
   1. ESTADO ESCRITORIO / MONITORES GRANDES (> 1280px)
   ========================================================= */

/* Ocultar el botón 'Más filtros' en pantallas grandes */
button.ph-toggle-filters-btn,
.ph-toggle-filters-btn,
form.property-search-form .ph-toggle-filters-btn {
    display: none !important;
}

@media (min-width: 1281px) {
    /* Barra horizontal completa */
    form.property-search-form {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: flex-end !important;
        width: 100% !important;
        box-sizing: border-box !important;
        gap: 8px !important;
    }

    form.property-search-form .control {
        display: block !important;
        flex: 1 1 auto !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Ocultamiento dinámico de precios (Venta vs Alquiler) */
    form.property-search-form .control[style*="none"] {
        display: none !important;
    }

    form.property-search-form select,
    form.property-search-form input[type="text"],
    form.property-search-form input[type="number"] {
        width: 100% !important;
        box-sizing: border-box !important;
        font-size: 13px !important;
        padding: 6px 8px !important;
    }

    form.property-search-form input[type="submit"],
    form.property-search-form button[type="submit"] {
        flex: 0 0 auto !important;
        white-space: nowrap !important;
        padding: 8px 16px !important;
        margin: 0 !important;
    }
}

/* =========================================================
   2. VISTA NOTEBOOKS CHICAS / TABLET / MOBILE (<= 1280px)
   ========================================================= */
@media (max-width: 1280px) {
    /* Formulario en columna */
    form.property-search-form {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        gap: 10px !important;
        padding: 16px !important;
        box-sizing: border-box !important;
    }

    /* Ocultar filtros por defecto */
    form.property-search-form .control {
        display: none !important;
        width: 100% !important;
        margin: 0 !important;
    }

    /* Mostrar únicamente Venta / Alquiler */
    form.property-search-form .control-department {
        display: block !important;
    }

    /* Mostrar botón 'Más filtros' */
    button.ph-toggle-filters-btn,
    .ph-toggle-filters-btn,
    form.property-search-form .ph-toggle-filters-btn {
        display: block !important;
        width: 100% !important;
        background-color: #f5f5f5 !important;
        border: 1px solid #cccccc !important;
        color: #333333 !important;
        padding: 10px 14px !important;
        border-radius: 6px !important;
        font-weight: 600 !important;
        font-size: 14px !important;
        cursor: pointer !important;
        text-align: center !important;
        margin: 4px 0 !important;
    }

    /* Botón 'Buscar' */
    form.property-search-form input[type="submit"],
    form.property-search-form button[type="submit"] {
        display: block !important;
        width: 100% !important;
        height: 42px !important;
        margin-top: 4px !important;
    }

    /* Despliegue de filtros */
    form.property-search-form.filters-expanded .control {
        display: block !important;
    }

    /* Respetar ocultamiento dinámico de PropertyHive */
    form.property-search-form.filters-expanded .control[style*="none"] {
        display: none !important;
    }

    /* Inputs al 100% de ancho */
    form.property-search-form select,
    form.property-search-form input[type="text"],
    form.property-search-form input[type="number"] {
        width: 100% !important;
        height: 40px !important;
        box-sizing: border-box !important;
    }
}