/* ==========================================================================
   CONFIGURACIÓN DEL SLIDER DE MARCA (CON VARIABLES)
   ========================================================================== */
.main-slider {
    width: 100%;
    height: auto;
    max-height: 600px;
    position: relative;
    overflow: hidden;
}

.main-slider img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    filter: brightness(0.7);
}

/* Usamos las variables aquí para que el HTML pueda leerlas */
.main-slider .slide-overlay h2 {
    font-size: var(--slider-h2, 42px) !important;
    font-weight: 700 !important;
    text-shadow: 2px 2px 10px rgba(0,0,0,0.8);
}

.main-slider .slide-overlay p {
    font-size: var(--slider-p, 20px) !important;
    text-shadow: 1px 1px 5px rgba(0,0,0,0.8);
}

/* AJUSTE RESPONSIVO PARA MÓVILES (Fuentes +2pt) */
@media screen and (max-width: 768px) {
    .main-slider {
        --slider-h2: 28px !important; /* Subido de 14px a 16px */
        --slider-p: 16px !important;  /* Subido de 10px a 12px */
        max-height: 300px !important;
    }

    .main-slider .slide-overlay {
        left: 50% !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important;
        padding: 15px !important;
        width: 85% !important;
        border-radius: 15px !important;
        text-align: center !important;
    }
    
    .main-slider img {
        height: 300px !important;
        object-fit: cover;
    }
}
/* Color corporativo Belt Real Estate para OrdaSoft REM */

/* 1. Icono del marcador de mapa */
.rem .featured_houses_block .feature_texthouse i.fa-map-marker {
    color: #81744a !important;
}

/* 1. Reparar iconos faltantes con símbolos estándar */
.pagination .page-item:first-child .page-link::before { content: "«" !important; }
.pagination .page-item:nth-child(2) .page-link::before { content: "‹" !important; }
.pagination .page-item:nth-last-child(2) .page-link::before { content: "›" !important; }
.pagination .page-item:last-child .page-link::before { content: "»" !important; }

/* 2. Estilo visual de Belt Real Estate (Dorado #81744a) */
.pagination .page-item.active .page-link {
    background-color: #81744a !important;
    border-color: #81744a !important;
    color: #ffffff !important;
}

.pagination .page-link {
    color: #81744a !important;
    border: 1px solid #dee2e6;
    margin: 0 2px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 35px;
    height: 35px;
}

/* 3. Limpiar los cuadros vacíos originales */
.pagination .page-link i, 
.pagination .page-link span[aria-hidden="true"] {
    display: none !important;
}

/* ==========================================================================
   MÓDULO DE BÚSQUEDA BELT REAL ESTATE (OrdaSoft REM)
   ========================================================================== */

/* Contenedor Principal con Sombra y Bordes */
.show_search_house.default {
    background: #ffffff !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 15px !important; /* Coherente con tu estilo de slider */
    padding: 30px !important;
    margin: 20px 0 !important;
    box-shadow: 0 10px 30px rgba(129, 116, 74, 0.25) !important; /* Sombra corporativa */
}

/* Títulos y Etiquetas */
.price_label, .search-label {
    font-weight: 700 !important;
    color: #4a4a4a !important;
    margin-bottom: 8px !important;
    display: block;
}

/* Personalización del Slider de Precios */
#rem_slider.ui-slider {
    margin: 20px 10px 30px 10px !important;
    height: 4px !important;
    background: #e9e9e9 !important;
    border: none !important;
}

#rem_slider .ui-slider-range {
    background: #81744a !important; /* Tu dorado corporativo */
}

#rem_slider .ui-slider-handle {
    border-radius: 50% !important;
    border: 2px solid #81744a !important;
    background: #fff !important;
    cursor: pointer !important;
}

/* Inputs y Selects */
.show_search_house input.inputbox, 
.show_search_house input[type="text"], 
.show_search_house select {
    width: 100% !important;
    padding: 10px !important;
    border: 1px solid #ddd !important;
    border-radius: 8px !important;
    background-color: #fcfcfc !important;
    margin-bottom: 10px;
}

/* Botón BUSCAR (Aprovechando el estilo de tu paginación activa) */
.col_box_button .button {
    background-color: #81744a !important;
    color: #ffffff !important;
    padding: 12px 35px !important;
    border: none !important;
    border-radius: 8px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    cursor: pointer;
    transition: all 0.3s ease;
}

.col_box_button .button:hover {
    background-color: #6d613d !important; /* Versión más oscura para el hover */
    box-shadow: 0 4px 12px rgba(0,0,0,0.2) !important;
}

/* Ajuste específico para móviles en el buscador */
@media screen and (max-width: 768px) {
    .show_search_house.default {
        padding: 20px 15px !important;
    }
}

/* Acercar etiquetas a los campos en Operación y Estatus */
.container_box_2.container_box_3 .search-label {
    text-align: left !important;
    padding-bottom: 5px !important;
    /* Si quieres que estén en la misma línea pero más cerca, 
       podemos ajustar el margen derecho */
    margin-right: -20px !important; 
}

/* Ajuste fino para la alineación vertical y espaciado */
.container_box_2.container_box_3 .col_box_2 {
    margin-bottom: 15px !important;
    display: flex;
    flex-direction: column; /* Esto pone la etiqueta arriba del campo para un look más moderno */
}

@media (min-width: 768px) {
    .container_box_2.container_box_3 .col_box_2 {
        flex-direction: row; /* En escritorio vuelven a estar de lado */
        align-items: center;
    }
    
    .container_box_2.container_box_3 .search-label {
        flex: 0 0 30% !important; /* Forzamos a que la etiqueta ocupe menos espacio */
        max-width: 30% !important;
        margin-right: 0 !important;
    }

    .container_box_2.container_box_3 .REL-collumn-lg-7 {
        flex: 0 0 70% !important; /* El campo ocupa el resto */
        max-width: 70% !important;
    }
}

/* Unificación de Paginación OrdaSoft + Belt Real Estate */
#pagenavig ul, 
.pagination-container-belt ul {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 20px 0 !important;
    justify-content: flex-start !important;
}

#pagenavig ul li, 
.pagination-container-belt ul li {
    display: inline-block !important;
    margin: 0 4px 5px 0 !important;
}

/* Reutilizamos tus estilos de .page-link para los enlaces de OrdaSoft */
#pagenavig ul li a, 
#pagenavig ul li span,
.pagination-container-belt ul li a,
.pagination-container-belt ul li span {
    color: #81744a !important;
    border: 1px solid #dee2e6 !important;
    background-color: #ffffff !important;
    min-width: 35px !important;
    height: 35px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    padding: 0 10px !important;
    transition: all 0.3s ease;
}

#pagenavig ul li span.active, 
#pagenavig ul li a:hover,
.pagination-container-belt ul li span.active,
.pagination-container-belt ul li a:hover {
    background-color: #81744a !important;
    color: #ffffff !important;
    border-color: #81744a !important;
}
