.chat-icon {
  position: fixed;
  right: 30px;
  bottom: 100px;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  z-index: 99;
  overflow: visible;
  
}

.chat-icon .dot {
  position: absolute;
  top: 0;
  right: 0;
  width: 15px;
  height: 15px;
  background-color: red;
  border-radius: 50%;
  z-index: 100;
}

.chat-icon .pulse-ring {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  background-color: #f47822;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  animation: pulse-ring 2s infinite ease-out;
  opacity: 0;
  z-index: -1;
}

.chat-icon .pulse-ring:nth-child(1) { animation-delay: 0s; }
.chat-icon .pulse-ring:nth-child(2) { animation-delay: 0.3s; }
.chat-icon .pulse-ring:nth-child(3) { animation-delay: 0.6s; }

@keyframes pulse-ring {
  0% {
      transform: translate(-50%, -50%) scale(0.5);
      opacity: 0.6;
  }
  100% {
      transform: translate(-50%, -50%) scale(1.8);
      opacity: 0;
  }
}
@keyframes shake {
  0%, 100% { transform: translate(0, 0); }
  20% { transform: translate(-1px, 1px); }
  40% { transform: translate(2px, -1px); }
  60% { transform: translate(-2px, 2px); }
  80% { transform: translate(1px, -2px); }
}
/* .chat-icon {
  animation: shake 2s infinite ease-in-out;
} */