import Link from "next/link";
import { Container } from "@/components/container";
import { Button } from "@/components/ui/button";
import { LogoFull } from "@/components/logo";
import { ThemeToggle } from "@/components/theme-toggle";
import { primaryCta, simpleNav } from "@/content/nav";

/**
 * SimpleHeader (§6.1): trimmed nav for support/legal pages. Static, sticky,
 * solid — enough to navigate, less noise.
 */
export function SimpleHeader() {
  return (
    <header className="sticky top-0 z-50 border-b border-border bg-background/85 backdrop-blur-md supports-[backdrop-filter]:bg-background/70">
      <Container className="flex h-16 items-center justify-between gap-4">
        <Link href="/" aria-label="Quto AI — home" className="shrink-0">
          <LogoFull />
        </Link>
        <nav
          className="hidden items-center gap-1 sm:flex"
          aria-label="Primary"
        >
          {simpleNav.map((l) => (
            <Link
              key={l.href}
              href={l.href}
              className="rounded-lg px-3 py-2 text-sm font-medium text-foreground hover:bg-muted"
            >
              {l.label}
            </Link>
          ))}
        </nav>
        <div className="flex items-center gap-2">
          <ThemeToggle className="hidden sm:inline-flex" />
          <Button asChild variant="brand" size="pill-sm">
            <Link href={primaryCta.href}>{primaryCta.label}</Link>
          </Button>
        </div>
      </Container>
    </header>
  );
}