.elementor-9111 .elementor-element.elementor-element-e768d53{--display:flex;--min-height:46vh;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;--overlay-opacity:0.44;}.elementor-9111 .elementor-element.elementor-element-e768d53::before, .elementor-9111 .elementor-element.elementor-element-e768d53 > .elementor-background-video-container::before, .elementor-9111 .elementor-element.elementor-element-e768d53 > .e-con-inner > .elementor-background-video-container::before, .elementor-9111 .elementor-element.elementor-element-e768d53 > .elementor-background-slideshow::before, .elementor-9111 .elementor-element.elementor-element-e768d53 > .e-con-inner > .elementor-background-slideshow::before, .elementor-9111 .elementor-element.elementor-element-e768d53 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#000000;--background-overlay:'';}.elementor-9111 .elementor-element.elementor-element-e768d53:not(.elementor-motion-effects-element-type-background), .elementor-9111 .elementor-element.elementor-element-e768d53 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-9111 .elementor-element.elementor-element-8c8a1a2{text-align:center;}.elementor-9111 .elementor-element.elementor-element-8c8a1a2 .elementor-heading-title{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-size:var( --e-global-typography-secondary-font-size );font-weight:var( --e-global-typography-secondary-font-weight );text-transform:var( --e-global-typography-secondary-text-transform );font-style:var( --e-global-typography-secondary-font-style );text-decoration:var( --e-global-typography-secondary-text-decoration );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );color:var( --e-global-color-c696dce );}.elementor-9111 .elementor-element.elementor-element-103221e{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:40px 40px;--row-gap:40px;--column-gap:40px;--margin-top:3%;--margin-bottom:3%;--margin-left:0%;--margin-right:0%;}.elementor-9111 .elementor-element.elementor-element-f478787{--e-image-carousel-slides-to-show:3;}.elementor-9111 .elementor-element.elementor-element-f478787 .swiper-wrapper{display:flex;align-items:center;}.elementor-9111 .elementor-element.elementor-element-5b0861d{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:20px 20px;--row-gap:20px;--column-gap:20px;--margin-top:0%;--margin-bottom:4%;--margin-left:0%;--margin-right:0%;}.elementor-9111 .elementor-element.elementor-element-9b7af97{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:20px 20px;--row-gap:20px;--column-gap:20px;}.elementor-9111 .elementor-element.elementor-element-03f9958{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}@media(max-width:1024px){.elementor-9111 .elementor-element.elementor-element-8c8a1a2 .elementor-heading-title{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );}.elementor-9111 .elementor-element.elementor-element-103221e{--padding-top:8%;--padding-bottom:8%;--padding-left:8%;--padding-right:8%;}.elementor-9111 .elementor-element.elementor-element-5b0861d{--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;}}@media(max-width:767px){.elementor-9111 .elementor-element.elementor-element-e768d53{--padding-top:4%;--padding-bottom:4%;--padding-left:4%;--padding-right:4%;}.elementor-9111 .elementor-element.elementor-element-8c8a1a2 .elementor-heading-title{font-size:var( --e-global-typography-secondary-font-size );line-height:var( --e-global-typography-secondary-line-height );letter-spacing:var( --e-global-typography-secondary-letter-spacing );}.elementor-9111 .elementor-element.elementor-element-103221e{--padding-top:8%;--padding-bottom:8%;--padding-left:8%;--padding-right:8%;}.elementor-9111 .elementor-element.elementor-element-5b0861d{--padding-top:8%;--padding-bottom:8%;--padding-left:8%;--padding-right:8%;}}@media(min-width:768px){.elementor-9111 .elementor-element.elementor-element-9b7af97{--width:50%;}.elementor-9111 .elementor-element.elementor-element-03f9958{--width:50%;}}@media(max-width:1024px) and (min-width:768px){.elementor-9111 .elementor-element.elementor-element-9b7af97{--width:90%;}}/* Start custom CSS for mphbe-availability, class: .elementor-element-09a61cc *//*
=====================================================
  1. ESTILOS PARA LA DISPOSICIÓN HORIZONTAL
     (Aplicado a las clases de tu plugin)
=====================================================
*/

/* * Este es el truco principal:
 * Hacemos que el formulario sea un contenedor 'flex' 
 * y que los elementos se "envuelvan"
 */
.mphb-booking-form {
  display: flex;
  flex-wrap: wrap;
  border: 1px solid #b0b0b0; /* Borde gris de la imagen */
  border-radius: 8px; /* Bordes redondeados */
  overflow: hidden; /* Mantiene los bordes redondeados */
  background: #fff; /* Fondo blanco */
}

/* * Hacemos que los dos campos de fecha 
 * ocupen el 50% de ancho cada uno
 */
.mphb-check-in-date-wrapper,
.mphb-check-out-date-wrapper {
  width: 50% !important;
  box-sizing: border-box; /* Importante para que el padding no rompa el diseño */
  margin: 0 !important; /* Resetea márgenes del plugin */
  padding: 10px 12px;
}

/* Añadimos el borde derecho solo al campo de LLEGADA */
.mphb-check-in-date-wrapper {
  border-right: 1px solid #b0b0b0;
}

/* * Hacemos que los campos de Huéspedes (Adultos) y Niños
 * ocupen el 100% de ancho para que bajen.
 */
.mphb-adults-wrapper,
.mphb-children-wrapper {
  width: 100% !important;
  box-sizing: border-box;
  margin: 0 !important;
  padding: 10px 12px;
  border-top: 1px solid #b0b0b0; /* Línea divisoria superior */
}

/* * Ocultamos el campo "Niños" para que coincida con tu imagen
 * Si SÍ quieres mostrarlo, simplemente borra estas 3 líneas:
 */
.mphb-children-wrapper {
  display: none !important;
}

/* * Movemos el botón FUERA de la caja con borde 
 * y le damos 100% de ancho
 */
.mphb-reserve-btn-wrapper {
  width: 100%;
  order: 10; /* Lo manda al final */
  padding: 0;
  border: none;
}

/*
=====================================================
  2. ESTILOS VISUALES (Como en la imagen)
=====================================================
*/

/* Oculta los <br> que pone el plugin después de las etiquetas */
.mphb-booking-form br {
  display: none;
}

/* Oculta el texto de "Campos obligatorios" */
.mphb-required-fields-tip {
  display: none;
}

/* Oculta el asterisco "*" de campo obligatorio */
.mphb-booking-form label abbr {
  display: none;
}

/* Estilo de las etiquetas (LLEGADA, SALIDA, etc.) */
.mphb-booking-form label {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-size: 10px !important;
  font-weight: 700 !important;
  color: #222 !important;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 2px !important;
}

/* * Truco CSS para cambiar "Adultos" por "HUÉSPEDES" 
 * (ya que la imagen dice "HUÉSPEDES")
 */
p.mphb-adults-wrapper label {
  font-size: 0 !important; /* Oculta el texto original "Adultos" */
}
p.mphb-adults-wrapper label::before {
  content: "HUÉSPEDES"; /* Añade el nuevo texto */
  font-size: 10px; /* Le devuelve el tamaño de fuente */
}

/* Estilo de los inputs y selects para que no parezcan campos */
.mphb-booking-form input[type="text"],
.mphb-booking-form select {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  padding: 4px 0 0 0 !important;
  margin: 0 !important;
  font-size: 14px;
  color: #717171;
  background: transparent !important;
  width: 100%;
  cursor: pointer;
  height: auto;
}

/* Placeholder (ej. "Añade la fecha") */
.mphb-booking-form input[type="text"]::placeholder {
  color: #717171;
  opacity: 1;
}

/* Estilo del select de huéspedes (para añadir la flecha de la imagen) */
.mphb-booking-form select {
  appearance: none;
  background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2212%22%20height%3D%227%22%20viewBox%3D%220%200%2012%207%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M1%201L6%206L11%201%22%20stroke%3D%22%23222222%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E') !important;
  background-repeat: no-repeat !important;
  background-position: right 8px center !important;
  background-size: 12px !important;
  padding-right: 25px !important;
}

/*
=====================================================
  3. ESTILO DEL BOTÓN (CON TU COLOR #FABC13)
=====================================================
*/

.mphb-reserve-btn.button {
  background: #FABC13 !important; /* TU COLOR */
  color: #222222 !important; /* Color de texto (negro) para que contraste */
  font-size: 16px !important;
  font-weight: 600 !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 14px !important;
  width: 100% !important;
  cursor: pointer;
  margin-top: 16px !important; /* Espacio entre la caja y el botón */
  transition: background-color 0.2s ease;
  text-align: center;
}

.mphb-reserve-btn.button:hover {
  background: #eab00a !important; /* Un tono más oscuro de tu color */
}/* End custom CSS */