/* eslint-disable */
/* SVG icons. Each is a function returning an inline SVG. */

const Icons = {
  // Category icons
  Braking: (props = {}) => (
    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round" strokeLinejoin="round" {...props}>
      <circle cx="12" cy="12" r="8.5" />
      <circle cx="12" cy="12" r="4" />
      <circle cx="12" cy="12" r="1" fill="currentColor" />
      <path d="M12 3.5v3M12 17.5v3M3.5 12h3M17.5 12h3" />
    </svg>
  ),
  Filtration: (props = {}) => (
    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinejoin="round" {...props}>
      <rect x="4" y="3.5" width="16" height="17" rx="1" />
      <path d="M7 3.5v17M11 3.5v17M15 3.5v17M19 3.5v17" />
      <path d="M4 8h16M4 13h16M4 18h16" />
    </svg>
  ),
  Ignition: (props = {}) => (
    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinejoin="round" {...props}>
      <path d="M10 2.5h4v4l1.5 1.5v6.5h-7V8L10 6.5z" />
      <path d="M10.5 15h3v2.5l-1.5 4-1.5-4z" />
      <path d="M8.5 4.5h7" />
    </svg>
  ),
  Electrical: (props = {}) => (
    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinejoin="round" {...props}>
      <rect x="3" y="6.5" width="18" height="13" rx="1" />
      <rect x="6.5" y="4" width="3.5" height="3" />
      <rect x="14" y="4" width="3.5" height="3" />
      <path d="M7 12h3M14 12h3M15.5 10.5v3" />
    </svg>
  ),
  Lighting: (props = {}) => (
    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinejoin="round" {...props}>
      <path d="M12 2.5a6 6 0 0 0-3.5 10.85V16a1 1 0 0 0 1 1h5a1 1 0 0 0 1-1v-2.65A6 6 0 0 0 12 2.5z" />
      <path d="M10 19.5h4M10.5 21.5h3" />
    </svg>
  ),
  Visibility: (props = {}) => (
    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round" strokeLinejoin="round" {...props}>
      <path d="M3 19.5L11 4.5l2 1L5 20.5z" />
      <path d="M19 4.5c-2 4-2 9 0 14" />
      <path d="M21.5 5c-2.5 4.5-2.5 9.5 0 14" />
    </svg>
  ),
  Wheels: (props = {}) => (
    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinejoin="round" {...props}>
      <circle cx="12" cy="12" r="9" />
      <circle cx="12" cy="12" r="3.5" />
      <path d="M12 3v5.5M12 15.5V21M3 12h5.5M15.5 12H21M5.6 5.6l3.9 3.9M14.5 14.5l3.9 3.9M5.6 18.4l3.9-3.9M14.5 9.5l3.9-3.9" />
    </svg>
  ),
  Suspension: (props = {}) => (
    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round" strokeLinejoin="round" {...props}>
      <path d="M8 2.5h8M8 21.5h8" />
      <path d="M8 5l8 2-8 2 8 2-8 2 8 2-8 2 8 2" />
    </svg>
  ),
  Exhaust: (props = {}) => (
    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinejoin="round" {...props}>
      <path d="M2 12c0-2 2-4 4-4h11l4 2v4l-4 2H6c-2 0-4-2-4-4z" />
      <circle cx="6" cy="12" r="1" fill="currentColor" />
      <circle cx="11" cy="12" r="1" fill="currentColor" />
    </svg>
  ),
  Fluids: (props = {}) => (
    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinejoin="round" {...props}>
      <path d="M9 3h6v3l2 2v13a1 1 0 0 1-1 1H8a1 1 0 0 1-1-1V8l2-2z" />
      <path d="M7 13h10" />
      <path d="M9 17h6" />
    </svg>
  ),

  // UI icons
  Search: (props = {}) => (
    <svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.7" strokeLinecap="round" {...props}>
      <circle cx="7" cy="7" r="4.5" />
      <path d="m13.5 13.5-3-3" />
    </svg>
  ),
  Cart: (props = {}) => (
    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinejoin="round" {...props}>
      <path d="M2 3h2.5l2.5 11h9l2-7H6" />
      <circle cx="8" cy="17" r="1.2" fill="currentColor" />
      <circle cx="15" cy="17" r="1.2" fill="currentColor" />
    </svg>
  ),
  User: (props = {}) => (
    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round" {...props}>
      <circle cx="10" cy="6.5" r="3" />
      <path d="M3.5 17c0-3.5 3-6 6.5-6s6.5 2.5 6.5 6" />
    </svg>
  ),
  Heart: (props = {}) => (
    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinejoin="round" {...props}>
      <path d="M10 17s-7-4.5-7-9.5A4 4 0 0 1 10 5a4 4 0 0 1 7 2.5C17 12.5 10 17 10 17z" />
    </svg>
  ),
  Check: (props = {}) => (
    <svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...props}>
      <path d="m3 8 3.5 3.5L13 5" />
    </svg>
  ),
  Truck: (props = {}) => (
    <svg width="22" height="22" viewBox="0 0 22 22" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinejoin="round" {...props}>
      <path d="M2 5h11v10H2zM13 8h4l3 3v4h-7z" />
      <circle cx="6" cy="17" r="1.5" />
      <circle cx="16" cy="17" r="1.5" />
    </svg>
  ),
  Shield: (props = {}) => (
    <svg width="22" height="22" viewBox="0 0 22 22" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinejoin="round" {...props}>
      <path d="M11 2.5 3.5 5v6c0 4 3 7.5 7.5 9 4.5-1.5 7.5-5 7.5-9V5z" />
      <path d="m8 11 2 2 4-4" strokeLinecap="round" />
    </svg>
  ),
  Tool: (props = {}) => (
    <svg width="22" height="22" viewBox="0 0 22 22" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinejoin="round" strokeLinecap="round" {...props}>
      <path d="M14.5 4a4 4 0 0 0-4 4 4 4 0 0 0 .5 2L3 17l2 2 7-8c.6.3 1.3.5 2 .5a4 4 0 0 0 4-4c0-.7-.2-1.3-.5-2l-2 2-2-1-1-2z" />
    </svg>
  ),
  Headset: (props = {}) => (
    <svg width="22" height="22" viewBox="0 0 22 22" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinejoin="round" {...props}>
      <path d="M3 12v-1a8 8 0 0 1 16 0v1" />
      <rect x="3" y="12" width="4" height="6" rx="1" />
      <rect x="15" y="12" width="4" height="6" rx="1" />
      <path d="M19 18c0 1.5-1.5 3-4 3" />
    </svg>
  ),
  Reload: (props = {}) => (
    <svg width="14" height="14" viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round" {...props}>
      <path d="M2.5 8a5.5 5.5 0 0 1 9.5-3.8L13.5 3v3.5H10" />
      <path d="M13.5 8a5.5 5.5 0 0 1-9.5 3.8L2.5 13v-3.5H6" />
    </svg>
  ),
  Reset: (props = {}) => (
    <svg width="14" height="14" viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.6" {...props}>
      <circle cx="8" cy="8" r="5.5" />
      <circle cx="8" cy="8" r="1.5" fill="currentColor" />
    </svg>
  ),
  Phone: (props = {}) => (
    <svg width="14" height="14" viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinejoin="round" {...props}>
      <path d="M3 4a1 1 0 0 1 1-1h2l1 3-1.5 1c.5 1.5 2 3 3.5 3.5l1-1.5 3 1v2a1 1 0 0 1-1 1A9 9 0 0 1 3 4z" />
    </svg>
  ),
  Tag: (props = {}) => (
    <svg width="14" height="14" viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinejoin="round" {...props}>
      <path d="M2.5 2.5h5l6 6-5 5-6-6z" />
      <circle cx="5" cy="5" r="0.8" fill="currentColor" />
    </svg>
  ),
  Globe: (props = {}) => (
    <svg width="14" height="14" viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.6" {...props}>
      <circle cx="8" cy="8" r="5.5" />
      <path d="M2.5 8h11M8 2.5c2 1.5 3 4 3 5.5s-1 4-3 5.5M8 2.5c-2 1.5-3 4-3 5.5s1 4 3 5.5" />
    </svg>
  ),
  Grid: (props = {}) => (
    <svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.5" {...props}>
      <rect x="2" y="2" width="5" height="5" /><rect x="9" y="2" width="5" height="5" />
      <rect x="2" y="9" width="5" height="5" /><rect x="9" y="9" width="5" height="5" />
    </svg>
  ),
  List: (props = {}) => (
    <svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" {...props}>
      <path d="M2 4h12M2 8h12M2 12h12" />
    </svg>
  ),
  Arrow: (props = {}) => (
    <svg width="14" height="14" viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" {...props}>
      <path d="M3 8h10M9 4l4 4-4 4" />
    </svg>
  ),
  Plus: (props = {}) => (
    <svg width="14" height="14" viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" {...props}>
      <path d="M8 3v10M3 8h10" />
    </svg>
  ),
  Star: (props = {}) => (
    <svg width="14" height="14" viewBox="0 0 16 16" fill="currentColor" {...props}>
      <path d="m8 1.5 2 4.5 5 .5-3.7 3.3 1.2 4.7L8 12l-4.5 2.5L4.7 9.8 1 6.5l5-.5z" />
    </svg>
  ),
  // Brand logos (placeholders)
  Bosch: (props = {}) => <svg viewBox="0 0 60 24" {...props}><text x="30" y="17" fontFamily="Oswald, sans-serif" fontWeight="700" fontSize="18" textAnchor="middle" fill="currentColor">BOSCH</text></svg>,
  Brembo: (props = {}) => <svg viewBox="0 0 70 24" {...props}><text x="35" y="17" fontFamily="Oswald, sans-serif" fontWeight="700" fontSize="18" textAnchor="middle" fill="currentColor">BREMBO</text></svg>,
  NGK: (props = {}) => <svg viewBox="0 0 50 24" {...props}><text x="25" y="17" fontFamily="Oswald, sans-serif" fontWeight="700" fontSize="18" textAnchor="middle" fill="currentColor">NGK</text></svg>,
  Mann: (props = {}) => <svg viewBox="0 0 60 24" {...props}><text x="30" y="17" fontFamily="Oswald, sans-serif" fontWeight="700" fontSize="18" textAnchor="middle" fill="currentColor">MANN</text></svg>,
  Varta: (props = {}) => <svg viewBox="0 0 60 24" {...props}><text x="30" y="17" fontFamily="Oswald, sans-serif" fontWeight="700" fontSize="18" textAnchor="middle" fill="currentColor">VARTA</text></svg>,
  Bilstein: (props = {}) => <svg viewBox="0 0 80 24" {...props}><text x="40" y="17" fontFamily="Oswald, sans-serif" fontWeight="700" fontSize="18" textAnchor="middle" fill="currentColor">BILSTEIN</text></svg>,
};

// Map category → icon component (keys match the 10 service-parts categories)
const CategoryIcons = {
  "Oil & filters":                       Icons.Filtration,
  "Brake parts":                         Icons.Braking,
  "Tyres":                               Icons.Wheels,
  "Bulbs / lighting":                    Icons.Lighting,
  "Wiper & screenwash items":            Icons.Visibility,
  "Batteries":                           Icons.Electrical,
  "Suspension parts":                    Icons.Suspension,
  "Ignition/service ignition parts":     Icons.Ignition,
  "Belts & pulleys":                     Icons.Fluids,       // reused — no dedicated belt icon
  "Exhaust / emissions parts":           Icons.Exhaust,
};

// Map part id → brand for variety (deterministic from id hash)
const PartBrands = {
  "brake-disc": "Brembo",
  "brake-pad": "Brembo",
  "oil-filter": "Mann",
  "air-filter": "Mann",
  "cabin-filter": "Mann",
  "spark-plug": "NGK",
  "battery": "Varta",
  "alternator": "Bosch",
  "starter-motor": "Bosch",
  "bulb": "Osram",
  "wiper-blade": "Bosch",
  "tire": "Michelin",
  "suspension-spring": "Bilstein",
  "exhaust-muffler": "Bosal",
  "brake-fluid": "ATE",
  "coolant": "Castrol",
  "screen-wash": "Holts",
};

window.Icons = Icons;
window.CategoryIcons = CategoryIcons;
window.PartBrands = PartBrands;
