// Marketplace logos — inline SVG marks lifted from packages/ui/src/components/MarketplaceLogo.tsx
// Each is a pure component returning an <svg>. Size via `size` prop (default 32).

const MarketplaceLogo = ({ platform, size = 32 }) => {
  const p = (platform || '').toLowerCase();
  if (p === 'trendyol' || p === 'ty') return <TrendyolMark size={size} />;
  if (p === 'shopify' || p === 'sho') return <ShopifyMark size={size} />;
  if (p === 'hepsiburada' || p === 'hb') return <HepsiburadaMark size={size} />;
  if (p === 'n11') return <N11Mark size={size} />;
  if (p === 'amazon') return <AmazonMark size={size} />;
  return <FallbackMark size={size} label={(platform || '??').slice(0, 3).toUpperCase()} />;
};

const TrendyolMark = ({ size = 32 }) => (
  <svg width={size} height={size} viewBox="0 0 32 32" aria-label="Trendyol">
    <defs>
      <linearGradient id={`ty-${size}`} x1="0" y1="0" x2="0" y2="1">
        <stop offset="0" stopColor="#ff9a3d" /><stop offset="1" stopColor="#f27a1a" />
      </linearGradient>
    </defs>
    <rect x="1" y="1" width="30" height="30" rx="6" fill={`url(#ty-${size})`} />
    <rect x="1" y="12" width="30" height="8" fill="#1a1a1a" />
    <text x="16" y="18.5" textAnchor="middle" fontFamily="Space Grotesk" fontSize="8" fontWeight="800" fill="#fff">ty</text>
  </svg>
);

const ShopifyMark = ({ size = 32 }) => (
  <svg width={size} height={size} viewBox="0 0 32 32" aria-label="Shopify">
    <defs>
      <linearGradient id={`sh-${size}`} x1="0" y1="0" x2="0" y2="1">
        <stop offset="0" stopColor="#a4cc59" /><stop offset="1" stopColor="#7ab55c" />
      </linearGradient>
    </defs>
    <path d="M10 6 C10 4, 12 3, 14 3 C18 3, 19 5, 19 7 L19 8 L22 8 L24 27 L8 27 L10 8 L10 6 Z M12 8 L17 8 L17 7 C17 5.5, 16 4.5, 14.5 4.5 C13 4.5, 12 5.5, 12 7 Z" fill={`url(#sh-${size})`} />
    <text x="16" y="22" textAnchor="middle" fontFamily="Space Grotesk" fontSize="12" fontWeight="900" fill="#fff">S</text>
  </svg>
);

const HepsiburadaMark = ({ size = 32 }) => (
  <svg width={size} height={size} viewBox="0 0 32 32" aria-label="Hepsiburada">
    <rect x="1" y="1" width="30" height="30" rx="6" fill="#fff" />
    <text x="16" y="21" textAnchor="middle" fontFamily="Space Grotesk" fontSize="17" fontWeight="900" fill="#ff6000">h</text>
    <rect x="4" y="26" width="4" height="3" fill="#e91e63" />
    <rect x="9" y="26" width="4" height="3" fill="#00a3a3" />
    <rect x="14" y="26" width="4" height="3" fill="#ff6000" />
    <rect x="19" y="26" width="4" height="3" fill="#ffb300" />
    <rect x="24" y="26" width="4" height="3" fill="#6a1b9a" />
  </svg>
);

const N11Mark = ({ size = 32 }) => (
  <svg width={size} height={size} viewBox="0 0 32 32" aria-label="n11">
    <circle cx="16" cy="17" r="13" fill="#e31e24" />
    <text x="16" y="22" textAnchor="middle" fontFamily="Space Grotesk" fontSize="13" fontWeight="900" fill="#1a1a1a">11</text>
  </svg>
);

const AmazonMark = ({ size = 32 }) => (
  <svg width={size} height={size} viewBox="0 0 32 32" aria-label="Amazon">
    <rect x="1" y="1" width="30" height="30" rx="6" fill="#232f3e" />
    <text x="16" y="19" textAnchor="middle" fontFamily="Space Grotesk" fontSize="10" fontWeight="900" fill="#ff9900">am</text>
    <path d="M7 22 Q16 27 25 22" stroke="#ff9900" strokeWidth="1.5" fill="none" strokeLinecap="round" />
  </svg>
);

const FallbackMark = ({ size = 32, label = '??' }) => (
  <svg width={size} height={size} viewBox="0 0 32 32">
    <rect x="1" y="1" width="30" height="30" rx="6" fill="#2a2a2a" stroke="#5A4136" strokeOpacity="0.3" />
    <text x="16" y="21" textAnchor="middle" fontFamily="Space Grotesk" fontSize="9" fontWeight="800" fill="#d4b5a5">{label}</text>
  </svg>
);

window.MarketplaceLogo = MarketplaceLogo;