// Inline SVG icons used across the site
const Icon = {
  Apple: (props) => (
    <svg viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" {...props}>
      <path d="M16.365 1.43c0 1.14-.46 2.23-1.21 3.03-.81.86-2.14 1.52-3.23 1.43-.13-1.13.43-2.31 1.18-3.07.84-.86 2.27-1.5 3.26-1.39zM20.5 17.13c-.55 1.27-.81 1.84-1.52 2.97-.99 1.58-2.39 3.55-4.13 3.57-1.54.02-1.94-1-4.03-.99-2.09.01-2.53.99-4.07.97-1.74-.02-3.06-1.79-4.05-3.37-2.77-4.43-3.06-9.62-1.35-12.39 1.21-1.96 3.13-3.11 4.93-3.11 1.83 0 2.99.99 4.51.99 1.47 0 2.37-.99 4.49-.99 1.6 0 3.3.87 4.51 2.37-3.97 2.18-3.32 7.85.71 9.97z"/>
    </svg>
  ),
  GooglePlay: (props) => (
    <svg viewBox="0 0 24 24" aria-hidden="true" {...props}>
      <path fill="#FFD400" d="M13.4 12 4.4 21l9-5.5z"/>
      <path fill="#00C7FF" d="m4.4 3 9 9-9 9c-.3-.2-.4-.5-.4-.9V3.9c0-.4.1-.7.4-.9z"/>
      <path fill="#00F076" d="M16.7 9.6 13.4 12 4.4 3z"/>
      <path fill="#FF3A44" d="m13.4 12 3.3 2.4 3.5-2.1c.7-.4.7-1.4 0-1.8l-3.5-2.1z"/>
    </svg>
  ),
  Plus: (props) => (
    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" {...props}>
      <path d="M12 5v14M5 12h14"/>
    </svg>
  ),
  Mail: (props) => (
    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round" {...props}>
      <rect x="3" y="5" width="18" height="14" rx="2"/>
      <path d="m3 7 9 6 9-6"/>
    </svg>
  ),
  Twitter: (props) => (
    <svg viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" {...props}>
      <path d="M18.244 2H21l-6.52 7.45L22 22h-6.79l-4.74-6.2L4.94 22H2.18l6.98-7.97L2 2h6.91l4.29 5.69L18.24 2zm-1.19 18h1.65L7.04 4H5.27l11.78 16z"/>
    </svg>
  ),
  Instagram: (props) => (
    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.6" {...props}>
      <rect x="3" y="3" width="18" height="18" rx="5"/>
      <circle cx="12" cy="12" r="4"/>
      <circle cx="17.5" cy="6.5" r="1" fill="currentColor" stroke="none"/>
    </svg>
  ),
  TikTok: (props) => (
    <svg viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" {...props}>
      <path d="M19.6 6.7a5.4 5.4 0 0 1-3.16-1.02 5.4 5.4 0 0 1-2-2.93h-3.18v12.13a2.83 2.83 0 1 1-2.83-2.83c.27 0 .53.04.78.11V8.94a6.05 6.05 0 1 0 5.23 6V9.85a8.55 8.55 0 0 0 5.16 1.7V8.36c-.01 0-.01-.92 0-1.66z"/>
    </svg>
  ),
  Star: (props) => (
    <svg viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" {...props}>
      <path d="m12 2 3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14l-5-4.87 6.91-1.01L12 2z"/>
    </svg>
  ),
  Sparkle: (props) => (
    <svg viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" {...props}>
      <path d="M12 2l1.6 5.6L19 9l-5.4 1.4L12 16l-1.6-5.6L5 9l5.4-1.4z"/>
    </svg>
  ),
};

window.Icon = Icon;
