// Lightweight inline SVG icons (stroke-based, lucide-flavored)
const Ic = ({ d, size=18, sw=1.8, fill="none", children, ...p }) => (
  <svg width={size} height={size} viewBox="0 0 24 24" fill={fill} stroke="currentColor"
       strokeWidth={sw} strokeLinecap="round" strokeLinejoin="round" {...p}>
    {d ? <path d={d}/> : children}
  </svg>
);

const I = {
  Refresh:(p)=> <Ic {...p}><path d="M3 12a9 9 0 0 1 15-6.7L21 8"/><path d="M21 3v5h-5"/><path d="M21 12a9 9 0 0 1-15 6.7L3 16"/><path d="M3 21v-5h5"/></Ic>,
  Home: (p)=> <Ic {...p}><path d="M3 11l9-8 9 8"/><path d="M5 10v10h14V10"/></Ic>,
  Doc:  (p)=> <Ic {...p}><path d="M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z"/><path d="M14 3v5h5"/><path d="M9 13h6M9 17h6"/></Ic>,
  Edit: (p)=> <Ic {...p}><path d="M12 20h9"/><path d="M16.5 3.5a2.12 2.12 0 0 1 3 3L7 19l-4 1 1-4z"/></Ic>,
  Bars: (p)=> <Ic {...p}><path d="M4 20V10"/><path d="M10 20V4"/><path d="M16 20v-8"/><path d="M22 20H2"/></Ic>,
  Cog:  (p)=> <Ic {...p}><circle cx="12" cy="12" r="3"/><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 4.7 15a1.7 1.7 0 0 0-1.5-1H3a2 2 0 1 1 0-4h.1A1.7 1.7 0 0 0 4.7 9a1.7 1.7 0 0 0-.3-1.8l-.1-.1A2 2 0 1 1 7.1 4.3l.1.1A1.7 1.7 0 0 0 9 4.7a1.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.8 1.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"/></Ic>,
  Search:(p)=> <Ic {...p}><circle cx="11" cy="11" r="7"/><path d="M21 21l-4.3-4.3"/></Ic>,
  Bell: (p)=> <Ic {...p}><path d="M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9"/><path d="M10 21a2 2 0 0 0 4 0"/></Ic>,
  Menu: (p)=> <Ic {...p}><path d="M4 6h16M4 12h16M4 18h16"/></Ic>,
  Logout:(p)=> <Ic {...p}><path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"/><path d="M16 17l5-5-5-5"/><path d="M21 12H9"/></Ic>,
  Plus: (p)=> <Ic {...p}><path d="M12 5v14M5 12h14"/></Ic>,
  Trash:(p)=> <Ic {...p}><path d="M3 6h18"/><path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/><path d="M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6"/></Ic>,
  Reset:(p)=> <Ic {...p}><circle cx="12" cy="12" r="10"/><path d="M9 9l6 6M15 9l-6 6"/></Ic>,
  Save: (p)=> <Ic {...p}><path d="M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z"/><path d="M17 21v-8H7v8M7 3v5h8"/></Ic>,
  Cal:  (p)=> <Ic {...p}><rect x="3" y="4" width="18" height="18" rx="2"/><path d="M16 2v4M8 2v4M3 10h18"/></Ic>,
  Cash: (p)=> <Ic {...p}><rect x="2" y="6" width="20" height="12" rx="2"/><circle cx="12" cy="12" r="3"/><path d="M6 10v.01M18 14v.01"/></Ic>,
  TrendUp:(p)=> <Ic {...p}><path d="M3 17l6-6 4 4 8-8"/><path d="M14 7h7v7"/></Ic>,
  TrendDown:(p)=> <Ic {...p}><path d="M3 7l6 6 4-4 8 8"/><path d="M14 17h7v-7"/></Ic>,
  Coin: (p)=> <Ic {...p}><circle cx="12" cy="12" r="9"/><path d="M9 9h4a2 2 0 1 1 0 4h-4M9 15h5a2 2 0 0 0 0-4"/></Ic>,
  Wallet:(p)=> <Ic {...p}><path d="M3 7a2 2 0 0 1 2-2h13a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><path d="M16 12h4M16 12a2 2 0 1 1 0-4h4v8h-4a2 2 0 1 1 0-4z"/></Ic>,
  Check:(p)=> <Ic {...p}><path d="M5 13l4 4L19 7"/></Ic>,
  CheckCircle:(p)=> <Ic {...p}><circle cx="12" cy="12" r="10"/><path d="M8 12l3 3 5-6"/></Ic>,
  AlertCircle:(p)=> <Ic {...p}><circle cx="12" cy="12" r="10"/><path d="M12 8v4M12 16v.01"/></Ic>,
  BanCircle:(p)=> <Ic {...p}><circle cx="12" cy="12" r="10"/><path d="M5 5l14 14"/></Ic>,
  Filter:(p)=> <Ic {...p}><path d="M3 4h18l-7 9v6l-4 2v-8z"/></Ic>,
  Download:(p)=> <Ic {...p}><path d="M12 3v12"/><path d="M7 10l5 5 5-5"/><path d="M5 21h14"/></Ic>,
  Arrow:(p)=> <Ic {...p}><path d="M5 12h14M13 5l7 7-7 7"/></Ic>,
  Chev: (p)=> <Ic {...p}><path d="M9 18l6-6-6-6"/></Ic>,
  Sun:  (p)=> <Ic {...p}><circle cx="12" cy="12" r="4"/><path d="M12 2v2M12 20v2M4.93 4.93l1.41 1.41M17.66 17.66l1.41 1.41M2 12h2M20 12h2M4.93 19.07l1.41-1.41M17.66 6.34l1.41-1.41"/></Ic>,
  Moon: (p)=> <Ic {...p}><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"/></Ic>,
  Users:(p)=> <Ic {...p}><path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M22 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/></Ic>,
  Lock: (p)=> <Ic {...p}><rect x="3" y="11" width="18" height="11" rx="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></Ic>,
  Shield:(p)=> <Ic {...p}><path d="M12 2l8 4v6c0 5-3.5 9-8 10-4.5-1-8-5-8-10V6z"/></Ic>,
  Eye:  (p)=> <Ic {...p}><path d="M1 12s4-7 11-7 11 7 11 7-4 7-11 7S1 12 1 12z"/><circle cx="12" cy="12" r="3"/></Ic>,
  Mail: (p)=> <Ic {...p}><rect x="3" y="5" width="18" height="14" rx="2"/><path d="M3 7l9 6 9-6"/></Ic>,
  Pin:  (p)=> <Ic {...p}><path d="M12 2l3 6 6 1-4.5 4.5L18 20l-6-3-6 3 1.5-6.5L3 9l6-1z"/></Ic>,
  Spark:(p)=> <Ic {...p}><path d="M12 3v4M12 17v4M3 12h4M17 12h4M5.6 5.6l2.8 2.8M15.6 15.6l2.8 2.8M5.6 18.4l2.8-2.8M15.6 8.4l2.8-2.8"/></Ic>,
  Globe:(p)=> <Ic {...p}><circle cx="12" cy="12" r="10"/><path d="M2 12h20M12 2a15 15 0 0 1 0 20M12 2a15 15 0 0 0 0 20"/></Ic>,
  Database:(p)=> <Ic {...p}><ellipse cx="12" cy="5" rx="9" ry="3"/><path d="M3 5v14c0 1.66 4.03 3 9 3s9-1.34 9-3V5"/><path d="M3 12c0 1.66 4.03 3 9 3s9-1.34 9-3"/></Ic>,
};

// FINX wordmark
const FinxLogo = ({ size=28 }) => (
  <svg viewBox="0 0 120 36" height={size} style={{display:'block'}}>
    <defs>
      <linearGradient id="finx-x" x1="0" x2="1" y1="0" y2="1">
        <stop offset="0" stopColor="#2cb8b0"/>
        <stop offset="1" stopColor="#1f2a8e"/>
      </linearGradient>
    </defs>
    <text x="0" y="26" fontFamily="Plus Jakarta Sans, sans-serif" fontWeight="800" fontSize="26" fill="#1f2a8e" letterSpacing="-.5">FIN</text>
    <g transform="translate(70 4)">
      <path d="M2 0 L14 12 L26 0 L20 0 L14 6 L8 0 Z" fill="url(#finx-x)" opacity=".55"/>
      <path d="M2 28 L14 16 L26 28 L20 28 L14 22 L8 28 Z" fill="url(#finx-x)"/>
      <path d="M14 12 L14 22" stroke="url(#finx-x)" strokeWidth="2.5"/>
    </g>
  </svg>
);

window.I = I;
window.FinxLogo = FinxLogo;