// Original monochrome geometric marks for each platform.
// Intentionally minimal/stylized — not exact logo reproductions.
// Rendered in currentColor so the page palette controls them.

const Icon = {
  spotify: (
    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round">
      <circle cx="12" cy="12" r="9.2"/>
      <path d="M6.8 9.2c3.6-1 7.8-.6 11 1.4"/>
      <path d="M7.4 12.4c3-.7 6.4-.3 9.2 1.2"/>
      <path d="M8 15.4c2.4-.5 5-.2 7.2 1"/>
    </svg>
  ),
  apple: (
    <svg viewBox="0 0 24 24" fill="currentColor">
      <path d="M16.4 12.6c0-2.2 1.8-3.3 1.9-3.4-1-1.5-2.6-1.7-3.2-1.7-1.4-.1-2.6.8-3.3.8-.7 0-1.7-.8-2.9-.8-1.5 0-2.9.9-3.6 2.2-1.6 2.7-.4 6.7 1.1 8.9.7 1.1 1.6 2.3 2.7 2.2 1.1 0 1.5-.7 2.8-.7 1.3 0 1.7.7 2.8.7 1.2 0 2-1.1 2.7-2.2.5-.7.9-1.5 1.2-2.4-2-1-2.2-2.9-2.2-3.6Z"/>
      <path d="M14.7 5.4c.6-.7 1-1.7.9-2.7-.9 0-1.9.6-2.5 1.3-.6.7-1.1 1.6-1 2.6 1 .1 2-.5 2.6-1.2Z"/>
    </svg>
  ),
  youtube: (
    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinejoin="round">
      <rect x="2.5" y="5.5" width="19" height="13" rx="3.2"/>
      <path d="M10.4 9.3l5.4 2.7-5.4 2.7z" fill="currentColor"/>
    </svg>
  ),
  ytmusic: (
    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.6">
      <circle cx="12" cy="12" r="9.2"/>
      <path d="M10.4 9.3l5.4 2.7-5.4 2.7z" fill="currentColor" stroke="none"/>
    </svg>
  ),
  soundcloud: (
    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round">
      <path d="M3 14v3"/>
      <path d="M5.4 12v5"/>
      <path d="M7.8 10.5v6.5"/>
      <path d="M10.2 9.5v7.5"/>
      <path d="M12.6 8v9"/>
      <path d="M15 7v10"/>
      <path d="M17.5 9.5c2 0 3.5 1.6 3.5 3.6s-1.6 3.9-3.5 3.9"/>
    </svg>
  ),
  bandcamp: (
    <svg viewBox="0 0 24 24" fill="currentColor">
      <path d="M3.5 6.5h12.4l-4.9 11h-12.4z" transform="translate(2 0)"/>
    </svg>
  ),
  tidal: (
    <svg viewBox="0 0 24 24" fill="currentColor">
      <rect x="0.7" y="6.4" width="5.2" height="5.2" transform="rotate(45 3.3 9)"/>
      <rect x="7.7" y="6.4" width="5.2" height="5.2" transform="rotate(45 10.3 9)"/>
      <rect x="14.7" y="6.4" width="5.2" height="5.2" transform="rotate(45 17.3 9)"/>
      <rect x="7.7" y="12.4" width="5.2" height="5.2" transform="rotate(45 10.3 15)"/>
    </svg>
  ),
  amazon: (
    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round">
      <path d="M4 15c4 2.6 8 3.6 12 3 2.4-.3 4-1.1 4-1.1"/>
      <path d="M18.2 15.6l1.2.3.3 1.4"/>
      <path d="M6 10.5c0-2.2 1.8-3.8 4-3.8s4 1.3 4 3.6v4.2c0 .8.3 1.4.8 1.9"/>
      <path d="M14 12.4l-2.3.5c-1.4.3-2.4 1.1-2.4 2.4 0 1.1.8 1.9 2 1.9 1.6 0 2.7-1 2.7-2.6"/>
    </svg>
  ),
  deezer: (
    <svg viewBox="0 0 24 24" fill="currentColor">
      <rect x="2" y="16" width="4" height="3"/>
      <rect x="7" y="16" width="4" height="3"/>
      <rect x="12" y="16" width="4" height="3"/>
      <rect x="17" y="16" width="4" height="3"/>
      <rect x="7" y="12" width="4" height="3"/>
      <rect x="12" y="12" width="4" height="3"/>
      <rect x="17" y="12" width="4" height="3"/>
      <rect x="12" y="8" width="4" height="3"/>
      <rect x="17" y="8" width="4" height="3"/>
      <rect x="17" y="4" width="4" height="3"/>
    </svg>
  ),
  pandora: (
    <svg viewBox="0 0 24 24" fill="currentColor">
      <path d="M5 3h8.5c3.6 0 6.5 2.6 6.5 6s-2.9 6-6.5 6H10v6H5V3zm5 4v4h3.2c1.3 0 2.3-.9 2.3-2s-1-2-2.3-2H10z"/>
    </svg>
  ),
  itunes: (
    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.6">
      <circle cx="12" cy="12" r="9.2"/>
      <path d="M10 17V8.5l6-1.2v8.4" strokeLinejoin="round"/>
      <circle cx="9" cy="17" r="1.6" fill="currentColor"/>
      <circle cx="15" cy="15.7" r="1.6" fill="currentColor"/>
    </svg>
  ),
};

window.Icon = Icon;
