import Link from "next/link";
export function LogoMark({ size = 40 }: { size?: number }) {
  return (
    <svg width={size} height={size} viewBox="0 0 64 64" aria-hidden>
      <defs><linearGradient id="lg" x1="0" y1="0" x2="1" y2="1"><stop offset="0" stopColor="#06b6d4" /><stop offset="1" stopColor="#1d4ed8" /></linearGradient></defs>
      <rect width="64" height="64" rx="16" fill="url(#lg)" />
      <circle cx="20" cy="32" r="8" fill="none" stroke="#fff" strokeWidth="5" /><path d="M30 24l8 16M38 24l-8 16" stroke="#fff" strokeWidth="5" strokeLinecap="round" /><circle cx="48" cy="32" r="8" fill="none" stroke="#fff" strokeWidth="5" />
    </svg>
  );
}
export function Logo({ href = "/", sub = true }: { href?: string; sub?: boolean }) {
  return (
    <Link href={href} className="flex items-center gap-3" aria-label="OXO home">
      <LogoMark />
      <span className="leading-none"><span className="block text-lg font-extrabold tracking-tight">OXO</span>
        {sub && <span className="block text-[9px] font-semibold uppercase tracking-[.25em] text-brand">Software Solution</span>}</span>
    </Link>
  );
}