.kgf-whatsapp-widget {
  --whatsapp-gold-primary: #D4AF37;
  --whatsapp-gold-secondary: #C5B358;
  --whatsapp-green: #25D366;
  --whatsapp-black: #121212;
  --whatsapp-white: #FFFFFF;
  --whatsapp-transition: 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);

  position: fixed;
  bottom: 25px;
  right: 25px;
  z-index: 1000;
  font-family: 'Montserrat', sans-serif;
}

/* Adjust position when back-to-top button is present */
.kgf-footer__back-to-top:not([style*="display: none"]) ~ .kgf-whatsapp-widget,
body:has(.kgf-footer__back-to-top:not([style*="display: none"])) .kgf-whatsapp-widget {
  bottom: 90px; /* Position above back-to-top button */
}

.kgf-whatsapp-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  background: linear-gradient(135deg, var(--whatsapp-green) 0%, #128C7E 100%);
  border-radius: 50%;
  color: var(--whatsapp-white);
  text-decoration: none;
  box-shadow: 0 4px 15px rgba(37, 211, 102, 0.3);
  transition: var(--whatsapp-transition);
  position: relative;
  overflow: hidden;
}

.kgf-whatsapp-btn::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, var(--whatsapp-gold-primary) 0%, var(--whatsapp-gold-secondary) 100%);
  opacity: 0;
  transition: var(--whatsapp-transition);
  z-index: 1;
}

.kgf-whatsapp-btn:hover::before {
  opacity: 1;
}

.kgf-whatsapp-btn:hover {
  transform: translateY(-3px) scale(1.05);
  box-shadow: 0 8px 25px rgba(37, 211, 102, 0.4);
}

.kgf-whatsapp-icon {
  width: 32px;
  height: 32px;
  position: relative;
  z-index: 2;
  transition: var(--whatsapp-transition);
}

.kgf-whatsapp-btn:hover .kgf-whatsapp-icon {
  color: var(--whatsapp-black);
}

.kgf-whatsapp-tooltip {
  position: absolute;
  right: 70px;
  top: 50%;
  transform: translateY(-50%);
  background: var(--whatsapp-black);
  color: var(--whatsapp-white);
  padding: 10px 15px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  transition: var(--whatsapp-transition);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}

.kgf-whatsapp-tooltip::after {
  content: '';
  position: absolute;
  left: 100%;
  top: 50%;
  transform: translateY(-50%);
  border: 8px solid transparent;
  border-left-color: var(--whatsapp-black);
}

.kgf-whatsapp-btn:hover .kgf-whatsapp-tooltip {
  opacity: 1;
  visibility: visible;
  transform: translateY(-50%) translateX(-5px);
}

.kgf-whatsapp-pulse {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: 2px solid var(--whatsapp-green);
  animation: whatsappPulse 2s infinite;
}

@keyframes whatsappPulse {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  100% {
    transform: scale(1.3);
    opacity: 0;
  }
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
  .kgf-whatsapp-widget {
    bottom: 20px;
    right: 20px;
  }
  
  /* Adjust for mobile back-to-top button */
  .kgf-footer__back-to-top:not([style*="display: none"]) ~ .kgf-whatsapp-widget,
  body:has(.kgf-footer__back-to-top:not([style*="display: none"])) .kgf-whatsapp-widget {
    bottom: 85px;
  }
  
  .kgf-whatsapp-btn {
    width: 55px;
    height: 55px;
  }
  
  .kgf-whatsapp-icon {
    width: 28px;
    height: 28px;
  }
  
  .kgf-whatsapp-tooltip {
    display: none;
  }
}

/* Alternative approach using JavaScript for dynamic positioning */
.kgf-whatsapp-widget--repositioned {
  bottom: 90px !important;
}

@media (max-width: 768px) {
  .kgf-whatsapp-widget--repositioned {
    bottom: 85px !important;
  }
}