:root {
    --top-value: -35px; /* Valor por defecto */
}

.filtrosAvanzados {
    padding-left: 10px;
    display: none;
}

.textbox-presupuesto {
    outline: none;
    border-radius: 4px;
    position: relative;
    top: 0;
    border: thick 1px #0b3f62;
    width: 100px;
    padding: 8px;
}

.textbox-habitaciones {
    outline: none;
    border-radius: 4px;
    position: relative;
    top: -20px;
    border: thick 1px #0b3f62;
    width: 60px;
    padding: 8px;
}

.tituloFiltroPersonalizadoGrande {
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    font-size: 15px;
    font-weight: bold;
    color: #488dfb;
}

.tituloFiltroPersonalizado {
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    font-size: 13px;
    font-weight: bold;
    color: snow;
}

.inputFiltroPersonalizado {
}

.botonesSearch {
    width: 110px;
    padding: 5px;
    color: white;
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
    font-size: 16px;
    font-weight: bold;
    background-color: #0b3f62;
    text-align: center;
    position: relative;
    /*top: -35px;*/
    top: var(--top-value); /* Usar la variable */
    float: right;
    right: 15px;
    cursor: pointer;
    border-radius: 4px;
    margin-bottom: 8px !important;
    transition: border-radius 0.3s ease, background-color 0.3s ease; /* Transiciones */
    /*overflow: hidden;*/ /* Para ocultar el ícono inicialmente */
}
    .botonesSearch:hover {
        background-color: #0d4c76;
        border-radius: 8px;
    }

        .botonesSearch:hover .icono-lupa {
            /*display: inline;*/ /* Mostrar el ícono al hacer hover */
            opacity: 1; /* Asegúrate de que el ícono sea visible */
            /*animation: aparecer 0.5s ease;*/ /* Aplicar la animación */
        }

.icono-lupa {
    opacity: 0; /* Ocultar el ícono por defecto */
    position: absolute; /* Posicionar el ícono */
    left: 10px; /* Ajusta según sea necesario */
    top: 50%; /* Centrar verticalmente */
    margin-right: 5px;
    transform: translateY(-50%); /* Centrar verticalmente */
    font-size: 20px; /* Tamaño del ícono */
    transition: opacity 1s ease; /* Transición suave para el ícono */
}

@keyframes aparecer {
    from {
        opacity: 0;
        transform: translateY(-10px); /* Mover hacia arriba */
    }

    to {
        opacity: 1;
        transform: translateY(0); /* Posición original */
    }
}



.btn-efectoboton {
}

    .btn-efectoboton:hover {
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); /* Sombra al pasar el mouse */
        transform: translateY(-1px); /* Sutil efecto de elevación */
    }