#ui-layer{
position:fixed;
bottom:25px;
right:25px;
z-index:999;
pointer-events:none;
}

/* contenedor */

.whatsapp-chat{

display:flex;
align-items:center;
gap:10px;

opacity:0;
transform:translateY(20px);

transition:
opacity .4s ease,
transform .4s ease;

pointer-events:none;
}

/* cuando aparece */

.whatsapp-chat.show{

opacity:1;
transform:translateY(0);

pointer-events:auto;
}

/* boton */

.whatsapp-button{

width:52px;
height:52px;

background:white;

border-radius:50%;

display:flex;
align-items:center;
justify-content:center;

font-size:26px;
color:white;

box-shadow:0 8px 20px rgba(0,0,0,0.2);

transition:transform .2s ease;
}

.whatsapp-button:hover{
transform:scale(1.08);
}

.whatsapp-button i {
    color: #25D366;
}

/* burbuja */

.whatsapp-message{

background:white;
padding:8px 14px;

border-radius:18px;

box-shadow:0 6px 20px rgba(0,0,0,0.12);

font-size:13px;

display:flex;
flex-direction:column;
}

.whatsapp-message span{
font-size:11px;
color:#777;
}

@keyframes whatsappPulse {

0%{
transform:scale(1);
}

50%{
transform:scale(1.08);
}

100%{
transform:scale(1);
}

}

.whatsapp-button.pulse{

animation:whatsappPulse .6s ease;

}