import UserInfo from "./UserInfo"
import { Link } from "react-router-dom"

export default function Navbar() {
  return (
    <nav className="bg-surface">
      <div className="mx-auto flex justify-between items-center px-6 py-3">
        {/* Sol kısım: logo + menü */}
        <div className="flex items-center gap-15">
          <div className="text-primary font-bold text-xl">DealHeat</div>

          <ul className="flex gap-6 text-text items-center">
            <li>
              <Link
                to="/"
                className="hover:text-primary transition-colors font-semibold"
              >
                Anasayfa
              </Link>
            </li>
            <li>
              <a
                href="#"
                className="hover:text-primary transition-colors font-semibold"
              >
                Fırsatlar
              </a>
            </li>
            <li>
              <a
                href="#"
                className="hover:text-primary transition-colors font-semibold"
              >
                İletişim
              </a>
            </li>
          </ul>
        </div>

        {/* Sağ kısım: kullanıcı bilgisi + buton */}
        <div className="flex items-center gap-4">
          <UserInfo />
          <Link
            to="/submit-deal"
            className="bg-primary text-white font-semibold px-4 py-2 rounded-md hover:bg-primary/90 transition"
          >
            Fırsat Yolla
          </Link>
        </div>
      </div>
    </nav>
  )
}