import Link from 'next/link'

export default function Navbar() {
  return (
    <nav className="sticky top-0 z-[100] bg-white border-b border-gray-100 flex items-center justify-between px-6 md:px-16 h-[72px]">
      {/* Left Section: Logo and RxH */}
      <div className="flex items-center gap-3">
        <div className="w-10 h-10 rounded-xl bg-[#fdf2f8] flex items-center justify-center">
          <svg 
            viewBox="0 0 24 24" 
            className="w-5 h-5" 
            fill="none" 
            stroke="#993556" 
            strokeWidth="2.5" 
            strokeLinecap="round" 
            strokeLinejoin="round"
          >
            <path d="M3 3h7v7H3zM14 3h7v7h-7zM3 14h7v7H3zM14 14h7v7h-7z" />
          </svg>
        </div>
        <span className="text-[20px] font-bold tracking-tight text-black font-serif">
          RxH
        </span>
      </div>

      {/* Center Section: Navigation Links */}
      <div className="hidden md:flex items-center gap-10">
        <Link href="#features" className="text-[15px] font-medium text-gray-500 hover:text-black transition-colors">Features</Link>
        <Link href="#plans" className="text-[15px] font-medium text-gray-500 hover:text-black transition-colors">Plans</Link>
        <Link href="#privacy" className="text-[15px] font-medium text-gray-500 hover:text-black transition-colors">Privacy</Link>
        <Link href="#terms" className="text-[15px] font-medium text-gray-500 hover:text-black transition-colors">Terms</Link>
        <Link href="#download" className="text-[15px] font-medium text-gray-500 hover:text-black transition-colors">Download</Link>
      </div>

      {/* Right Section: Button */}
      <Link 
        href="/walkthrough" 
        className="bg-[#d6527c] hover:bg-[#c0436b] text-white text-[15px] font-semibold px-7 py-2.5 rounded-full shadow-sm transition-all"
      >
        Login
      </Link>
    </nav>
  )
}