// PetArt — minimalist line-drawn pet silhouettes used throughout the site
// All single-color (currentColor), simple geometric — no AI-slop detail.

const PetArt = {
  dog: (props={}) => (
    <svg viewBox="0 0 64 64" fill="none" stroke="currentColor" strokeWidth="1.4" strokeLinejoin="round" strokeLinecap="round" {...props}>
      <path d="M14 22 L10 12 L18 18 L22 16 L26 22"/>
      <path d="M50 22 L54 12 L46 18 L42 16 L38 22"/>
      <path d="M14 22 Q14 38 22 44 L22 54 L28 54 L28 46 L36 46 L36 54 L42 54 L42 44 Q50 38 50 22 Q50 16 32 16 Q14 16 14 22 Z"/>
      <circle cx="24" cy="28" r="1.5" fill="currentColor"/>
      <circle cx="40" cy="28" r="1.5" fill="currentColor"/>
      <path d="M30 34 Q32 36 34 34"/>
      <path d="M32 32 L32 34"/>
    </svg>
  ),
  cat: (props={}) => (
    <svg viewBox="0 0 64 64" fill="none" stroke="currentColor" strokeWidth="1.4" strokeLinejoin="round" strokeLinecap="round" {...props}>
      <path d="M16 22 L12 10 L22 18"/>
      <path d="M48 22 L52 10 L42 18"/>
      <path d="M16 22 Q16 40 24 46 L24 54 L30 54 L30 48 L34 48 L34 54 L40 54 L40 46 Q48 40 48 22 Q48 16 32 16 Q16 16 16 22 Z"/>
      <path d="M54 30 Q60 32 56 38 Q52 42 48 40"/>
      <circle cx="25" cy="28" r="1.3" fill="currentColor"/>
      <circle cx="39" cy="28" r="1.3" fill="currentColor"/>
      <path d="M30 33 L32 35 L34 33"/>
      <path d="M22 30 L18 28 M22 32 L18 32 M42 30 L46 28 M42 32 L46 32"/>
    </svg>
  ),
  rabbit: (props={}) => (
    <svg viewBox="0 0 64 64" fill="none" stroke="currentColor" strokeWidth="1.4" strokeLinejoin="round" strokeLinecap="round" {...props}>
      <path d="M22 22 Q18 6 24 6 Q28 6 26 22"/>
      <path d="M42 22 Q46 6 40 6 Q36 6 38 22"/>
      <ellipse cx="32" cy="34" rx="14" ry="14"/>
      <circle cx="27" cy="32" r="1.3" fill="currentColor"/>
      <circle cx="37" cy="32" r="1.3" fill="currentColor"/>
      <path d="M30 38 Q32 40 34 38"/>
      <path d="M32 36 L32 38"/>
      <path d="M22 50 Q26 56 32 56 Q38 56 42 50"/>
    </svg>
  ),
  bird: (props={}) => (
    <svg viewBox="0 0 64 64" fill="none" stroke="currentColor" strokeWidth="1.4" strokeLinejoin="round" strokeLinecap="round" {...props}>
      <path d="M20 20 Q14 16 16 24 Q14 32 22 30"/>
      <path d="M22 30 Q22 14 38 18 Q52 22 50 38 Q48 50 32 50 Q20 50 22 30 Z"/>
      <path d="M50 30 L60 28 L56 32 L62 32 L56 36"/>
      <circle cx="44" cy="26" r="1.4" fill="currentColor"/>
      <path d="M28 50 L26 58 M34 50 L34 58"/>
    </svg>
  ),
  hamster: (props={}) => (
    <svg viewBox="0 0 64 64" fill="none" stroke="currentColor" strokeWidth="1.4" strokeLinejoin="round" strokeLinecap="round" {...props}>
      <ellipse cx="32" cy="36" rx="20" ry="16"/>
      <circle cx="16" cy="22" r="5"/>
      <circle cx="48" cy="22" r="5"/>
      <circle cx="25" cy="34" r="1.4" fill="currentColor"/>
      <circle cx="39" cy="34" r="1.4" fill="currentColor"/>
      <path d="M30 40 Q32 42 34 40"/>
      <path d="M32 38 L32 40"/>
      <path d="M22 42 L18 44 M42 42 L46 44"/>
    </svg>
  ),
  paw: (props={}) => (
    <svg viewBox="0 0 64 64" fill="currentColor" {...props}>
      <ellipse cx="20" cy="22" rx="6" ry="8"/>
      <ellipse cx="32" cy="14" rx="6" ry="8"/>
      <ellipse cx="44" cy="22" rx="6" ry="8"/>
      <ellipse cx="50" cy="38" rx="6" ry="7"/>
      <ellipse cx="14" cy="38" rx="6" ry="7"/>
      <path d="M18 48 Q20 36 32 36 Q44 36 46 48 Q48 56 38 58 Q32 60 26 58 Q16 56 18 48 Z"/>
    </svg>
  ),
  // Tiny inline glyphs (16px) for inline use in tags/badges
  pawSmall: (props={}) => (
    <svg viewBox="0 0 16 16" fill="currentColor" {...props}>
      <circle cx="4.5" cy="6" r="1.6"/><circle cx="8" cy="4.5" r="1.6"/>
      <circle cx="11.5" cy="6" r="1.6"/><ellipse cx="8" cy="11" rx="3.5" ry="3"/>
    </svg>
  )
};

window.PetArt = PetArt;