import { cn } from '@/lib/utils'

interface BrandLogoProps {
  size?: 'sm' | 'lg'
  className?: string
}

/**
 * Brand logo mark: gradient blue square with rounded corners
 * containing a white lightning bolt.
 */
export function BrandLogo({ size = 'sm', className }: BrandLogoProps) {
  const dim = size === 'sm' ? 30 : 64

  return (
    <div
      className={cn('shrink-0 flex items-center justify-center', className)}
      style={{
        width: dim,
        height: dim,
        borderRadius: size === 'sm' ? 8 : 14,
        background: 'linear-gradient(135deg, #3b82f6, #60a5fa)',
      }}
    >
      <svg
        viewBox="0 0 24 24"
        fill="none"
        style={{ width: dim * 0.5, height: dim * 0.5 }}
      >
        <path
          d="M13 2L4.5 13.5H12L11 22L19.5 10.5H12L13 2Z"
          fill="white"
          stroke="white"
          strokeWidth="0.5"
          strokeLinejoin="round"
        />
      </svg>
    </div>
  )
}
