

.botonAzuWhatsapp{
    
}


    /*
    |--------------------------------------------------------------------------
    | BLOQUE MENU RESTAURANTE
    |--------------------------------------------------------------------------
    */

.blckMenuRestaurante .blckContent{
    position: relative;
}
.blckMenuRestaurante .blckContent .btnDescargarMenu{
position: absolute;
    bottom: 10px;
    left: 50%;
    width: 100%;
    transform: translateX(-50%);
    text-align: center;
}
.blckMenuRestaurante .blckContent .btnDescargarMenu ul{
    display: inline-block;
}

    /*
    |--------------------------------------------------------------------------
    | BLOQUE ENTRADA LOOP SIMPLE
    |--------------------------------------------------------------------------
    */


    /* --- Contenedor Principal de la Paginación --- */
.blckLoopActividadesFront .elementor-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px; /* Espacio entre los botones de paginación */
    position: absolute;
    bottom: 60px;
    right: 10px;
}

/* --- Estilo Base para los Botones (Prev / Next y Páginas) --- */
.blckLoopActividadesFront  .elementor-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 35px;
    height: 35px;
    color: #333333;
    border-radius: 50%; /* Hace que los botones sean circulares */
    transition: all 0.3s ease;
}

/* Efecto hover general para las cajas */
.blckLoopActividadesFront  .elementor-pagination .page-numbers:hover {
    background-color: #f0f0f0;
    border-color: #d0d0d0;
}

/* --- Ocultar el texto "Previous" y "Next" y transformarlos en cajas de flecha --- */
.blckLoopActividadesFront  .elementor-pagination .prev,
.blckLoopActividadesFront  .elementor-pagination .next {
    font-size: 0; /* Oculta visualmente el texto nativo de Elementor */
    position: relative;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 18px 18px; /* Tamaño del icono SVG dentro de la caja */
}

/* --- Botón Anterior (Prev) con tu SVG --- */
.blckLoopActividadesFront  .elementor-pagination .prev {
    /* Reemplaza el código URL codificado por tu SVG o usa una ruta relativa/absoluta a tu archivo */
    background-image: url("/wp-content/uploads/2026/08/icon-previous-blanco.svg");
    background-size: 35px 35px; /* Ajusta el tamaño del icono según sea necesario */
}

/* --- Botón Siguiente (Next) con tu SVG --- */
.blckLoopActividadesFront  .elementor-pagination .next {
    background-image: url("/wp-content/uploads/2026/08/icon-next-blanco.svg");
    background-size: 35px 35px; /* Ajusta el tamaño del icono según sea necesario */        

}

/* --- Estado Activo de la Paginación numérica (opcional) --- */
.blckLoopActividadesFront  .elementor-pagination .page-numbers.current {
    background-color: #0056b3; /* Color corporativo activo */
    color: #ffffff;
    border-color: #0056b3;
}

/*
    .blckLoopActividadesFront {}

    .blckLoopActividadesFront .elementor-pagination{
        position: relative;
    }

    .blckLoopActividadesFront  .elementor-pagination .prev{font-size: 200%}
    .blckLoopActividadesFront  .elementor-pagination .next{font-size: 200%}
    
*/

/* =========================================
   CLUB NAVAL - FORM EVENTOS - FINAL FIX AM/PM
   ========================================= */
.contentFonmEventos .box1,
.contentFonmEventos .box3 {
    width: 100%;
    display: flex!important;
    flex-wrap: wrap!important;
    gap: 0 18px;
    box-sizing: border-box!important;
}
.contentFonmEventos .box1 .bx {
    width: calc(50% - 9px)!important;
    flex: 0 0 calc(50% - 9px)!important;
    margin: 0 0 18px 0!important;
}
.contentFonmEventos .box3 .bx.bx01 {
    width: calc(40% - 9px)!important;
    flex: 0 0 calc(40% - 9px)!important;
    margin: 0 0 18px 0!important;
}
.contentFonmEventos .box3 .bx.bx02 {
    width: calc(60% - 9px)!important;
    flex: 0 0 calc(60% - 9px)!important;
    margin: 0 0 18px 0!important;
    display: flex!important;
    flex-wrap: wrap!important;
    gap: 0 8px!important;
    align-items: flex-start!important;
}

/* LABELS - TODOS IGUALES */
.contentFonmEventos .bx label,
.contentFonmEventos .box label,
.contentFonmEventos label {
    display: block!important;
    width: 100%!important;
    flex: 0 0 100%!important;
    margin-bottom: 6px!important;
    font-size: 14px!important;
    font-weight: 500!important;
    color: #2B2B2B!important;
}
.contentFonmEventos .required { color: #C1272D!important; font-weight:700!important; }

/* WRAPS */
.contentFonmEventos .wpcf7-form-control-wrap { display:block!important; width:100%!important; }

/* INPUTS Y SELECTS - TEXTO CLARO COMO EL BORDE */
.contentFonmEventos input[type="text"],
.contentFonmEventos input[type="email"],
.contentFonmEventos input[type="tel"],
.contentFonmEventos input[type="date"],
.contentFonmEventos select,
.contentFonmEventos textarea {
    width: 100%!important;
    background: #fff!important;
    border: 1px solid #D9DCE1!important;
    border-radius: 8px!important;
    padding: 12px 14px!important;
    height: 46px!important;
    color: #9AA0A6!important;
    -webkit-text-fill-color: #9AA0A6!important;
    box-sizing: border-box!important;
}
.contentFonmEventos textarea { height:auto!important; min-height:110px!important; }
.contentFonmEventos input::placeholder { color:#9AA0A6!important; opacity:1!important; }

/* --- ESTO ARREGLA EL DESALINEO AM/PM --- */
.contentFonmEventos .box3 .bx.bx02 > .wpcf7-form-control-wrap[data-name="hora"],
.contentFonmEventos .box3 .bx.bx02 > .wpcf7-form-control-wrap[data-name="minuto"],
.contentFonmEventos .box3 .bx.bx02 > .wpcf7-form-control-wrap[data-name="periodo"] {
    width: calc((100% - 16px) / 3)!important;
    flex: 0 0 calc((100% - 16px) / 3)!important;
    box-sizing: border-box!important;
}

/* El contenedor del radio am/pm a mitad de altura */
.contentFonmEventos .box3 .bx.bx02 .wpcf7-form-control-wrap[data-name="periodo"] {
    display: flex!important;
    align-items: center!important;
    height: 46px!important;
}
.contentFonmEventos .box3 .bx.bx02 .wpcf7-form-control-wrap[data-name="periodo"] .wpcf7-radio {
    display: flex!important;
    flex-direction: row!important;
    align-items: center!important;
    gap: 14px!important;
    height: 46px!important;
    margin:0!important;
}
.contentFonmEventos .box3 .bx.bx02 .wpcf7-list-item {
    margin:0!important;
    display:inline-flex!important;
    align-items:center!important;
    gap:4px!important;
}
.contentFonmEventos .box3 .bx.bx02 .wpcf7-list-item label { width:auto!important; flex:none!important; margin:0!important; }

/* BOTON AZUL CON ICONO - SEGUNDA IMAGEN */
.contentFonmEventos input[type="submit"] {
    background-color: #0F3562!important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M2.01 21L23 12 2.01 3 2 10l15 2-15 2z'/%3E%3C/svg%3E")!important;
    background-repeat: no-repeat!important;
    background-position: 18px center!important;
    background-size: 16px!important;
    color:#fff!important;
    border:none!important;
    border-radius:8px!important;
    padding:11px 22px 11px 44px!important;
    font-weight:600!important;
    cursor:pointer!important;
}
/* MENSAJE DE ÉXITO CLUB NAVAL - LLAMATIVO */
.wpcf7 form.sent .wpcf7-response-output,
.wpcf7-response-output.wpcf7-mail-sent-ok{
  background: var(--e-global-color-primary) !important;
  color: #ffffff !important;
  border: none !important;
  border-left: 5px solid var(--e-global-color-accent) !important;
  border-radius: 4px !important;
  padding: 22px 25px 22px 60px !important;
  font-size: 15px !important;
  line-height: 1.5 !important;
  position: relative !important;
  box-shadow: 0 10px 30px rgba(10,25,49,0.2) !important;
  animation: clubNavalPop 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
  margin-top: 25px !important;
}

/* Icono check dorado */
.wpcf7 form.sent .wpcf7-response-output::before{
  content: "✓";
  position: absolute;
  left: 18px;
  top: 50%;
  transform: translateY(-50%);
  width: 32px;
  height: 32px;
  background: var(--e-global-color-accent) !important;
  color: var(--e-global-color-primary) !important;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 18px;
  line-height: 32px;
  text-align: center;
}

/* Animación de entrada */
@keyframes clubNavalPop{
  0%{ opacity:0; transform: translateY(20px) scale(0.95); }
  100%{ opacity:1; transform: translateY(0) scale(1); }
}

/* También mejora el mensaje de error para que no desentone */
.wpcf7-response-output.wpcf7-validation-errors,
.wpcf7-response-output.wpcf7-mail-sent-ng{
  background: var(--e-global-color-primary) !important;
  border: 1px solid var(--e-global-color-accent) !important;
  border-left: 5px solid var(--e-global-color-accent) !important;
  color: #7a1f1f !important;
  border-radius: 4px !important;
  padding: 18px 20px !important;
}

/* FIX VALIDACION CF7 - CLUB NAVAL */
.wpcf7-not-valid-tip{
  display: block !important;
  color: #c0392b !important;
  font-size: 12px !important;
  font-family: Arial, sans-serif !important;
  margin-top: 6px !important;
  font-weight: 600 !important;
}
.wpcf7-not-valid{
  border-color: #c0392b !important;
  background: #FFF5F5 !important;
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output{
  display: block !important;
  background: #FFF5F5 !important;
  border: 1px solid #e0a0a0 !important;
  border-left: 4px solid #c0392b !important;
  color: #7a1f1f !important;
  padding: 15px 18px !important;
  border-radius: 3px !important;
  margin-top: 20px !important;
}
@media (max-width: 767px){
    .contentFonmEventos .box1, .contentFonmEventos .box3 { display:block!important; }
    .contentFonmEventos .box1 .bx, .contentFonmEventos .box3 .bx.bx01, .contentFonmEventos .box3 .bx.bx02 { width:100%!important; flex:none!important; }
}


/* =========================================
   PAGINA SOBRE EL CLUB - MENU LATERAL  
   ========================================= */
.cn-menu-el-club .cn-menu {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
}
.cn-menu-el-club .cn-btn {
  display: block;
  width: 100%;
  text-align: left;
  padding: 16px 20px;
  margin-bottom: 8px;
  border: none;
  border-radius: 8px;
  background-color: var(--ecs-color-bg-alt);
  color: #333333;
  font-size: 16px;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease;
}
.cn-menu-el-club .cn-btn:hover {
  background-color: var(--e-global-color-text);
}
.cn-menu-el-club .cn-btn.active,
.cn-menu-el-club .cn-btn:hover{
  background-color: var(--e-global-color-primary);
  color: #ffffff;
}

