components/logo.tsx

// Hanzo Logo Components
import { cn } from '@/lib/utils'

export const Logo = ({ className, ...props }: { className?: string } & React.SVGProps<SVGSVGElement>) => (
  <svg
    viewBox="0 0 67 67"
    xmlns="http://www.w3.org/2000/svg"
    className={cn("w-8 h-8", className)}
    fill="currentColor"
    {...props}
  >
    <path d="M22.21 67V44.6369H0V67H22.21Z" />
    <path d="M0 44.6369L22.21 46.8285V44.6369H0Z" opacity="0.9" />
    <path d="M66.7038 22.3184H22.2534L0.0878906 44.6367H44.4634L66.7038 22.3184Z" />
    <path d="M22.21 0H0V22.3184H22.21V0Z" />
    <path d="M66.7198 0H44.5098V22.3184H66.7198V0Z" />
    <path d="M66.6753 22.3185L44.5098 20.0822V22.3185H66.6753Z" opacity="0.9" />
    <path d="M66.7198 67V44.6369H44.5098V67H66.7198Z" />
  </svg>
)

export const LogoText = ({ className, ...props }: { className?: string } & React.SVGProps<SVGSVGElement>) => (
  <svg
    viewBox="0 0 180 30"
    className={cn("h-6", className)}
    fill="currentColor"
    {...props}
  >
    <text
      x="0"
      y="22"
      fontFamily="system-ui, -apple-system, sans-serif"
      fontSize="24"
      fontWeight="600"
      letterSpacing="-0.02em"
    >
      HANZO
    </text>
  </svg>
)

export const LogoIcon = Logo

export const HanzoLogo = Logo
export const HanzoLogoText = LogoText
export const HanzoLogoIcon = LogoIcon