#contact-icons {
  position: fixed; /* Keeps it at a fixed position on the screen */
  bottom: 20px; /* Adjust distance from the bottom */
  right: 20px; /* Adjust distance from the left */
  z-index: 1000; /* Ensures it appears above other elements */
  display: flex; /* Aligns child elements */
  flex-direction: column; /* Stack items vertically */
  gap: 20px; /* Space between the icons */
}

.zalo-vr,
.phone-vr {
  width: 60px;
  height: 60px;
  position: relative;
  border-radius: 50%;
  background-color: #ffffff; /* Optional background for visibility */
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  transition: transform 0.3s;
  animation: shake 0.8s infinite; /* Faster shake animation */
  cursor: pointer; /* Change cursor to indicate clickable */
}

.zalo-vr:hover,
.phone-vr:hover {
  transform: scale(1.2); /* Slight zoom on hover */
}

.zalo-vr-circle-fill,
.phone-vr-circle-fill {
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  animation: pulse 1.5s infinite; /* Animation for pulsing effect */
  pointer-events: none; /* Allow clicks to pass through */
}

.zalo-vr-circle-fill {
  background-color: rgba(29, 140, 243, 0.2);
}

.phone-vr-circle-fill {
  background-color: rgba(37, 211, 102, 0.2);
}

.phone-vr-img-circle img,
.zalo-vr-img-circle img {
  width: 50px;
  height: 50px;
  border-radius: 50%; /* Makes the image circular */
}

/* Pulse animation */
@keyframes pulse {
  0% {
    transform: scale(1.5);
    opacity: 1;
  }
  100% {
    transform: scale(1.5);
    opacity: 0;
  }
}

/* Faster shake animation */
@keyframes shake {
  0%, 100% { transform: translateX(0); }
  20% { transform: translateX(-1.5px); }
  40% { transform: translateX(-1.5px); }
  60% { transform: translateX(1.5px); }
  80% { transform: translateX(-1.5px); }
}
