.ysy-wa { position: fixed; right: 16px; bottom: 92px; z-index: 2147483500; width: min(340px, calc(100vw - 32px)); background: #F6F0E9; color: #3B2A22; border-radius: 18px; box-shadow: 0 14px 40px rgba(59, 42, 34, .25); overflow: hidden; font-family: inherit; font-size: 14px; line-height: 1.45; opacity: 0; transform: translateY(14px) scale(.98); transform-origin: bottom right; transition: opacity .3s, transform .3s; }
.ysy-wa.on { opacity: 1; transform: none; }
.ysy-wa-cab { display: flex; align-items: center; gap: 10px; background: #741C03; color: #fff; padding: 12px 12px 12px 14px; }
.ysy-wa-cab img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; object-position: 50% 12%; border: 2px solid rgba(255, 255, 255, .7); flex: none; }
.ysy-wa-cab div { flex: 1; min-width: 0; }
.ysy-wa-cab b { display: block; font-size: 15px; }
.ysy-wa-cab span { font-size: 12px; opacity: .9; display: flex; align-items: center; gap: 6px; }
.ysy-wa-cab span i { width: 8px; height: 8px; border-radius: 50%; background: #5BD27A; display: inline-block; }
.ysy-wa-x { background: none; border: 0; color: #fff; font-size: 26px; line-height: 1; cursor: pointer; padding: 2px 6px; opacity: .85; }
.ysy-wa-x:hover, .ysy-wa-x:focus-visible { opacity: 1; }
.ysy-wa-cuerpo { padding: 14px; background: #F6F0E9; }
.ysy-wa-msg, .ysy-wa-escribe { background: #fff; border-radius: 4px 14px 14px 14px; padding: 10px 12px; margin: 0 0 10px; display: inline-block; box-shadow: 0 1px 0 #E3D6C6; }
.ysy-wa-msg[hidden], .ysy-wa-escribe[hidden], .ysy-wa-ops[hidden] { display: none; }
.ysy-wa-escribe span { display: inline-block; width: 7px; height: 7px; margin: 0 2px; border-radius: 50%; background: #B9A99A; animation: ysy-wa-p 1s infinite; }
.ysy-wa-escribe span:nth-child(2) { animation-delay: .15s; } .ysy-wa-escribe span:nth-child(3) { animation-delay: .3s; }
@keyframes ysy-wa-p { 0%, 60%, 100% { transform: translateY(0); opacity: .5; } 30% { transform: translateY(-4px); opacity: 1; } }
.ysy-wa-ops { display: flex; flex-direction: column; gap: 7px; }
.ysy-wa-ops a { display: block; text-decoration: none; color: #741C03; background: #fff; border: 1px solid #E3D6C6; border-radius: 22px; padding: 9px 14px; font-weight: 600; font-size: 13.5px; transition: background .15s, color .15s; }
.ysy-wa-ops a:hover, .ysy-wa-ops a:focus-visible { background: #741C03; color: #fff; border-color: #741C03; outline: none; }
@media (max-width: 480px) { .ysy-wa { right: 12px; bottom: 84px; width: calc(100vw - 24px); } }
@media (prefers-reduced-motion: reduce) { .ysy-wa { transition: none; } .ysy-wa-escribe span { animation: none; } }
.ysy-wa.pausa { opacity: 0 !important; visibility: hidden; pointer-events: none; }