/* ============================================================
   Shared icons + brand lockup
   ============================================================ */

const Ico = ({ d, size = 18, stroke = 2, className = "", style }) => (
  <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth={stroke}
       strokeLinecap="round" strokeLinejoin="round"
       width={size} height={size} className={className} style={style}>
    {Array.isArray(d) ? d.map((p, i) => <path key={i} d={p} />) : <path d={d} />}
  </svg>
);

const I = {
  home:       "M3 12l9-9 9 9M5 10v10h14V10",
  ladder:     ["M3 21l4-4 4 4", "M3 14l4-4 4 4", "M3 7l4-4 4 4", "M14 21V3", "M19 21V3"],
  bookmark:   "M19 21l-7-5-7 5V5a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2z",
  coach:      ["M9 11a4 4 0 1 1 8 0 4 4 0 0 1-8 0z", "M3 21a8 8 0 0 1 16 0"],
  chat:       "M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z",
  settings:   ["M12 15a3 3 0 1 0 0-6 3 3 0 0 0 0 6z", "M19.4 13a8 8 0 0 0 0-2l2-1.5-2-3.5-2.4 1a8 8 0 0 0-1.7-1L15 3h-4l-.4 2.4a8 8 0 0 0-1.7 1L6.6 5l-2 3.5L6.6 11a8 8 0 0 0 0 2l-2 1.5 2 3.5 2.4-1a8 8 0 0 0 1.7 1L11 21h4l.4-2.4a8 8 0 0 0 1.7-1L19.4 19l2-3.5z"],
  calendar:   ["M3 5h18v16H3z", "M3 9h18", "M8 3v4", "M16 3v4"],
  map:        ["M9 4l-6 2v14l6-2 6 2 6-2V4l-6 2z", "M9 4v14", "M15 6v14"],
  arrowRight: "M5 12h14M13 5l7 7-7 7",
  arrowLeft:  "M19 12H5M11 19l-7-7 7-7",
  check:      "M5 13l4 4L19 7",
  plus:       "M12 5v14M5 12h14",
  x:          "M6 6l12 12M18 6L6 18",
  caret:      "M6 9l6 6 6-6",
  play:       "M8 5v14l11-7z",
  download:   ["M12 4v12", "M7 11l5 5 5-5", "M5 20h14"],
  upload:     ["M12 20V8", "M7 13l5-5 5 5", "M5 4h14"],
  video:      ["M2 6h14v12H2z", "M22 8l-6 4 6 4z"],
  print:      ["M6 9V3h12v6", "M6 17H4a2 2 0 0 1-2-2v-3a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2h-2", "M6 14h12v7H6z"],
  warn:       ["M12 3l10 18H2z", "M12 10v5", "M12 18h.01"],
  list:       ["M8 6h13", "M8 12h13", "M8 18h13", "M3 6h.01", "M3 12h.01", "M3 18h.01"],
  bike:       ["M5 18a3 3 0 1 0 0-6 3 3 0 0 0 0 6z", "M19 18a3 3 0 1 0 0-6 3 3 0 0 0 0 6z", "M5 15l4-9h4l3 5h2", "M9 6h4"],
  helmet:     ["M3 14a9 9 0 1 1 18 0v3H3z", "M3 17h18"],
  award:      ["M12 15a6 6 0 1 0 0-12 6 6 0 0 0 0 12z", "M8.5 13.5L7 22l5-3 5 3-1.5-8.5"],
  trail:      ["M4 21l5-5", "M9 16a3 3 0 0 0 3-3", "M12 13a3 3 0 0 1 3-3", "M15 10a3 3 0 0 0 3-3", "M18 7l2-2"],
  pin:        ["M12 22s-7-7-7-12a7 7 0 0 1 14 0c0 5-7 12-7 12z", "M12 11a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"],
  refresh:    ["M21 12a9 9 0 0 1-15 6.7L3 16", "M3 12a9 9 0 0 1 15-6.7L21 8", "M21 3v5h-5", "M3 21v-5h5"],
  sparkle:    ["M12 3l2.5 6.5L21 12l-6.5 2.5L12 21l-2.5-6.5L3 12l6.5-2.5z"]
};

/* Lockup — the Pedaling Minds At Home brand block */
const Lockup = ({ onDark = false, onClick }) => (
  <div className={"lockup " + (onDark ? "on-dark" : "")} onClick={onClick}>
    <div className="lockup-mark">
      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2"
           strokeLinecap="round" strokeLinejoin="round">
        <path d="M5 18a3 3 0 1 0 0-6 3 3 0 0 0 0 6z" />
        <path d="M19 18a3 3 0 1 0 0-6 3 3 0 0 0 0 6z" />
        <path d="M5 15l4-9h4l3 5h2" />
        <path d="M9 6h4" />
      </svg>
    </div>
    <div className="lockup-text">
      <span className="wm">Pedaling Minds</span>
      <span className="at-home">At Home</span>
    </div>
  </div>
);

Object.assign(window, { Ico, I, Lockup });