import Link from "next/link";
import { Package } from "lucide-react";
import { ThemeToggle } from "@/components/ThemeToggle";

export function Navbar() {
  return (
    <header className="sticky top-0 z-50 border-b border-amber-900/20 bg-[#0a0912]/95 backdrop-blur supports-[backdrop-filter]:bg-[#0a0912]/80">
      <div className="mx-auto flex h-14 max-w-6xl items-center justify-between px-4">
        <Link
          href="/"
          className="flex items-center gap-2 text-lg font-bold text-amber-100"
        >
          <Package className="h-5 w-5 text-amber-400" />
          <span>Nanami</span>
        </Link>

        <nav className="flex items-center gap-4">
          <Link
            href="/addons"
            className="text-sm text-gray-400 transition-colors hover:text-amber-200"
          >
            插件列表
          </Link>
          <ThemeToggle />
        </nav>
      </div>
    </header>
  );
}
