.awf-wrap{position:fixed;z-index:99999;display:flex;flex-direction:column;align-items:flex-end;gap:calc(var(--awf-size)*.15 + 8px);font-family:inherit;--awf-color:#25D366;--awf-size:72px}
.awf-wrap.awf-left{align-items:flex-start}

/* Botón con halo claro (como la referencia) */
.awf-btn{position:relative;width:var(--awf-size);height:var(--awf-size);border-radius:50%;background:var(--awf-color);display:flex;align-items:center;justify-content:center;text-decoration:none!important;
	box-shadow:0 0 0 calc(var(--awf-size)*.15) color-mix(in srgb,var(--awf-color) 22%,transparent),0 6px 18px rgba(0,0,0,.18);transition:transform .25s ease}
.awf-btn:hover{transform:scale(1.07)}
.awf-btn::before{content:"";position:absolute;inset:calc(var(--awf-size)*-.15);border-radius:50%;background:var(--awf-color);opacity:.35;z-index:-1;animation:awf-pulse 2.2s ease-out infinite}
.awf-btn svg{width:55%;height:55%;display:block}
@keyframes awf-pulse{0%{transform:scale(1);opacity:.35}80%,100%{transform:scale(1.45);opacity:0}}

.awf-wrap .awf-btn .awf-badge{position:absolute!important;display:block!important;top:-4px;right:-4px;min-width:22px;height:22px;padding:0 6px;border-radius:11px;background:#ff3b30!important;color:#fff!important;font-size:12px!important;font-weight:700;line-height:22px!important;text-align:center;font-family:Arial,sans-serif;z-index:3;
	box-shadow:0 0 0 2px #fff;transform:scale(0);animation:awf-badge-in .45s cubic-bezier(.34,1.56,.64,1) 3s forwards}
@keyframes awf-badge-in{to{transform:scale(1)}}
.awf-wrap.awf-left .awf-btn .awf-badge{right:auto;left:-4px}

/* Nube de mensaje */
.awf-bubble{position:relative;max-width:250px;opacity:0;transform:translateY(10px) scale(.95);transform-origin:bottom right;pointer-events:none;transition:opacity .3s ease,transform .3s ease;margin-right:4px}
.awf-left .awf-bubble{transform-origin:bottom left;margin-right:0;margin-left:4px}
.awf-bubble.awf-show{opacity:1;transform:none;pointer-events:auto}
.awf-bubble-link{display:block;background:#fff;color:#1f2937!important;text-decoration:none!important;padding:12px 16px;border-radius:16px 16px 4px 16px;font-size:14.5px;line-height:1.4;font-weight:500;
	box-shadow:0 8px 24px rgba(0,0,0,.14),0 1px 3px rgba(0,0,0,.08)}
.awf-left .awf-bubble-link{border-radius:16px 16px 16px 4px}
.awf-bubble-link::after{content:"";position:absolute;bottom:-6px;right:calc(var(--awf-size)/2 - 6px);width:12px;height:12px;background:#fff;transform:rotate(45deg);box-shadow:3px 3px 4px rgba(0,0,0,.05)}
.awf-left .awf-bubble-link::after{right:auto;left:calc(var(--awf-size)/2 - 6px)}

.awf-close{position:absolute;top:-9px;left:-9px;width:22px;height:22px;padding:0;border:0;border-radius:50%;background:#6b7280;color:#fff;font-size:15px;line-height:22px;text-align:center;cursor:pointer;z-index:2;opacity:0;transition:opacity .2s}
.awf-left .awf-close{left:auto;right:-9px}
.awf-bubble:hover .awf-close,.awf-bubble:focus-within .awf-close{opacity:1}
@media (hover:none){.awf-close{opacity:1}}

/* Puntitos "escribiendo..." */
.awf-typing{display:none;gap:4px;padding:4px 2px}
.awf-bubble.awf-is-typing .awf-typing{display:inline-flex}
.awf-bubble.awf-is-typing .awf-text{display:none}
.awf-typing i{width:7px;height:7px;border-radius:50%;background:#9ca3af;animation:awf-dot 1.2s infinite ease-in-out}
.awf-typing i:nth-child(2){animation-delay:.15s}
.awf-typing i:nth-child(3){animation-delay:.3s}
@keyframes awf-dot{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-4px);opacity:1}}

@media (max-width:767px){
	.awf-hide-mobile{display:none!important}
	.awf-btn{width:calc(var(--awf-size)*.88);height:calc(var(--awf-size)*.88)}
	.awf-bubble{max-width:210px}
	.awf-bubble-link{font-size:13.5px;padding:10px 14px}
	.awf-wrap.awf-no-bubbles-mobile .awf-bubble{display:none}
}
@media (prefers-reduced-motion:reduce){.awf-btn::before,.awf-typing i{animation:none}.awf-wrap .awf-btn .awf-badge{animation:none;transform:scale(1)}}
