/* Cordish Plaza — shared UI components + inline Lucide-style icons.
   Exports to window so other babel scripts can use them. */

const PLAZA_ICONS = {
  "arrow-right": '<path d="M5 12h14"/><path d="m12 5 7 7-7 7"/>',
  "map-pin": '<path d="M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0Z"/><circle cx="12" cy="10" r="3"/>',
  "store": '<path d="m2 7 4.41-4.41A2 2 0 0 1 7.83 2h8.34a2 2 0 0 1 1.42.59L22 7"/><path d="M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8"/><path d="M15 22v-4a2 2 0 0 0-2-2h-2a2 2 0 0 0-2 2v4"/><path d="M2 7h20"/><path d="M22 7v3a2 2 0 0 1-2 2 2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 16 12a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 12 12a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 8 12a2.7 2.7 0 0 1-1.59-.63.7.7 0 0 0-.82 0A2.7 2.7 0 0 1 4 12a2 2 0 0 1-2-2V7"/>',
  "ruler": '<path d="M21.3 15.3a2.4 2.4 0 0 1 0 3.4l-2.6 2.6a2.4 2.4 0 0 1-3.4 0L2.7 8.7a2.41 2.41 0 0 1 0-3.4l2.6-2.6a2.41 2.41 0 0 1 3.4 0Z"/><path d="m14.5 12.5 2-2"/><path d="m11.5 9.5 2-2"/><path d="m8.5 6.5 2-2"/><path d="m17.5 15.5 2-2"/>',
  "banknote": '<rect width="20" height="12" x="2" y="6" rx="2"/><circle cx="12" cy="12" r="2"/><path d="M6 12h.01M18 12h.01"/>',
  "droplets": '<path d="M7 16.3c2.2 0 4-1.83 4-4.05 0-1.16-.57-2.26-1.71-3.19S7.29 4.8 7 3.51c-.29 1.29-1.43 2.86-2.57 3.81S2.71 9.71 2.71 10.86c0 2.22 1.79 4.05 4 4.05Z"/><path d="M12.56 6.6A10.97 10.97 0 0 0 14 3.02c.5 2.5 2 4.9 4 6.5s3 3.5 3 5.5a6.98 6.98 0 0 1-11.91 4.97"/>',
  "zap": '<path d="M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z"/>',
  "shield-check": '<path d="M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1Z"/><path d="m9 12 2 2 4-4"/>',
  "sparkles": '<path d="M9.937 15.5A2 2 0 0 0 8.5 14.063l-6.135-1.582a.5.5 0 0 1 0-.962L8.5 9.936A2 2 0 0 0 9.937 8.5l1.582-6.135a.5.5 0 0 1 .963 0L14.063 8.5A2 2 0 0 0 15.5 9.937l6.135 1.581a.5.5 0 0 1 0 .964L15.5 14.063a2 2 0 0 0-1.437 1.437l-1.582 6.135a.5.5 0 0 1-.963 0z"/><path d="M20 3v4"/><path d="M22 5h-4"/><path d="M4 17v2"/><path d="M5 18H3"/>',
  "trees": '<path d="M10 10v.2A3 3 0 0 1 8.9 16H5a3 3 0 0 1-1-5.8V10a3 3 0 0 1 6 0Z"/><path d="M7 16v6"/><path d="M13 19v3"/><path d="M12 19h8.3a1 1 0 0 0 .7-1.7L18 14h.3a1 1 0 0 0 .7-1.7L16 9h.2a1 1 0 0 0 .8-1.7L13 3l-1.4 1.5"/>',
  "pill": '<path d="m10.5 20.5 10-10a4.95 4.95 0 1 0-7-7l-10 10a4.95 4.95 0 1 0 7 7Z"/><path d="m8.5 8.5 7 7"/>',
  "hammer": '<path d="m15 12-8.373 8.373a1 1 0 1 1-3-3L12 9"/><path d="m18 15 4-4"/><path d="m21.5 11.5-1.914-1.914A2 2 0 0 1 19 8.172V7l-2.26-2.26a6 6 0 0 0-4.202-1.756L9 2.96l.92.82A6.18 6.18 0 0 1 12 8.4V10l2 2h1.172a2 2 0 0 1 1.414.586L18.5 14.5"/>',
  "cup-soda": '<path d="m6 8 1.75 12.28a2 2 0 0 0 2 1.72h4.54a2 2 0 0 0 2-1.72L18 8"/><path d="M5 8h14"/><path d="M7 15a6.47 6.47 0 0 1 5 0 6.47 6.47 0 0 0 5 0"/><path d="m12 8 1-6h2"/>',
  "cookie": '<path d="M12 2a10 10 0 1 0 10 10 4 4 0 0 1-5-5 4 4 0 0 1-5-5"/><path d="M8.5 8.5v.01"/><path d="M16 15.5v.01"/><path d="M12 12v.01"/><path d="M11 17v.01"/><path d="M7 14v.01"/>',
  "check": '<path d="M20 6 9 17l-5-5"/>',
  "phone": '<path d="M13.832 16.568a1 1 0 0 0 1.213-.303l.355-.465A2 2 0 0 1 17 15h3a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2A18 18 0 0 1 2 4a2 2 0 0 1 2-2h3a2 2 0 0 1 2 2v3a2 2 0 0 1-.8 1.6l-.468.351a1 1 0 0 0-.292 1.233 14 14 0 0 0 6.392 6.384"/>',
  "message-circle": '<path d="M7.9 20A9 9 0 1 0 4 16.1L2 22Z"/>',
  "mail": '<path d="m22 7-8.991 5.727a2 2 0 0 1-2.009 0L2 7"/><rect x="2" y="4" width="20" height="16" rx="2"/>',
  "building-2": '<path d="M6 22V4a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v18Z"/><path d="M6 12H4a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h2"/><path d="M18 9h2a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-2"/><path d="M10 6h4"/><path d="M10 10h4"/><path d="M10 14h4"/><path d="M10 18h4"/>',
  "key-round": '<path d="M2.586 17.414A2 2 0 0 0 2 18.828V21a1 1 0 0 0 1 1h3a1 1 0 0 0 1-1v-1a1 1 0 0 1 1-1h1a1 1 0 0 0 1-1v-1a1 1 0 0 1 1-1h.172a2 2 0 0 0 1.414-.586l.814-.814a6.5 6.5 0 1 0-4-4z"/><circle cx="16.5" cy="7.5" r=".5" fill="currentColor"/>',
  "filter": '<polygon points="22 3 2 3 10 12.46 10 19 14 21 14 12.46 22 3"/>',
  "send": '<path d="M14.536 21.686a.5.5 0 0 0 .937-.024l6.5-19a.496.496 0 0 0-.635-.635l-19 6.5a.5.5 0 0 0-.024.937l7.93 3.18a2 2 0 0 1 1.112 1.11z"/><path d="m21.854 2.147-10.94 10.939"/>',
  "scaling": '<path d="M12 3H5a2 2 0 0 0-2 2v14"/><path d="M21 12v7a2 2 0 0 1-2 2h-7"/><path d="M16 3h5v5"/><path d="M21 3 8 16"/>',
  "users": '<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"/>'
};

function Icon({ name, size = 22, style }) {
  return React.createElement("svg", {
    width: size, height: size, viewBox: "0 0 24 24",
    fill: "none", stroke: "currentColor", strokeWidth: 1.8,
    strokeLinecap: "round", strokeLinejoin: "round",
    style, "aria-hidden": "true",
    dangerouslySetInnerHTML: { __html: PLAZA_ICONS[name] || "" }
  });
}

function DS() { return window.CordishGroupDesignSystem_93cd80 || {}; }

/* Btn — delegates to the DS Button for real buttons; renders a DS-styled <a> for links. */
const BTN_SIZES = { sm: { padding: "8px 16px", fontSize: 13 }, md: { padding: "11px 22px", fontSize: 14 }, lg: { padding: "14px 28px", fontSize: 15 } };
const BTN_VARIANTS = {
  primary: { background: "var(--cd-purple)", color: "#fff", border: "1px solid var(--cd-purple)" },
  secondary: { background: "transparent", color: "var(--cd-purple)", border: "1px solid var(--cd-purple)" },
  gold: { background: "var(--cd-gold)", color: "#fff", border: "1px solid var(--cd-gold)" }
};
function Btn({ variant = "primary", size, href, onClick, icon, iconRight, children, block, type, style }) {
  const dsSize = size === "sm" ? "sm" : (size === "lg" ? "lg" : "md");
  const iSz = size === "sm" ? 16 : 18;
  const il = icon ? React.createElement(Icon, { name: icon, size: iSz }) : null;
  const ir = iconRight ? React.createElement(Icon, { name: iconRight, size: iSz }) : null;
  const extra = block ? { width: "100%" } : {};
  if (href) {
    return React.createElement("a", {
      href, onClick, className: "btn",
      style: { ...BTN_SIZES[dsSize], ...BTN_VARIANTS[variant], ...extra, ...style }
    }, il, React.createElement("span", null, children), ir);
  }
  const Button = DS().Button;
  if (Button) return React.createElement(Button, { variant, size: dsSize, iconLeft: il, iconRight: ir, onClick, type: type || "button", style: { ...extra, ...style } }, children);
  return React.createElement("button", { className: "btn", onClick, type: type || "button", style: { ...BTN_SIZES[dsSize], ...BTN_VARIANTS[variant], ...extra, ...style } }, il, children, ir);
}

/* IconChip — DS circular line-icon badge. tone: purple | gold | teal.
   Fallback honors the tone so the gold + teal accents show without the DS bundle. */
const CHIP_TONES = { purple: "var(--cd-purple)", gold: "var(--cd-gold)", teal: "var(--cd-teal)" };
function IconChip({ tone = "purple", solid = false, size = "md", icon, style }) {
  const child = React.createElement(Icon, { name: icon, size: size === "sm" ? 19 : 26 });
  const Chip = DS().IconChip;
  if (Chip) return React.createElement(Chip, { tone, solid, size, style }, child);
  const c = CHIP_TONES[tone] || CHIP_TONES.purple;
  const dim = size === "sm" ? 38 : 56;
  return React.createElement("div", { style: { width: dim, height: dim, borderRadius: "50%", display: "grid", placeItems: "center", flex: "none", border: "2px solid " + c, color: solid ? "#fff" : c, background: solid ? c : "transparent", ...style } }, child);
}

/* Badge — DS pill label. tone: purple | gold | teal | neutral; variant: subtle | solid.
   Fallback honors the tone so chips read in their accent colour without the DS bundle. */
const BADGE_TONES = {
  purple:  { sub: { bg: "var(--cd-purple-100)", fg: "var(--cd-purple-700)" }, solid: { bg: "var(--cd-purple)", fg: "#fff" } },
  gold:    { sub: { bg: "var(--cd-gold-100)",   fg: "var(--cd-gold-700)" },   solid: { bg: "var(--cd-gold)",   fg: "#fff" } },
  teal:    { sub: { bg: "var(--cd-teal-100)",   fg: "var(--cd-teal-700)" },   solid: { bg: "var(--cd-teal)",   fg: "#fff" } },
  neutral: { sub: { bg: "#EFEFF2",              fg: "var(--cd-muted)" },      solid: { bg: "var(--cd-muted)",  fg: "#fff" } }
};
function Badge({ tone = "purple", variant = "subtle", children, style }) {
  const B = DS().Badge;
  if (B) return React.createElement(B, { tone, variant, style }, children);
  const t = (BADGE_TONES[tone] || BADGE_TONES.purple)[variant === "solid" ? "solid" : "sub"];
  return React.createElement("span", { style: { display: "inline-flex", alignItems: "center", gap: 6, padding: "4px 12px", borderRadius: "var(--radius-pill)", fontFamily: "var(--font-head)", fontWeight: 600, fontSize: 12, background: t.bg, color: t.fg, ...style } }, children);
}

/* SectionHead — the signature DS SectionHeader (uppercase title + gold underline) */
function SectionHead({ eyebrow, title, sub, onDark, align, style }) {
  const SH = DS().SectionHeader;
  if (SH) return React.createElement(SH, { eyebrow, title, sub, onDark, align, style });
  return React.createElement("div", { style },
    eyebrow ? React.createElement("div", { className: "eyebrow", style: { marginBottom: 10 } }, eyebrow) : null,
    React.createElement("h2", { style: { fontSize: 26, textTransform: "uppercase", letterSpacing: ".04em" } }, title),
    React.createElement("div", { style: { width: 48, height: 2, background: "var(--cd-gold)", marginTop: 12 } }),
    sub ? React.createElement("p", { style: { marginTop: 14, color: "var(--cd-muted)" } }, sub) : null
  );
}

function fmt(n) { return n.toLocaleString("en-US"); }

Object.assign(window, { Icon, Btn, IconChip, Badge, SectionHead, fmt });
