.elementor-1933 .elementor-element.elementor-element-80808e7{--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;}.elementor-1933 .elementor-element.elementor-element-0dabdd3{text-align:center;}.elementor-1933 .elementor-element.elementor-element-0dabdd3 .elementor-heading-title{font-family:"Montserrat", Sans-serif;font-size:37px;font-weight:400;color:#124061;}.elementor-1933 .elementor-element.elementor-element-1f1d496f{--display:flex;}:root{--page-title-display:none;}/* Start custom CSS for shortcode, class: .elementor-element-4ba41b7a *//* =========================================================
   DISEÑO DEL CHECKOUT (AJUSTADO AL HTML EXACTO)
   ========================================================= */

/* 1. Forzar color azul y tipografía en todos los textos */
.mphb-checkout-section,
.mphb-checkout-section p,
.mphb-checkout-section span,
.mphb-checkout-section time,
.mphb-checkout-section strong,
.mphb-checkout-section label,
.mphb-checkout-section a,
.mphb-booking-details-title,
.mphb-room-number,
.mphb-room-type-title {
    color: #124061 !important;
    font-family: inherit !important;
}

/* 2. Estilo de los Títulos (Detalles de reserva, Alojamiento #1) */
.mphb-booking-details-title,
.mphb-room-number {
    font-weight: 700 !important;
    border-bottom: 2px solid #f0f4f8 !important; 
    padding-bottom: 10px !important;
    margin-bottom: 20px !important;
    font-size: 22px !important;
}

/* 3. Limpiar los campos del formulario (Adiós al fondo beige) */
.mphb-checkout-section input[type="text"],
.mphb-checkout-section input[type="email"],
.mphb-checkout-section input[type="tel"],
.mphb-checkout-section select,
.mphb-checkout-section textarea,
.guest-chooser-wrapper select,
.guest-chooser-wrapper input {
    background-color: #ffffff !important; /* Fondo blanco limpio */
    border: 1px solid #dcdfe3 !important; /* Borde gris suave */
    color: #124061 !important;
    padding: 12px 15px !important;
    border-radius: 6px !important;
    font-family: inherit !important;
    width: 100% !important;
    box-sizing: border-box !important;
    margin-bottom: 15px !important;
    box-shadow: none !important; /* Quita sombras raras por defecto */
}

/* Efecto al hacer clic en un campo (se ilumina el borde) */
.mphb-checkout-section input:focus,
.mphb-checkout-section select:focus,
.mphb-checkout-section textarea:focus {
    border-color: #124061 !important;
    box-shadow: 0 0 0 2px rgba(18, 64, 97, 0.1) !important;
    outline: none !important;
}

/* 4. Alinear mejor la sección de elegir "Adultos" y "Niños" */
.guest-chooser-wrapper {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    margin-bottom: 15px;
}

.guest-chooser-wrapper p {
    flex: 1;
    margin-bottom: 0 !important;
}

/* 5. Botón Final (Confirmar / Pagar) */
input[type="submit"].mphb-confirm-reservation,
button.mphb-confirm-reservation,
.mphb-button {
    background-color: #124061 !important;
    color: #ffffff !important;
    padding: 16px 30px !important;
    border-radius: 6px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-size: 15px !important;
    letter-spacing: 0.5px !important;
    border: none !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    margin-top: 20px !important;
}

input[type="submit"].mphb-confirm-reservation:hover,
button.mphb-confirm-reservation:hover,
.mphb-button:hover {
    background-color: #1a5a8a !important;
    box-shadow: 0px 5px 15px rgba(18, 64, 97, 0.2) !important;
    transform: translateY(-2px);
}/* End custom CSS */