#elementor-popup-modal-5133 .dialog-widget-content{animation-duration:1s;background-color:#0E75FA00;border-style:none;}#elementor-popup-modal-5133 .dialog-message{width:200px;height:auto;}#elementor-popup-modal-5133{justify-content:flex-end;align-items:flex-end;}@media(max-width:767px){#elementor-popup-modal-5133 .dialog-message{width:690px;}#elementor-popup-modal-5133{justify-content:flex-end;align-items:flex-end;}}/* Start custom CSS for html, class: .elementor-element-2ffd6479 */"/* --- CSS Adicional para Botón Flotante (Icono + Texto) --- */
/* !!! REEMPLAZA '.tu-clase-css-aqui' con la(s) clase(s) de la celda B7 !!! */

/* --- 1. Transición Suave (Base) --- */
/* Aplica al .elementor-5133 .elementor-element.elementor-element-2ffd6479 base para que los cambios al pasar el ratón (hover) sean suaves */
.boton-whatsapp-cta {
  transition: background-color 0.2s ease-in-out, transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
  cursor: pointer; /* Asegura que el cursor sea una mano */
}

/* --- 2. Estilos Hover --- */
/* Estilos que se aplican al pasar el ratón por encima */
.boton-whatsapp-cta:hover {
  /* ---- AJUSTA ESTOS VALORES COMO QUIERAS ---- */

  /* Ejemplo: Cambiar color de fondo (un verde WhatsApp un poco más oscuro) */
  background-color: #1DAA57;

  /* Ejemplo: Hacer el botón ligeramente más grande */
  transform: scale(1.05);

  /* Ejemplo: Hacer la sombra un poco más pronunciada */
  box-shadow: 4px 4px 15px rgba(0, 0, 0, 0.4);

  /* Opcional: Cambiar color de texto/icono si el fondo cambia mucho */
  /* color: #f0f0f0; */
}

/* --- 3. Ajustes Responsivos --- */
/* Usamos Media Queries para aplicar estilos según el ancho de la pantalla */

/* ** Estilos para Tablet (Ej: pantallas hasta 1024px de ancho) ** */
@media (max-width: 1024px) {
  .boton-whatsapp-cta {
    /* ---- AJUSTA ESTOS VALORES PARA TABLET ---- */

    /* Ejemplo: Reducir tamaño de fuente del texto */
    /* Si tu base (B10) era 16px, quizás 14px funcione bien */
    font-size: 14px !important;

    /* Ejemplo: Reducir un poco el padding si ocupa mucho */
    /* padding: 8px 12px !important; */

    /* Opcional: Acercar un poco a los bordes */
    /* right: 15px !important; */
    /* bottom: 15px !important; */
  }

  /* Ejemplo: Reducir tamaño del icono (si lo quieres diferente al texto) */
  .boton-whatsapp-cta i { /* Selecciona el icono (<i>) dentro del botón */
    /* Si tu icono base (B11) era 20px, quizás 18px */
     font-size: 18px !important;
  }
}

/* ** Estilos para Móvil (Ej: pantallas hasta 767px de ancho) ** */
@media (max-width: 767px) {
  .boton-whatsapp-cta {
    /* ---- AJUSTA ESTOS VALORES PARA MÓVIL ---- */

    /* Ejemplo: Reducir más tamaño de fuente del texto */
    /* Si tu base (B10) era 16px, quizás 12px o 13px */
    font-size: 13px !important;

    /* Ejemplo: Reducir más el padding para ahorrar espacio valioso */
    padding: 8px 10px !important;

    /* Opcional: Acercar más a los bordes */
    /* right: 10px !important; */
    /* bottom: 10px !important; */
  }

  /* Ejemplo: Reducir tamaño del icono en móvil */
  .boton-whatsapp-cta i {
    /* Si tu icono base (B11) era 20px, quizás 16px */
     font-size: 16px !important;
     /* Opcional: Reducir espacio entre icono y texto */
     margin-right: 5px !important;
  }
}

/* --- Fin del CSS Adicional --- */"/* End custom CSS */