import React from 'react';
import { MessageCircle } from 'lucide-react';

export const FloatingWhatsApp: React.FC = () => {
  const whatsappUrl = "https://wa.me/919939332200?text=" + encodeURIComponent("नमस्ते स्काई हेल्थ सेंटर, मुझे आपकी सेवा के बारे में जानकारी चाहिए। मैं अपनी समस्या बताकर समय बुक करना चाहता/चाहती हूं।");

  return (
    <a
      href={whatsappUrl}
      target="_blank"
      rel="noopener noreferrer"
      className="fixed bottom-20 right-6 md:bottom-8 md:right-8 z-40 w-14 h-14 bg-emerald-600 hover:bg-emerald-700 text-white rounded-full flex items-center justify-center shadow-2xl transition-all duration-300 hover:scale-110 animate-bounce group"
      aria-label="WhatsApp Chat"
    >
      <MessageCircle className="w-8 h-8 fill-white" />
      <span className="absolute right-full mr-3 bg-slate-900 text-white text-xs font-semibold py-1.5 px-3 rounded-xl shadow-lg opacity-0 group-hover:opacity-100 transition-opacity whitespace-nowrap pointer-events-none">
        WhatsApp पर बात करें
      </span>
    </a>
  );
};
