.elementor-709 .elementor-element.elementor-element-4f6f8973{--display:flex;}@media(max-width:767px){.elementor-709 .elementor-element.elementor-element-57b531e9{width:var( --container-widget-width, 100% );max-width:100%;--container-widget-width:100%;--container-widget-flex-grow:0;}}/* Start custom CSS for container, class: .elementor-element-4f6f8973 *//* Estilos base y reseteo de box-sizing */
.mphb_sc_search-wrapper,
.mphb_sc_search-wrapper * {
    box-sizing: border-box;
}

/* Estilo del Contenedor Principal */
.mphb_sc_search-wrapper.is-style-horizontal-form.search-form-booking {
    background-color: rgba(0,0,0,0.4); /* Fondo oscuro como en la imagen */
    border: 1px solid #333; /* Borde gris claro */
    border-radius: 40px; /* Bordes redondeados */
    padding: 10px 15px; /* Espaciado interno */
    display: flex; /* Usa flexbox para el diseño horizontal */
    align-items: center; /* Alinea los elementos verticalmente al centro */
    color: #FFF; /* Color de texto por defecto para el contenedor */
   
    margin: 20px auto; /* Centra el contenedor en la página */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); /* Sombra sutil */
    overflow: hidden; /* Asegura que el contenido respete los bordes redondeados */
}

/* Oculta la sugerencia de campos obligatorios */
.mphb_sc_search-wrapper .mphb-required-fields-tip {
    display: none;
}

/* Estilo del Formulario (para contener las secciones individuales) */
.mphb_sc_search-wrapper .mphb_sc_search-form {
    display: flex;
    flex-grow: 1; /* Permite que el formulario ocupe el espacio disponible */
    align-items: center; /* Alinea los elementos verticalmente dentro del formulario */
    width: 100%; /* Asegura que el formulario ocupe todo el ancho de su padre */
}

/* Elimina los saltos de línea <br> por defecto que crean espacio vertical */
.mphb_sc_search-wrapper p > br {
    display: none;
}

/* Estilo para las secciones individuales (Check-in, Check-out, Guests) */
.mphb_sc_search-wrapper .mphb_sc_search-check-in-date,
.mphb_sc_search-wrapper .mphb_sc_search-check-out-date,
.mphb_sc_search-wrapper .mphb_sc_search-adults {
    flex-basis: 0; /* Sin ancho base */
    flex-grow: 1; /* Permite que cada sección crezca y distribuya el espacio equitativamente */
    padding: 0 15px; /* Relleno horizontal para espaciado entre secciones */
    text-align: left; /* Alineación del texto */
    position: relative; /* Para pseudo-elementos como separadores */
    display: flex; /* Usa flex para la disposición de etiqueta e input */
    flex-direction: column; /* Apila la etiqueta y el input verticalmente */
    justify-content: center; /* Centra el contenido verticalmente */
    min-width: 120px; /* Ancho mínimo para evitar que las secciones se aplasten */
}



/* Estilo para las etiquetas (ej. Check-in, Check-out, Guests) */
.mphb_sc_search-wrapper label {
    font-weight: 600; /* Texto más en negrita para los títulos principales */
    font-size: 1.1em; /* Tamaño de fuente más grande para los títulos principales */
    color: #FFF; /* Texto blanco para las etiquetas */
    margin-bottom: 3px; /* Pequeño espacio debajo de la etiqueta */
    display: flex; /* Usa flex para alinear icono y texto */
    align-items: center;
}

/* Oculta el asterisco de campos obligatorios */
.mphb_sc_search-wrapper label abbr {
    display: none;
}

/* Campos de entrada (Fechas y Listas desplegables Select) */
.mphb_sc_search-wrapper input.mphb-datepick,
.mphb_sc_search-wrapper select {
    background: transparent; /* Fondo transparente */
    border: 1px solid; /* Sin borde */
    color: #c1c1c1; /* Texto más claro para el valor real/placeholder */
    font-size: 1.1em; /* Tamaño de fuente más pequeño para el subtítulo */
    outline: none; /* Elimina el contorno al enfocar */
    cursor: pointer; /* Indica interactividad */
    
}

/* Estilo para el texto del placeholder */
.mphb_sc_search-wrapper input.mphb-datepick::placeholder {
    color: #c1c1c1; /* Color del placeholder */
    opacity: 1; /* Asegura que el placeholder sea visible */
}



/* Iconos para Check-in/Check-out y Guests (Asume que Font Awesome está cargado) */
/* Si Font Awesome no está disponible, estos iconos no se renderizarán.
   Puedes usar caracteres Unicode como alternativa, ej. content: "\1F4C5"; para el calendario. */
.mphb_sc_search-wrapper .mphb_sc_search-check-in-date label::before {
    content: "\f271"; /* Icono de calendario de Font Awesome */
    font-family: 'Font Awesome 5 Free';
    font-weight: 900; /* Para iconos Solid de Font Awesome */
    margin-right: 8px;
    font-size: 1.2em;
    color: white;
}
.mphb_sc_search-wrapper .mphb_sc_search-check-out-date label::before {
    content: "\f272"; /* Icono de calendario */
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    margin-right: 8px;
    font-size: 1.2em;
    color: white;
}




/* Separadores Verticales */
.mphb_sc_search-wrapper .mphb_sc_search-check-in-date,
.mphb_sc_search-wrapper .mphb_sc_search-check-out-date {
    /* Aplica bordes como separadores a la derecha de cada sección */
    border-right: 1px solid #c1c1c1;
    padding-right: 25px; /* Relleno extra para separar el contenido de la línea */
    margin-right: 20px; /* Margen para crear espacio entre la línea y el siguiente bloque */
}

/* Elimina el borde derecho de la última sección de contenido antes del botón de búsqueda */
.mphb_sc_search-wrapper .mphb_sc_search-adults {
    border-right: none;
    padding-right: 15px; /* Vuelve al relleno estándar */
    margin-right: 0; /* Elimina el margen extra */
}

/* Estilo del contenedor del botón de búsqueda */
.mphb_sc_search-wrapper .mphb_sc_search-submit-button-wrapper {
    flex-shrink: 0; /* Evita que el contenedor del botón se encoja */
    padding-left: 20px; /* Espaciado antes del botón */
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Estilo del botón de búsqueda */
.mphb_sc_search-wrapper input[type="submit"].button {
    background-color: #FFF; /* Fondo blanco */
    border: none; /* Sin borde */
    border-radius: 50%; /* Lo convierte en un círculo */
    width: 60px; /* Diámetro del círculo */
    height: 60px; /* Diámetro del círculo */
    cursor: pointer;
    display: flex; /* Usa flexbox para centrar el contenido */
    align-items: center;
    justify-content: center;
    padding: 0; /* Elimina el relleno por defecto */
    font-size: 0; /* Oculta el texto "Search" */
    text-indent: -9999px; /* Fallback para ocultar el texto */
    overflow: hidden; /* Asegura que el texto esté oculto */

    /* Agrega el icono de lupa usando un SVG inline como imagen de fondo */
    background-image: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23000"><path d="M15.5 14h-.79l-.28-.27A6.471 6.471 0 0 0 16 9.5 6.5 6.5 0 1 0 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/></svg>');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 60%; /* Ajusta el tamaño del icono */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); /* Sombra sutil para el botón */
    transition: background-color 0.3s ease;
}

.mphb_sc_search-wrapper input[type="submit"].button:hover {
    background-color: #e0e0e0; /* Blanco ligeramente más oscuro al pasar el ratón */
}

/* Ajustes Responsivos (opcional, pero buena práctica para uso real) */
@media (max-width: 768px) {
    .mphb_sc_search-wrapper.is-style-horizontal-form.search-form-booking {
        flex-direction: column; /* Apila los elementos verticalmente en pantallas pequeñas */
        border-radius: 20px; /* Bordes menos redondeados */
        padding: 15px;
    }

    .mphb_sc_search-wrapper .mphb_sc_search-form {
        flex-direction: column;
        width: 100%;
    }

    .mphb_sc_search-wrapper .mphb_sc_search-check-in-date,
    .mphb_sc_search-wrapper .mphb_sc_search-check-out-date,
    .mphb_sc_search-wrapper .mphb_sc_search-adults {
        border-right: none; /* Elimina los separadores verticales */
        border-bottom: 1px solid #333; /* Añade separadores horizontales */
        padding: 15px 0; /* Relleno vertical */
        margin: 0;
        width: 100%; /* Ocupa todo el ancho */
        min-width: unset; /* Elimina la restricción de ancho mínimo */
    }

    /* Elimina el borde inferior de la última sección de contenido */
    .mphb_sc_search-wrapper .mphb_sc_search-adults {
        border-bottom: none;
    }

    .mphb_sc_search-wrapper .mphb_sc_search-submit-button-wrapper {
        padding-left: 0;
        padding-top: 20px; /* Espacio encima del botón */
        width: 100%;
    }

    .mphb_sc_search-wrapper input[type="submit"].button {
        width: 50px; /* Botón más pequeño */
        height: 50px;
    }
}




input[name="mphb_check_in_date"] {
  color: #fff!important;
}


input[name="mphb_check_out_date"] {
  color: #fff!important;
}/* End custom CSS */
/* Start custom CSS *//* Estilos base y reseteo de box-sizing */
.mphb_sc_search-wrapper,
.mphb_sc_search-wrapper * {
    box-sizing: border-box;
}

/* Estilo del Contenedor Principal */
.mphb_sc_search-wrapper.is-style-horizontal-form.search-form-booking {
    background-color: rgba(0,0,0,0.4); /* Fondo oscuro como en la imagen */
    border: 1px solid #333; /* Borde gris claro */
    border-radius: 40px; /* Bordes redondeados */
    padding: 10px 15px; /* Espaciado interno */
    display: flex; /* Usa flexbox para el diseño horizontal */
    align-items: center; /* Alinea los elementos verticalmente al centro */
    color: #FFF; /* Color de texto por defecto para el contenedor */
   
    margin: 20px auto; /* Centra el contenedor en la página */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); /* Sombra sutil */
    overflow: hidden; /* Asegura que el contenido respete los bordes redondeados */
}

/* Oculta la sugerencia de campos obligatorios */
.mphb_sc_search-wrapper .mphb-required-fields-tip {
    display: none;
}

/* Estilo del Formulario (para contener las secciones individuales) */
.mphb_sc_search-wrapper .mphb_sc_search-form {
    display: flex;
    flex-grow: 1; /* Permite que el formulario ocupe el espacio disponible */
    align-items: center; /* Alinea los elementos verticalmente dentro del formulario */
    width: 100%; /* Asegura que el formulario ocupe todo el ancho de su padre */
}

/* Elimina los saltos de línea <br> por defecto que crean espacio vertical */
.mphb_sc_search-wrapper p > br {
    display: none;
}

/* Estilo para las secciones individuales (Check-in, Check-out, Guests) */
.mphb_sc_search-wrapper .mphb_sc_search-check-in-date,
.mphb_sc_search-wrapper .mphb_sc_search-check-out-date,
.mphb_sc_search-wrapper .mphb_sc_search-adults {
    flex-basis: 0; /* Sin ancho base */
    flex-grow: 1; /* Permite que cada sección crezca y distribuya el espacio equitativamente */
    padding: 0 15px; /* Relleno horizontal para espaciado entre secciones */
    text-align: left; /* Alineación del texto */
    position: relative; /* Para pseudo-elementos como separadores */
    display: flex; /* Usa flex para la disposición de etiqueta e input */
    flex-direction: column; /* Apila la etiqueta y el input verticalmente */
    justify-content: center; /* Centra el contenido verticalmente */
    min-width: 120px; /* Ancho mínimo para evitar que las secciones se aplasten */
}



/* Estilo para las etiquetas (ej. Check-in, Check-out, Guests) */
.mphb_sc_search-wrapper label {
    font-weight: 600; /* Texto más en negrita para los títulos principales */
    font-size: 1.1em; /* Tamaño de fuente más grande para los títulos principales */
    color: #FFF; /* Texto blanco para las etiquetas */
    margin-bottom: 3px; /* Pequeño espacio debajo de la etiqueta */
    display: flex; /* Usa flex para alinear icono y texto */
    align-items: center;
}

/* Oculta el asterisco de campos obligatorios */
.mphb_sc_search-wrapper label abbr {
    display: none;
}

/* Campos de entrada (Fechas y Listas desplegables Select) */
.mphb_sc_search-wrapper input.mphb-datepick,
.mphb_sc_search-wrapper select {
    background: transparent; /* Fondo transparente */
    border: 1px solid; /* Sin borde */
    color: #c1c1c1; /* Texto más claro para el valor real/placeholder */
    font-size: 1.1em; /* Tamaño de fuente más pequeño para el subtítulo */
    outline: none; /* Elimina el contorno al enfocar */
    cursor: pointer; /* Indica interactividad */
    
}

/* Estilo para el texto del placeholder */
.mphb_sc_search-wrapper input.mphb-datepick::placeholder {
    color: #c1c1c1; /* Color del placeholder */
    opacity: 1; /* Asegura que el placeholder sea visible */
}



/* Iconos para Check-in/Check-out y Guests (Asume que Font Awesome está cargado) */
/* Si Font Awesome no está disponible, estos iconos no se renderizarán.
   Puedes usar caracteres Unicode como alternativa, ej. content: "\1F4C5"; para el calendario. */
.mphb_sc_search-wrapper .mphb_sc_search-check-in-date label::before {
    content: "\f271"; /* Icono de calendario de Font Awesome */
    font-family: 'Font Awesome 5 Free';
    font-weight: 900; /* Para iconos Solid de Font Awesome */
    margin-right: 8px;
    font-size: 1.2em;
    color: white;
}
.mphb_sc_search-wrapper .mphb_sc_search-check-out-date label::before {
    content: "\f272"; /* Icono de calendario */
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    margin-right: 8px;
    font-size: 1.2em;
    color: white;
}




/* Separadores Verticales */
.mphb_sc_search-wrapper .mphb_sc_search-check-in-date,
.mphb_sc_search-wrapper .mphb_sc_search-check-out-date {
    /* Aplica bordes como separadores a la derecha de cada sección */
    border-right: 1px solid #c1c1c1;
    padding-right: 25px; /* Relleno extra para separar el contenido de la línea */
    margin-right: 20px; /* Margen para crear espacio entre la línea y el siguiente bloque */
}

/* Elimina el borde derecho de la última sección de contenido antes del botón de búsqueda */
.mphb_sc_search-wrapper .mphb_sc_search-adults {
    border-right: none;
    padding-right: 15px; /* Vuelve al relleno estándar */
    margin-right: 0; /* Elimina el margen extra */
}

/* Estilo del contenedor del botón de búsqueda */
.mphb_sc_search-wrapper .mphb_sc_search-submit-button-wrapper {
    flex-shrink: 0; /* Evita que el contenedor del botón se encoja */
    padding-left: 20px; /* Espaciado antes del botón */
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Estilo del botón de búsqueda */
.mphb_sc_search-wrapper input[type="submit"].button {
    background-color: #FFF; /* Fondo blanco */
    border: none; /* Sin borde */
    border-radius: 50%; /* Lo convierte en un círculo */
    width: 60px; /* Diámetro del círculo */
    height: 60px; /* Diámetro del círculo */
    cursor: pointer;
    display: flex; /* Usa flexbox para centrar el contenido */
    align-items: center;
    justify-content: center;
    padding: 0; /* Elimina el relleno por defecto */
    font-size: 0; /* Oculta el texto "Search" */
    text-indent: -9999px; /* Fallback para ocultar el texto */
    overflow: hidden; /* Asegura que el texto esté oculto */

    /* Agrega el icono de lupa usando un SVG inline como imagen de fondo */
    background-image: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23000"><path d="M15.5 14h-.79l-.28-.27A6.471 6.471 0 0 0 16 9.5 6.5 6.5 0 1 0 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/></svg>');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 60%; /* Ajusta el tamaño del icono */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); /* Sombra sutil para el botón */
    transition: background-color 0.3s ease;
}

.mphb_sc_search-wrapper input[type="submit"].button:hover {
    background-color: #e0e0e0; /* Blanco ligeramente más oscuro al pasar el ratón */
}

/* Ajustes Responsivos (opcional, pero buena práctica para uso real) */
@media (max-width: 768px) {
    .mphb_sc_search-wrapper.is-style-horizontal-form.search-form-booking {
        flex-direction: column; /* Apila los elementos verticalmente en pantallas pequeñas */
        border-radius: 20px; /* Bordes menos redondeados */
        padding: 15px;
    }

    .mphb_sc_search-wrapper .mphb_sc_search-form {
        flex-direction: column;
        width: 100%;
    }

    .mphb_sc_search-wrapper .mphb_sc_search-check-in-date,
    .mphb_sc_search-wrapper .mphb_sc_search-check-out-date,
    .mphb_sc_search-wrapper .mphb_sc_search-adults {
        border-right: none; /* Elimina los separadores verticales */
        border-bottom: 1px solid #333; /* Añade separadores horizontales */
        padding: 15px 0; /* Relleno vertical */
        margin: 0;
        width: 100%; /* Ocupa todo el ancho */
        min-width: unset; /* Elimina la restricción de ancho mínimo */
    }

    /* Elimina el borde inferior de la última sección de contenido */
    .mphb_sc_search-wrapper .mphb_sc_search-adults {
        border-bottom: none;
    }

    .mphb_sc_search-wrapper .mphb_sc_search-submit-button-wrapper {
        padding-left: 0;
        padding-top: 20px; /* Espacio encima del botón */
        width: 100%;
    }

    .mphb_sc_search-wrapper input[type="submit"].button {
        width: 50px; /* Botón más pequeño */
        height: 50px;
    }
}




input[name="mphb_check_in_date"] {
  color: #fff!important;
}


input[name="mphb_check_out_date"] {
  color: #fff!important;
}/* End custom CSS */