/* Botón flotante solo icono con logo oficial */
.acf-wpwp-fab {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 99998;
  background: #25D366; /* color oficial */
  border-radius: 50%;
  padding: 12px;
  width: 54px;
  height: 54px;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 0 6px 18px rgba(0,0,0,.18);
  cursor: pointer;
  user-select: none;
}
.acf-wpwp-fab .acf-wpwp-fab-label { display: none; }
.acf-wpwp-fab .acf-wpwp-fab-icon {
  width: 28px; height: 28px;
  background-image: url('data:image/svg+xml;charset=utf-8,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"%3E%3Cpath fill="%23fff" d="M380.9 97.1C339 55.1 283.2 32 224.5 32c-117.4 0-213 95.6-213 213 0 37.6 9.9 74.3 28.6 106.4L3.5 480l132.3-34.6c30.3 16.6 64.3 25.4 99 25.4h.1c117.4 0 213-95.6 213-213 .1-58.6-22.9-114.5-64-156.7zM224.5 438.1h-.1c-31.2 0-61.7-8.4-88.3-24.2l-6.3-3.7-78.4 20.5 20.9-76.3-4.1-6.5c-18.1-28.8-27.6-62.2-27.6-96.6 0-99.6 81-180.6 180.6-180.6 48.2 0 93.5 18.7 127.6 52.8 34.1 34.2 52.8 79.5 52.8 127.8 0 99.6-81 180.6-180.5 180.6zm101.7-138.6c-5.6-2.8-33.1-16.3-38.2-18.2-5.1-1.9-8.8-2.8-12.5 2.8s-14.4 18.2-17.6 21.9c-3.2 3.7-6.5 4.2-12.1 1.4-33.9-17-56.1-30.3-78.5-68.6-5.9-10.1 5.9-9.3 17-31.1 1.9-3.7.9-6.9-.5-9.7-1.4-2.8-12.5-30-17.1-41.1-4.5-10.8-9.1-9.3-12.5-9.5-3.2-.2-6.9-.2-10.7-.2s-9.7 1.4-14.8 6.9c-5.1 5.6-19.5 19.1-19.5 46.5s20 53.9 22.8 57.6c2.8 3.7 39.3 60.1 95.3 84.3 35.4 15.2 49.1 16.5 66.7 13.9 10.7-1.6 33.1-13.5 37.8-26.5 4.7-13 4.7-24.1 3.2-26.5-1.3-2.5-5.1-4-10.7-6.8z"%2F%3E%3C%2Fsvg%3E');
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

/* Overlay + modal
   - CERRADO por defecto (display:none)
   - Abierto con clase .is-open
   - Además, si tiene atributo [hidden] debe ocultarse siempre
*/
.acf-wpwp-overlay { 
  position: fixed; inset: 0;
  background: rgba(0,0,0,.55);
  z-index: 2147483646;
  display: none;
  place-items: center;
}
.acf-wpwp-overlay.is-open { display: grid; }
.acf-wpwp-overlay[hidden] { display: none !important; }

.acf-wpwp-modal {
  position: relative;
  width: min(90vw, 560px);
  background: transparent;
  border-radius: 14px;
  overflow: visible;
}

/* Cerrar: solo “X” dibujada con CSS */
.acf-wpwp-close {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 28px;
  height: 28px;
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  cursor: pointer;
  z-index: 2147483647;
  pointer-events: auto !important;
}
.acf-wpwp-close::before,
.acf-wpwp-close::after{
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 2px;
  background: #fff; /* color de la X */
  transform-origin: center;
}
.acf-wpwp-close::before { transform: translate(-50%,-50%) rotate(45deg); }
.acf-wpwp-close::after  { transform: translate(-50%,-50%) rotate(-45deg); }
.acf-wpwp-close:hover::before,
.acf-wpwp-close:hover::after { background: #ff4444; }

/* Imagen base */
.acf-wpwp-figure { position: relative; }
.acf-wpwp-picture {
  display: block;
  width: 100%; height: auto;
  border-radius: 12px;
  box-shadow: 0 12px 24px rgba(0,0,0,.25);
}

/* Capa cliqueable (todo el popup excepto la X) */
.acf-wpwp-cover-link {
  position: absolute; inset: 0;
  z-index: 1;
  text-decoration: none;
}

/* Botón textual ("aquí") — oculto por defecto (tu imagen ya lo incluye) */
.acf-wpwp-cta {
  position: absolute;
  left: 26%;
  bottom: 26%;
  transform: translate(-50%, 0);
  z-index: 2;
  text-decoration: none;
  background: #00c853;
  color: #fff;
  padding: 8px 12px;
  border-radius: 8px;
  font-weight: 700;
  display: none;
}

/* QR */
.acf-wpwp-qr {
  position: absolute;
  width: auto; height: auto;
  padding: 6px;
  z-index: 2;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 8px 18px rgba(0,0,0,.2);
}

/* Posiciones del QR (ajusta a tu diseño) */
.acf-wpwp-qr.pos-top-left    { top: 18px; left: 18px; }
.acf-wpwp-qr.pos-top-right   { top: 18px; right: 18px; }
.acf-wpwp-qr.pos-bottom-left { bottom: 130px; left: 70px; }
.acf-wpwp-qr.pos-bottom-right{ bottom: 18px; right: 18px; }

@media (max-width: 500px) {
  .acf-wpwp-modal{ width: min(94vw, 480px); }
  .acf-wpwp-qr { transform: scale(.85); transform-origin: bottom left; }
  .acf-wpwp-qr.pos-bottom-left { bottom: 85px; left: 45px; }
}