/* Shared assets, icons, data and primitives for all BoatsFun homepage directions. */

// ============ ICONS (inline SVG, stroke based) ============
const I = {
  search:  (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><circle cx="11" cy="11" r="7"/><path d="m20 20-3.5-3.5"/></svg>,
  shield:  (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><path d="M12 2 4 5v6c0 5 3.5 9 8 11 4.5-2 8-6 8-11V5l-8-3Z"/><path d="m9 12 2 2 4-4"/></svg>,
  spark:   (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...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"/></svg>,
  tag:     (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><path d="M3 12V4a1 1 0 0 1 1-1h8l9 9-9 9-9-9Z"/><circle cx="8" cy="8" r="1.5"/></svg>,
  fleet:   (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><path d="M3 16h18l-2 4H5l-2-4Z"/><path d="M5 16V8l7-4 7 4v8"/><path d="M12 4v12"/></svg>,
  headset: (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><path d="M4 14v-2a8 8 0 1 1 16 0v2"/><rect x="3" y="14" width="4" height="6" rx="1.5"/><rect x="17" y="14" width="4" height="6" rx="1.5"/></svg>,
  refund:  (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><circle cx="12" cy="12" r="9"/><path d="M8 12h8M12 8v8"/></svg>,
  users:   (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><path d="M9 11a4 4 0 1 0 0-8 4 4 0 0 0 0 8Z"/><path d="M2 21v-1a6 6 0 0 1 6-6h2a6 6 0 0 1 6 6v1"/><path d="M16 3.5a4 4 0 0 1 0 7.5"/><path d="M22 21v-1a6 6 0 0 0-4-5.66"/></svg>,
  ruler:   (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><path d="m3 17 14-14 4 4L7 21l-4-4Z"/><path d="m6 14 2 2M9 11l2 2M12 8l2 2M15 5l2 2"/></svg>,
  bolt:    (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><path d="M13 2 4 14h7l-1 8 9-12h-7l1-8Z"/></svg>,
  arrow:   (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><path d="M5 12h14M13 6l6 6-6 6"/></svg>,
  phone:   (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><path d="M22 17v3a2 2 0 0 1-2.2 2 19.7 19.7 0 0 1-8.6-3.1 19.4 19.4 0 0 1-6-6A19.7 19.7 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.3 1.8.6 2.6a2 2 0 0 1-.5 2.1L7.9 9.7a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.5c.8.3 1.7.5 2.6.6a2 2 0 0 1 1.7 2Z"/></svg>,
  globe:   (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><circle cx="12" cy="12" r="9"/><path d="M3 12h18M12 3a14 14 0 0 1 0 18M12 3a14 14 0 0 0 0 18"/></svg>,
  pin:     (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><path d="M12 22s8-7.5 8-13a8 8 0 1 0-16 0c0 5.5 8 13 8 13Z"/><circle cx="12" cy="9" r="3"/></svg>,
  cal:     (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M3 9h18M8 3v4M16 3v4"/></svg>,
  clock:   (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2"/></svg>,
  user:    (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><path d="M20 21v-1a8 8 0 0 0-16 0v1"/><circle cx="12" cy="8" r="5"/></svg>,
  star:    (p={}) => <svg viewBox="0 0 24 24" fill="currentColor" {...p}><path d="m12 2 3 7 7 .6-5.3 4.6L18.5 22 12 18l-6.5 4 1.8-7.8L2 9.6 9 9l3-7Z"/></svg>,
  heart:   (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><path d="M12 21s-8-5-8-12a5 5 0 0 1 8-4 5 5 0 0 1 8 4c0 7-8 12-8 12Z"/></svg>,
  check:   (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="3" strokeLinecap="round" strokeLinejoin="round" {...p}><path d="m5 12 5 5L20 7"/></svg>,
  mail:    (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><rect x="3" y="5" width="18" height="14" rx="2"/><path d="m3 7 9 7 9-7"/></svg>,
  sun:     (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><circle cx="12" cy="12" r="4"/><path d="M12 3v2M12 19v2M3 12h2M19 12h2M5.6 5.6l1.4 1.4M17 17l1.4 1.4M5.6 18.4 7 17M17 7l1.4-1.4"/></svg>,
  wave:    (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><path d="M2 8c2 0 3-2 5-2s3 2 5 2 3-2 5-2 3 2 5 2"/><path d="M2 14c2 0 3-2 5-2s3 2 5 2 3-2 5-2 3 2 5 2"/><path d="M2 20c2 0 3-2 5-2s3 2 5 2 3-2 5-2 3 2 5 2"/></svg>,
  anchor:  (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><circle cx="12" cy="5" r="2"/><path d="M12 22V7M5 12h14M5 12c0 5 3 9 7 9s7-4 7-9"/></svg>,
  compass: (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><circle cx="12" cy="12" r="9"/><path d="m15 9-2 6-4 0 2-6 4 0Z"/></svg>,
  camera:  (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><path d="M3 8h3l2-3h8l2 3h3a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2v-9a2 2 0 0 1 2-2Z"/><circle cx="12" cy="13" r="4"/></svg>,
  fb:      (p={}) => <svg viewBox="0 0 24 24" fill="currentColor" {...p}><path d="M13 22v-8h3l1-4h-4V7c0-1 .5-2 2-2h2V1.2A22 22 0 0 0 13.7 1C10.8 1 9 2.8 9 5.8V10H6v4h3v8h4Z"/></svg>,
  ig:      (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><rect x="3" y="3" width="18" height="18" rx="5"/><circle cx="12" cy="12" r="4"/><circle cx="17.5" cy="6.5" r="1" fill="currentColor"/></svg>,
  yt:      (p={}) => <svg viewBox="0 0 24 24" fill="currentColor" {...p}><path d="M23 12s0-3.6-.5-5.3a2.8 2.8 0 0 0-2-2C18.8 4 12 4 12 4s-6.8 0-8.5.7a2.8 2.8 0 0 0-2 2C1 8.4 1 12 1 12s0 3.6.5 5.3a2.8 2.8 0 0 0 2 2c1.7.7 8.5.7 8.5.7s6.8 0 8.5-.7a2.8 2.8 0 0 0 2-2C23 15.6 23 12 23 12ZM10 15.5v-7l6 3.5-6 3.5Z"/></svg>,
  tt:      (p={}) => <svg viewBox="0 0 24 24" fill="currentColor" {...p}><path d="M17 3v3.4A5.6 5.6 0 0 0 21 8v3a8.6 8.6 0 0 1-4-1v6a6 6 0 1 1-6-6v3a3 3 0 1 0 3 3V3h3Z"/></svg>,
  arrowR:  (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5" strokeLinecap="round" strokeLinejoin="round" {...p}><path d="m9 6 6 6-6 6"/></svg>,
  arrowL:  (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5" strokeLinecap="round" strokeLinejoin="round" {...p}><path d="m15 6-6 6 6 6"/></svg>,
  plus:    (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><path d="M12 5v14M5 12h14"/></svg>,
  filter:  (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><path d="M3 5h18M6 12h12M10 19h4"/></svg>,
  diamond: (p={}) => <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" {...p}><path d="M6 3h12l3 5-9 13L3 8l3-5Z"/><path d="M3 8h18M12 3 8 8l4 13 4-13-4-5Z"/></svg>,
};

// ============ BOAT DATA ============
const BOATS = [
  { name: "Ponton Sun Tracker 20", type: "Ponton", loc: "Cannes, FR",     pers: 10, ft: "20 ft", hp: "250 HP", price: 350, rating: 4.9, reviews: 28, badge: "NOUVEAU", img: "https://images.unsplash.com/photo-1605281317010-fe5ffe798166?w=1200&q=80&auto=format&fit=crop" },
  { name: "Sea Ray Sundancer 320", type: "Cruiser", loc: "Saint-Tropez",  pers:  8, ft: "32 ft", hp: "600 HP", price: 850, rating: 4.8, reviews: 41, badge: "TOP",       img: "https://images.unsplash.com/photo-1567899378494-47b22a2ae96a?w=1200&q=80&auto=format&fit=crop" },
  { name: "Boston Whaler 270",     type: "Speedboat", loc: "Nice",         pers:  9, ft: "27 ft", hp: "400 HP", price: 650, rating: 4.9, reviews: 19, badge: "NOUVEAU", img: "https://images.unsplash.com/photo-1542384557-0824d90731ee?w=1200&q=80&auto=format&fit=crop&sat=-10" },
  { name: "Bayliner VR6",          type: "Bowrider",  loc: "Marseille",    pers: 10, ft: "23 ft", hp: "250 HP", price: 450, rating: 4.7, reviews: 53, badge: null,       img: "https://images.unsplash.com/photo-1473116763249-2faaef81ccda?w=1200&q=80&auto=format&fit=crop" },
  { name: "Azimut 50 Fly",         type: "Yacht",     loc: "Monaco",       pers: 12, ft: "50 ft", hp: "1000 HP", price: 1600, rating: 5.0, reviews: 12, badge: "PREMIUM", img: "https://images.unsplash.com/photo-1540541338287-41700207dee6?w=1200&q=80&auto=format&fit=crop" },
  { name: "Beneteau Antares 8",    type: "Cruiser",   loc: "Antibes",      pers:  6, ft: "26 ft", hp: "200 HP", price: 380, rating: 4.8, reviews: 34, badge: null,       img: "https://images.unsplash.com/photo-1542384557-0824d90731ee?w=1200&q=80&auto=format&fit=crop" },
];

const HERO_IMG       = "https://images.unsplash.com/photo-1567899378494-47b22a2ae96a?w=1800&q=80&auto=format&fit=crop";
const LIFESTYLE_IMG  = "https://images.unsplash.com/photo-1530541930197-ff16ac917b0e?w=1600&q=80&auto=format&fit=crop";
const EXP_IMGS = [
  "https://images.unsplash.com/photo-1502920514313-52581002a659?w=900&q=80&auto=format&fit=crop", // people jumping
  "https://images.unsplash.com/photo-1518176258769-f227c798150e?w=900&q=80&auto=format&fit=crop", // aerial turquoise
  "https://images.unsplash.com/photo-1502082553048-f009c37129b9?w=900&q=80&auto=format&fit=crop", // sunset cockpit
];
const SUNSET_IMG     = "https://images.unsplash.com/photo-1469854523086-cc02fe5d8800?w=1800&q=80&auto=format&fit=crop";
const COAST_IMG      = "https://images.unsplash.com/photo-1507525428034-b723cf961d3e?w=1600&q=80&auto=format&fit=crop";
const DARK_IMG       = "https://images.unsplash.com/photo-1502082553048-f009c37129b9?w=1800&q=80&auto=format&fit=crop";

const TESTIMONIALS = [
  { name: "Thomas L.",  loc: "Montréal, Canada",  text: "Super service, bateau propre et en parfait état. On a passé une journée magique en famille.", rating: 5, img: "https://i.pravatar.cc/120?img=12" },
  { name: "Sophie M.",  loc: "Lyon, France",      text: "J'ai fait une offre et j'ai obtenu un super prix. Le processus est simple et rapide.",         rating: 5, img: "https://i.pravatar.cc/120?img=47" },
  { name: "Marc D.",    loc: "Nice, France",      text: "Équipe professionnelle et très disponible. Je recommande à 100%, on reviendra l'été prochain.", rating: 5, img: "https://i.pravatar.cc/120?img=33" },
  { name: "Elena R.",   loc: "Barcelone, ES",     text: "Le système d'offre m'a fait économiser 30%. Le propriétaire a été adorable. Expérience top.",    rating: 5, img: "https://i.pravatar.cc/120?img=23" },
];

const WHY = [
  { icon: "shield",  title: "Sécurisé",      desc: "Paiement protégé et dépôt remboursable en cas de refus de l'offre." },
  { icon: "bolt",    title: "Simple",        desc: "Réservez en quelques clics, ou faites une offre raisonnable en 60 sec." },
  { icon: "tag",     title: "Meilleur prix", desc: "Faites une offre et obtenez le tarif que vous voulez réellement payer." },
  { icon: "fleet",   title: "Grand choix",   desc: "Ponton, Yacht, Cruiser, Speedboat, voilier — toutes les catégories." },
  { icon: "headset", title: "Support 7/7",   desc: "Une équipe humaine disponible pour répondre du lundi au dimanche." },
  { icon: "refund",  title: "Remboursement", desc: "Dépôt intégralement remboursé si aucune offre n'est acceptée." },
];

const OFFER_STEPS = [
  { n: 1, title: "Choisissez",  desc: "un type de bateau, une date et une heure de sortie." },
  { n: 2, title: "Proposez",    desc: "votre budget — restez raisonnable pour maximiser vos chances." },
  { n: 3, title: "Payez le dépôt", desc: "sécurisé pour valider votre offre auprès du propriétaire." },
  { n: 4, title: "Confirmé",    desc: "un propriétaire accepte votre offre et confirme la sortie." },
];

const STATS = [
  { v: "+500",   l: "bateaux disponibles" },
  { v: "+10K",   l: "clients satisfaits" },
  { v: "+20",    l: "destinations" },
  { v: "100%",   l: "sécurisé" },
];

// ============ TYPE: Star Row ============
function Stars({ n = 5, color = "#FF8200", size = 14 }) {
  return <span style={{ display: "inline-flex", gap: 2, color }}>
    {Array.from({ length: n }, (_, i) => <I.star key={i} width={size} height={size} />)}
  </span>;
}

// ============ TYPE: Boat image w/ photo fallback gradient ============
function Photo({ src, alt = "", ratio = "4/3", radius = 14, style = {}, children, gradient = "linear-gradient(135deg,#002244,#00B5E2)", overlay }) {
  return (
    <div style={{
      position: "relative",
      aspectRatio: ratio,
      borderRadius: radius,
      overflow: "hidden",
      background: gradient,
      ...style,
    }}>
      {src && <img src={src} alt={alt} loading="lazy" style={{ position: "absolute", inset: 0, width: "100%", height: "100%", objectFit: "cover", display: "block" }} />}
      {overlay && <div style={{ position: "absolute", inset: 0, background: overlay, pointerEvents: "none" }} />}
      {children}
    </div>
  );
}

// ============ TYPE: Headers used across versions ============
const BRAND = { navy: "#002244", navyDark: "#001530", cyan: "#00B5E2", cyanDark: "#0091B5", cyanSoft: "#CCF1F9", orange: "#FF8200", orangeDark: "#E56F00", orangeSoft: "#FFE6CC", bg: "#F0F8FF", bgSoft: "#FFFFFF", bgStrong: "#E1ECF7", ink: "#111111", body: "#3A4A5A", muted: "#6B7A8C", hairline: "#D9E2EE", success: "#00A86B" };

// ============ NAVIGATION LOCALE vs PRODUCTION ============
// En production (boatsfun.com) le .htaccess gère les URLs propres : /bateaux
// En local (localhost / 127.0.0.1 / file://) il n'y a pas de .htaccess, donc on
// sert les fichiers .html directement : /bateaux.html
// Les hrefs restent écrits en URL propre partout ; ce helper les adapte à l'exécution.
const BF_IS_LOCAL =
  (typeof location !== "undefined") &&
  (/^(localhost|127\.0\.0\.1|0\.0\.0\.0|\[::1\])$/.test(location.hostname) ||
    location.protocol === "file:");

function bfToLocalUrl(href) {
  if (!BF_IS_LOCAL || typeof href !== "string") return href;
  // Laisser passer : externes, ancres pures, mailto/tel, et chemins déjà relatifs (non absolus)
  if (/^(https?:|mailto:|tel:|#)/i.test(href)) return href;
  if (!href.startsWith("/")) return href;
  // Découper path / (query|hash)
  const m = href.match(/^([^?#]*)([?#].*)?$/);
  const path = m[1] || "";
  const rest = m[2] || "";
  if (path === "/" || path === "") return href;     // racine → index.html servi par défaut
  if (/\.[a-z0-9]+$/i.test(path)) return href;        // déjà une extension (fichier)
  return path + ".html" + rest;
}

// Navigation programmatique (remplace window.location.href = "/xxx")
function bfNav(href) {
  window.location.href = bfToLocalUrl(href);
}

// Délégation globale : intercepte les clics sur les liens internes en local et
// réécrit /bateaux → /bateaux.html sans modifier le JSX de chaque page.
if (BF_IS_LOCAL && typeof document !== "undefined") {
  document.addEventListener("click", function (e) {
    if (e.defaultPrevented || e.button !== 0 || e.metaKey || e.ctrlKey || e.shiftKey || e.altKey) return;
    const a = e.target && e.target.closest ? e.target.closest("a[href]") : null;
    if (!a) return;
    const target = a.getAttribute("target");
    if (target && target !== "_self") return; // _blank, etc. → comportement natif
    const raw = a.getAttribute("href");
    const fixed = bfToLocalUrl(raw);
    if (fixed !== raw) {
      e.preventDefault();
      window.location.href = fixed;
    }
  }, true);
}

window.BF = { I, BOATS, HERO_IMG, LIFESTYLE_IMG, EXP_IMGS, SUNSET_IMG, COAST_IMG, DARK_IMG, TESTIMONIALS, WHY, OFFER_STEPS, STATS, Stars, Photo, BRAND, isLocal: BF_IS_LOCAL, toLocalUrl: bfToLocalUrl, nav: bfNav };
