/* Logo + minimal icon set + helpers */

function Logo({ withMark = true, size = 32, className = '' }) {
  // Triangle icon — cyan #22D3EE on top, medium blue #1D4ED8 bottom-left,
  // deep navy #1E3A8A bottom-right. Thin connecting lines (1.6) for an
  // elegant feel matching the brand asset (output/.../gendata_logo_horizontal.png).
  const Icon = (
    <svg viewBox="0 0 44 44" width={size} height={size} fill="none" aria-hidden="true">
      <line x1="22" y1="9" x2="9"  y2="34" stroke="#1E3A8A" strokeWidth="1.6" strokeLinecap="round"/>
      <line x1="22" y1="9" x2="35" y2="34" stroke="#1E3A8A" strokeWidth="1.6" strokeLinecap="round"/>
      <line x1="9"  y1="34" x2="35" y2="34" stroke="#1E3A8A" strokeWidth="1.6" strokeLinecap="round"/>
      <circle cx="22" cy="9"  r="6" fill="#22D3EE"/>
      <circle cx="9"  cy="34" r="6" fill="#1D4ED8"/>
      <circle cx="35" cy="34" r="6" fill="#1E3A8A"/>
    </svg>
  );
  if (!withMark) return <span className={className}>{Icon}</span>;
  // Wordmark on LEFT, icon on RIGHT — matches the brand asset orientation.
  return (
    <span className={`inline-flex items-center ${className}`} style={{ gap: '0.30em' }}>
      <span className="font-brand text-ink" style={{ fontWeight: 300, letterSpacing: '-0.025em', fontSize: `${size * 0.95}px`, lineHeight: 1 }}>GenData</span>
      {Icon}
    </span>
  );
}

const Icon = {
  Arrow: ({ className='' }) => (
    <svg viewBox="0 0 24 24" className={className} fill="none" aria-hidden="true">
      <path d="M5 12h14M13 6l6 6-6 6" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round" strokeLinejoin="round"/>
    </svg>
  ),
  ArrowUR: ({ className='' }) => (
    <svg viewBox="0 0 24 24" className={className} fill="none" aria-hidden="true">
      <path d="M7 17L17 7M9 7h8v8" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round" strokeLinejoin="round"/>
    </svg>
  ),
  Search: ({ className='' }) => (
    <svg viewBox="0 0 24 24" className={className} fill="none" aria-hidden="true">
      <circle cx="11" cy="11" r="6.5" stroke="currentColor" strokeWidth="1.4"/>
      <path d="M16 16l4 4" stroke="currentColor" strokeWidth="1.4" strokeLinecap="round"/>
    </svg>
  ),
  Lock: ({ className='' }) => (
    <svg viewBox="0 0 24 24" className={className} fill="none" aria-hidden="true">
      <rect x="5" y="11" width="14" height="9" rx="2" stroke="currentColor" strokeWidth="1.4"/>
      <path d="M8 11V8a4 4 0 0 1 8 0v3" stroke="currentColor" strokeWidth="1.4"/>
    </svg>
  ),
  Doc: ({ className='' }) => (
    <svg viewBox="0 0 24 24" className={className} fill="none" aria-hidden="true">
      <path d="M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8l-5-5z" stroke="currentColor" strokeWidth="1.4" strokeLinejoin="round"/>
      <path d="M14 3v5h5M8 13h8M8 16h5" stroke="currentColor" strokeWidth="1.4" strokeLinecap="round" strokeLinejoin="round"/>
    </svg>
  ),
  Download: ({ className='' }) => (
    <svg viewBox="0 0 24 24" className={className} fill="none" aria-hidden="true">
      <path d="M12 4v12M7 11l5 5 5-5" stroke="currentColor" strokeWidth="1.4" strokeLinecap="round" strokeLinejoin="round"/>
      <path d="M5 20h14" stroke="currentColor" strokeWidth="1.4" strokeLinecap="round"/>
    </svg>
  ),
  Check: ({ className='' }) => (
    <svg viewBox="0 0 24 24" className={className} fill="none" aria-hidden="true">
      <path d="M5 12.5l4.5 4.5L19 7" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round"/>
    </svg>
  ),
  ChevronDown: ({ className='' }) => (
    <svg viewBox="0 0 24 24" className={className} fill="none" aria-hidden="true">
      <path d="M6 9l6 6 6-6" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round" strokeLinejoin="round"/>
    </svg>
  ),
  Settings: ({ className='' }) => (
    <svg viewBox="0 0 24 24" className={className} fill="none" aria-hidden="true">
      <circle cx="12" cy="12" r="3" stroke="currentColor" strokeWidth="1.4"/>
      <path d="M19.4 15a1.7 1.7 0 0 0 .3 1.8l.1.1a2 2 0 1 1-2.8 2.8l-.1-.1a1.7 1.7 0 0 0-1.8-.3 1.7 1.7 0 0 0-1 1.5V21a2 2 0 1 1-4 0v-.1a1.7 1.7 0 0 0-1.1-1.5 1.7 1.7 0 0 0-1.8.3l-.1.1A2 2 0 1 1 4.3 17l.1-.1a1.7 1.7 0 0 0 .3-1.8 1.7 1.7 0 0 0-1.5-1H3a2 2 0 1 1 0-4h.1A1.7 1.7 0 0 0 4.6 9a1.7 1.7 0 0 0-.3-1.8L4.2 7A2 2 0 1 1 7 4.3l.1.1a1.7 1.7 0 0 0 1.8.3H9a1.7 1.7 0 0 0 1-1.5V3a2 2 0 1 1 4 0v.1a1.7 1.7 0 0 0 1 1.5 1.7 1.7 0 0 0 1.8-.3l.1-.1A2 2 0 1 1 19.7 7l-.1.1a1.7 1.7 0 0 0-.3 1.8V9a1.7 1.7 0 0 0 1.5 1H21a2 2 0 1 1 0 4h-.1a1.7 1.7 0 0 0-1.5 1z" stroke="currentColor" strokeWidth="1.2" strokeLinejoin="round"/>
    </svg>
  ),
  // industry tiles (line, restrained)
  Car: ({ className='' }) => (
    <svg viewBox="0 0 24 24" className={className} fill="none" aria-hidden="true">
      <path d="M4 14l2-5a2 2 0 0 1 2-1h8a2 2 0 0 1 2 1l2 5v4H4v-4z" stroke="currentColor" strokeWidth="1.3" strokeLinejoin="round"/>
      <circle cx="8" cy="17.5" r="1.4" stroke="currentColor" strokeWidth="1.3"/>
      <circle cx="16" cy="17.5" r="1.4" stroke="currentColor" strokeWidth="1.3"/>
    </svg>
  ),
  Bed: ({ className='' }) => (
    <svg viewBox="0 0 24 24" className={className} fill="none" aria-hidden="true">
      <path d="M3 18v-7h18v7M3 14h18M7 11V8h5v3" stroke="currentColor" strokeWidth="1.3" strokeLinejoin="round"/>
    </svg>
  ),
  Cart: ({ className='' }) => (
    <svg viewBox="0 0 24 24" className={className} fill="none" aria-hidden="true">
      <path d="M3 4h2l2.5 11.5a2 2 0 0 0 2 1.5h7.5a2 2 0 0 0 2-1.5L21 8H6" stroke="currentColor" strokeWidth="1.3" strokeLinecap="round" strokeLinejoin="round"/>
      <circle cx="10" cy="20" r="1.2" stroke="currentColor" strokeWidth="1.3"/>
      <circle cx="17" cy="20" r="1.2" stroke="currentColor" strokeWidth="1.3"/>
    </svg>
  ),
  Bank: ({ className='' }) => (
    <svg viewBox="0 0 24 24" className={className} fill="none" aria-hidden="true">
      <path d="M3 9l9-5 9 5v2H3V9z" stroke="currentColor" strokeWidth="1.3" strokeLinejoin="round"/>
      <path d="M5 11v8M9 11v8M15 11v8M19 11v8M3 20h18" stroke="currentColor" strokeWidth="1.3" strokeLinecap="round"/>
    </svg>
  ),
  Heart: ({ className='' }) => (
    <svg viewBox="0 0 24 24" className={className} fill="none" aria-hidden="true">
      <path d="M12 20s-7-4.3-7-10a4 4 0 0 1 7-2.6A4 4 0 0 1 19 10c0 5.7-7 10-7 10z" stroke="currentColor" strokeWidth="1.3" strokeLinejoin="round"/>
    </svg>
  ),
  People: ({ className='' }) => (
    <svg viewBox="0 0 24 24" className={className} fill="none" aria-hidden="true">
      <circle cx="9" cy="9" r="3" stroke="currentColor" strokeWidth="1.3"/>
      <circle cx="17" cy="10" r="2.4" stroke="currentColor" strokeWidth="1.3"/>
      <path d="M3 19a6 6 0 0 1 12 0M14 19a5 5 0 0 1 7 0" stroke="currentColor" strokeWidth="1.3" strokeLinecap="round"/>
    </svg>
  ),
};

const fmtRows = n => n.toLocaleString('en-US');

window.Logo = Logo;
window.Icon = Icon;
window.fmtRows = fmtRows;
