/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jul 20 2026 | 20:16:17 */
/* ==========================================================================
   ESTILOS GLOBALES (POPUPS Y BOTONES PARA PC Y MÓVIL)
   ========================================================================== */
.wpbc-overlay-dark {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.6);
    backdrop-filter: blur(4px);
    z-index: 999998;
}

.wpbc-overlay-dark.is-visible {
    display: block;
}

.trigger-calendar-mobile,
.trigger-guests-mobile,
.trigger-time-mobile {
    color: #fff;
    padding: 14px;
    border-radius: 10px;
    text-align: center;
    margin: 15px 0;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    transition: transform 0.2s;
    width: 100%;
    box-sizing: border-box;
}

.trigger-calendar-mobile:active,
.trigger-guests-mobile:active,
.trigger-time-mobile:active { transform: scale(0.97); }

.trigger-calendar-mobile { background: #3498db; }
.trigger-guests-mobile { background: #16a085; }
.trigger-time-mobile { background: #9b59b6; }

/* Botón cerrar "X" */
.mobile-popup-close {
    position: absolute;
    top: 15px;
    right: 15px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #f1f2f6;
    color: #333;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
    z-index: 999999999;
}

/* Base de los popups */
.mobile-popup {
    display: none;
    background: #fff;
    z-index: 99999999 !important;
    overflow-y: auto;
    box-sizing: border-box;
}
.mobile-popup.is-visible { display: block !important; }

/* Popups Internos: ancho 100% */
.guests-popup select, .time-popup select { width: 100%; }
.guests-popup r { display: flex; flex-direction: column; }
.guests-popup c { width: 100%; margin-bottom: 15px; }


/* ==========================================================================
   VERSIÓN ESCRITORIO (PC) - CALENDARIO STICKY + MODAL CENTRADO
   ========================================================================== */
@media screen and (min-width: 783px) {
    /* 1. ESTRUCTURA STICKY (La magia para que el sidebar flote) */
    .tour-layout-desktop {
        display: flex;
        align-items: flex-start !important; /* Vital para que funcione el sticky */
        gap: 30px;
    }
    .tour-sidebar {
        position: sticky !important;
        top: 100px !important; /* Distancia al hacer scroll. Ajusta si tienes menú de PC fijo */
        flex-shrink: 0;
        z-index: 10;
    }

    /* 2. POPUP MODAL CENTRADO EN PC */
    .mobile-popup {
        position: fixed !important;
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
        width: 450px !important; /* Ancho en PC */
        max-width: 90vw !important;
        border-radius: 16px !important;
        box-shadow: 0 10px 40px rgba(0,0,0,.3);
        max-height: 85vh;
        padding: 50px 30px 30px 30px;
    }
}


/* ==========================================================================
   VERSIÓN MÓVIL - BOTTOM SHEET (Desliza desde abajo)
   ========================================================================== */
@media screen and (max-width: 782px) {
    /* Diseño de panel inferior estilo App */
    .mobile-popup {
        position: fixed !important;
        top: auto !important;
        bottom: 0 !important;
        left: 0 !important;
        transform: none !important;
        width: 100vw !important;
        max-width: 100vw !important;
        border-radius: 24px 24px 0 0 !important;
        padding: 45px 25px 25px 25px;
        box-shadow: 0 -10px 35px rgba(0,0,0,.25);
        max-height: 85vh;
        animation: slideUp 0.3s cubic-bezier(0.25, 1, 0.5, 1) forwards;
    }

    @keyframes slideUp {
        from { transform: translateY(100%); }
        to { transform: translateY(0); }
    }

    /* Ocultar elementos originales (El Calendario solo se oculta en móvil) */
    .wpbc_booking_form_simple > .wpbc_wizard_step1 > r > c > .wpbc_r_calendar {
        display: none !important;
    }

    .calendar-popup table, .calendar-popup .datepick, .calendar-popup .ui-datepicker {
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* Ocultar botones nativos del calendario WPBC en los popups */
.datepick-cmd, .datepick-cmd-close, .ui-datepicker-close {
    display: none !important;
}



/* 1. Resetear el formulario a su comportamiento original */
@media (min-width: 782px) {
    .wpbc_booking_form_simple .wpbc_wizard_step > r {
        flex-direction: row !important; /* Vuelve a poner las cosas una al lado de la otra */
    }
}


/* 2. Estilo específico para el bloque de resumen */
.summary-row {
    display: none; /* Cambiamos a none para que esté oculto por defecto */
    flex-wrap: wrap !important;
    flex-direction: row !important;
    margin-top: 30px !important;
    width: 100% !important;
    padding-top: 20px;
    border-top: 1px solid #eee;
}

/* 3. Asegurar que cada columna del resumen tenga un ancho adecuado para no amontonarse */
.summary-row c {
    flex: 1 1 45% !important; /* Dos columnas: ocupan el 45% cada una */
    margin-bottom: 15px !important;
    display: block !important;
}

/* 4. El contenedor de "Partecipanti" debe ocupar el ancho completo para destacar */
.summary-row .participant-summary-container {
    flex: 1 1 100% !important;
    margin-bottom: 15px !important;
    background: #f9f9f9;
    padding: 10px;
    border-radius: 8px;
}

/* ==========================================================================
   AJUSTES DE ESPACIADO UNIFORME (MÓVIL)
   ========================================================================== */
@media screen and (max-width: 782px) {
    /* 1. Neutralizamos los márgenes ocultos de las cajas originales del plugin */
    .wpbc_booking_form_simple > .wpbc_wizard_step1 > r > c {
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
    }

    /* 2. Establecemos una separación exacta y uniforme para los 3 botones */
    .trigger-calendar-mobile,
    .trigger-guests-mobile,
    .trigger-time-mobile {
        margin-top: 10px !important;
        margin-bottom: 30px !important; /* Espacio estándar debajo de cada botón */
    }

    /* 3. Quitamos el margen inferior al último botón para que no sobre espacio antes del resumen */
    .trigger-time-mobile {
        margin-bottom: 10px !important;
    }
}

/* ==========================================================================
   BARRA FLOTANTE MÓVIL (BOTTOM STICKY BAR)
   ========================================================================== */
.mobile-floating-bar {
    display: none; /* Oculto por defecto en PC */
}

@media screen and (max-width: 782px) {
    .mobile-floating-bar {
        display: flex;
        position: fixed;
        bottom: -100px; /* Oculto abajo inicialmente */
        left: 0;
        width: 100%;
        background: #ffffff;
        padding: 15px 20px;
        box-shadow: 0 -4px 20px rgba(0,0,0,0.15);
        z-index: 999997; /* Justo por debajo del overlay oscuro (999998) */
        box-sizing: border-box;
        justify-content: center;
        transition: bottom 0.3s cubic-bezier(0.25, 1, 0.5, 1); /* Animación fluida */
    }

    .mobile-floating-bar.is-visible {
        bottom: 0; /* Aparece subiendo desde el borde inferior */
    }

 .mobile-floating-bar button {
    background-color: #3498db !important; /* Fuerza el color azul */
    color: #ffffff !important; /* Fuerza el texto blanco */
    width: 100% !important;
    padding: 16px !important;
    border: none !important;
    border-radius: 10px !important;
    font-size: 16px !important;
    font-weight: bold !important;
    cursor: pointer;
    box-shadow: 0 4px 10px rgba(52, 152, 219, 0.3) !important;
    transition: transform 0.1s;
    -webkit-appearance: none !important; /* Evita estilos nativos de iOS */
}

    .mobile-floating-bar button:active {
        transform: scale(0.97);
    }
}