/* Pop-up del sitio (inc/popup.php + assets/js/popup.js). Solo se descarga en las páginas que lo llevan.
   Una tarjeta abajo a la IZQUIERDA (el lado contrario al chat del sitio, que vive abajo a la derecha), que NO
   bloquea la página: sin fondo oscuro, sin modal, la página sigue desplazándose. Cuadrada como la imagen y sin
   pasar de su tamaño real. Sin bordes redondeados. Las barras fijas del borde de abajo (la de compra de la ficha
   y el aviso de las categorías en el teléfono) la subirían encima: popup.js mide esas barras y sube la tarjeta
   (variable --ar-popup-bottom). */

.ar-popup{position:fixed;z-index:99990;left:16px;bottom:var(--ar-popup-bottom,16px);width:min(340px,calc(100vw - 32px));
  opacity:0;transform:translateY(14px);transition:opacity .3s var(--ease,ease),transform .3s var(--ease,ease),bottom .25s var(--ease,ease);
  box-shadow:0 14px 40px -10px rgba(0,0,0,.45);background:#fff}
.ar-popup[hidden]{display:none}
.ar-popup.is-abierto{opacity:1;transform:none}

.ar-popup__enlace{display:block}
.ar-popup__img{display:block;width:100%;height:auto}
.ar-popup__img--cierra{cursor:pointer}

/* cerrar: cuadro blanco pegado a la esquina; 40 px para que se acierte con el dedo */
.ar-popup__cerrar{position:absolute;top:0;right:0;z-index:2;width:40px;height:40px;padding:0;border:0;border-radius:0;
  background:#fff;color:var(--ink,#1e1e1c);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s}
.ar-popup__cerrar:hover{background:#f4f3ee}
.ar-popup__cerrar:focus-visible,.ar-popup__enlace:focus-visible{outline:2px solid var(--ink,#1e1e1c);outline-offset:-4px;box-shadow:0 0 0 2px #fff inset}

/* teléfono: más chica */
@media(max-width:700px){
  .ar-popup{left:12px;bottom:var(--ar-popup-bottom,12px);width:min(260px,calc(100vw - 24px))}
}

@media(prefers-reduced-motion:reduce){
  .ar-popup{transition:none;transform:none}
}