import { Separator } from "@/registry/ui/separator"

export default function FooterMinimal() {
  const links = ["Docs", "Pricing", "Status", "Privacy", "Terms"]

  return (
    <footer className="border-t border-border px-6 py-8">
      <div className="flex flex-col items-center justify-between gap-4 sm:flex-row">
        <p className="text-sm font-semibold tracking-tight">Acme</p>

        <nav className="flex h-4 flex-wrap items-center justify-center gap-3 text-sm text-muted">
          {links.map((link, index) => (
            <span key={link} className="flex h-4 items-center gap-3">
              <a href="#" className="transition-colors hover:text-fg">
                {link}
              </a>
              {index < links.length - 1 ? (
                <Separator orientation="vertical" className="hidden sm:block" />
              ) : null}
            </span>
          ))}
        </nav>

        <p className="text-xs text-muted">© 2026 Acme, Inc.</p>
      </div>
    </footer>
  )
}