/* ============================================================
   LUMFELL — line icons (simple, stroke-based)
   ============================================================ */
const Ico = ({ d, size = 22, sw = 1.4, 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 IcoBag = (p) => (
  <Ico {...p}>
    <path d="M5.5 8h13l-1 11.5a1.5 1.5 0 0 1-1.5 1.4H8a1.5 1.5 0 0 1-1.5-1.4L5.5 8Z" />
    <path d="M8.6 8V6.4a3.4 3.4 0 0 1 6.8 0V8" />
  </Ico>
);
const IcoSearch = (p) => (
  <Ico {...p}><circle cx="11" cy="11" r="6.2" /><path d="m20 20-3.6-3.6" /></Ico>
);
const IcoClose = (p) => (<Ico {...p}><path d="M6 6l12 12M18 6 6 18" /></Ico>);
const IcoArrow = (p) => (<Ico {...p}><path d="M4 12h15m0 0-6-6m6 6-6 6" /></Ico>);
const IcoArrowDown = (p) => (<Ico {...p}><path d="M12 4v15m0 0 6-6m-6 6-6-6" /></Ico>);
const IcoPlus = (p) => (<Ico {...p}><path d="M12 5v14M5 12h14" /></Ico>);
const IcoMinus = (p) => (<Ico {...p}><path d="M5 12h14" /></Ico>);
const IcoCheck = (p) => (<Ico {...p}><path d="M4 12.5 9.5 18 20 6.5" /></Ico>);

/* brand-value / benefit icons — kept geometric & simple */
const IcoHand = (p) => (
  <Ico {...p}>
    <path d="M7 13V6.5a1.4 1.4 0 0 1 2.8 0V12" />
    <path d="M9.8 11.5V5a1.4 1.4 0 0 1 2.8 0v6.5" />
    <path d="M12.6 12V6.2a1.4 1.4 0 0 1 2.8 0V13" />
    <path d="M15.4 12.8V8.5a1.4 1.4 0 0 1 2.6.6c0 4.4-1.2 6.7-3 8.3-1.1 1-1.4 1.8-1.4 2.6H8.7c0-1-.4-1.7-1.4-2.8C6 15.8 5 14.6 5 13.4a1.3 1.3 0 0 1 2-1.1Z" />
  </Ico>
);
const IcoHide = (p) => (  /* full-grain leather: layered hide */
  <Ico {...p}>
    <path d="M3.5 9c2-2.5 4.5-3 6-2.2 1.4.8 2.3.3 3.5-.6 1.8-1.3 4-1.4 5.6.2 1.7 1.7 1.9 4.2.4 5.8-1 1-1 2 .1 3.2 1.2 1.4.6 3.4-1 4-1.8.7-3.2-.1-4.6-.7-1-.4-1.8-.2-2.8.4-1.6.9-3.6.6-4.6-1-1-1.6-.4-2.8.3-4C7.3 12 6.8 11 5.6 10.7 4 10.3 3 10 3.5 9Z" />
  </Ico>
);
const IcoShield = (p) => (
  <Ico {...p}>
    <path d="M12 3.5 5.5 6v5.4c0 4.2 2.8 7 6.5 9 3.7-2 6.5-4.8 6.5-9V6L12 3.5Z" />
    <path d="M9.2 12.2 11.3 15l3.8-4.6" />
  </Ico>
);
const IcoLeaf = (p) => (
  <Ico {...p}>
    <path d="M19 5c-9 0-13 3.6-13 9.2 0 1.6.5 3 .5 3S5 19 4.5 20.5" />
    <path d="M19 5c.5 6-2.5 11-9.5 11.5" />
  </Ico>
);
const IcoTruck = (p) => (
  <Ico {...p}>
    <path d="M3 7h10v8H3zM13 10h4l3 3v2h-7z" />
    <circle cx="7" cy="17.5" r="1.7" /><circle cx="16.5" cy="17.5" r="1.7" />
  </Ico>
);
const IcoReturn = (p) => (
  <Ico {...p}>
    <path d="M4 9a8 8 0 1 1-1.4 5" /><path d="M3 4.5 3 9h4.5" />
  </Ico>
);
const IcoBadge = (p) => (
  <Ico {...p}>
    <circle cx="12" cy="9.5" r="5.5" /><path d="M9 14.5 8 21l4-2.2L16 21l-1-6.5" />
  </Ico>
);
const IcoChat = (p) => (
  <Ico {...p}>
    <path d="M4 6h16v10H9l-4 3.5V16H4z" />
  </Ico>
);

window.LumIcons = {
  IcoBag, IcoSearch, IcoClose, IcoArrow, IcoArrowDown,
  IcoPlus, IcoMinus, IcoCheck, IcoHand, IcoHide, IcoShield, IcoLeaf,
  IcoTruck, IcoReturn, IcoBadge, IcoChat,
};