// Shared icons + small UI helpers
const Icon = {
  Dashboard: () => <svg viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.4"><rect x="2" y="2" width="5" height="5" rx="0.5"/><rect x="9" y="2" width="5" height="5" rx="0.5"/><rect x="2" y="9" width="5" height="5" rx="0.5"/><rect x="9" y="9" width="5" height="5" rx="0.5"/></svg>,
  Building: () => <svg viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.4"><path d="M3 14V3l5-1.5L13 3v11M3 14h10M6 5h0M10 5h0M6 8h0M10 8h0M6 11h0M10 11h0" strokeLinecap="round"/></svg>,
  Users: () => <svg viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.4"><circle cx="6" cy="5.5" r="2.5"/><path d="M2 13.5c0-2.2 1.8-4 4-4s4 1.8 4 4M11 6.5a2 2 0 100-4M14 13c0-1.8-1.3-3.3-3-3.7" strokeLinecap="round"/></svg>,
  Calendar: () => <svg viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.4"><rect x="2" y="3.5" width="12" height="10.5" rx="1"/><path d="M5 2v3M11 2v3M2 7h12" strokeLinecap="round"/></svg>,
  Chart: () => <svg viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.4"><path d="M2 14h12M4 11V7M7 11V4M10 11V8M13 11V6" strokeLinecap="round"/></svg>,
  Doc: () => <svg viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.4"><path d="M3.5 2h6L13 5.5V14H3.5V2z M9.5 2v3.5H13M5.5 8h5M5.5 10.5h5M5.5 6h2" strokeLinecap="round" strokeLinejoin="round"/></svg>,
  Wrench: () => <svg viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.4"><path d="M9.5 2.5a3 3 0 014 4l-1-1-1.5 1.5-1.5-1.5L11 4l-1-1-.5-.5zM3 13l5.5-5.5M2.5 13.5l1.5-1.5" strokeLinecap="round" strokeLinejoin="round"/></svg>,
  Plus: () => <svg viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.5"><path d="M8 3v10M3 8h10" strokeLinecap="round"/></svg>,
  Search: () => <svg viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.4"><circle cx="7" cy="7" r="4.5"/><path d="M10.5 10.5L13.5 13.5" strokeLinecap="round"/></svg>,
  ChevronRight: () => <svg viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.4"><path d="M6 3l5 5-5 5" strokeLinecap="round" strokeLinejoin="round"/></svg>,
  ChevronDown: () => <svg viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.4"><path d="M3 6l5 5 5-5" strokeLinecap="round" strokeLinejoin="round"/></svg>,
  Upload: () => <svg viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.4"><path d="M8 11V3M8 3L5 6M8 3l3 3M3 11v2h10v-2" strokeLinecap="round" strokeLinejoin="round"/></svg>,
  Settings: () => <svg viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.4"><circle cx="8" cy="8" r="2"/><path d="M8 1v2M8 13v2M3.5 3.5l1.4 1.4M11.1 11.1l1.4 1.4M1 8h2M13 8h2M3.5 12.5l1.4-1.4M11.1 4.9l1.4-1.4" strokeLinecap="round"/></svg>,
  Address: () => <svg viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.4"><rect x="3" y="2.5" width="10" height="11" rx="0.5"/><circle cx="8" cy="7" r="1.5"/><path d="M5.5 11c.4-1.2 1.4-2 2.5-2s2.1.8 2.5 2M2 5h1M2 8h1M2 11h1" strokeLinecap="round"/></svg>,
  Mail: () => <svg viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.4"><rect x="2" y="3.5" width="12" height="9" rx="0.8"/><path d="M2.5 4.5L8 9l5.5-4.5" strokeLinecap="round" strokeLinejoin="round"/></svg>,
  Sparkle: () => <svg viewBox="0 0 16 16" fill="currentColor"><path d="M8 1.5l1.2 3.9 3.9 1.2-3.9 1.2-1.2 3.9-1.2-3.9-3.9-1.2 3.9-1.2L8 1.5zM12.5 10l.5 1.5 1.5.5-1.5.5-.5 1.5-.5-1.5-1.5-.5 1.5-.5.5-1.5z"/></svg>,
};

// Currency formatter
const fmtEUR = (n) => new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR', maximumFractionDigits: 0 }).format(n);
const fmtEUR2 = (n) => new Intl.NumberFormat('de-DE', { style: 'currency', currency: 'EUR' }).format(n);
const fmtNum = (n) => new Intl.NumberFormat('de-DE').format(n);
const fmtDate = (s) => {
  const d = new Date(s);
  return d.toLocaleDateString('de-DE', { day: '2-digit', month: 'short', year: 'numeric' });
};
const fmtDateShort = (s) => {
  const d = new Date(s);
  return d.toLocaleDateString('de-DE', { day: '2-digit', month: '2-digit', year: '2-digit' });
};

function Pill({ children, tone = "default" }) {
  return (
    <span className={`pill ${tone}`}>
      <span className="pill-dot"></span>
      {children}
    </span>
  );
}

function StatusPill({ status }) {
  if (status === "vermietet") return <Pill tone="pos">Vermietet</Pill>;
  if (status === "leerstand") return <Pill tone="neg">Leerstand</Pill>;
  if (status === "kündigung") return <Pill tone="warn">Kündigung</Pill>;
  return <Pill>{status}</Pill>;
}

Object.assign(window, { Icon, fmtEUR, fmtEUR2, fmtNum, fmtDate, fmtDateShort, Pill, StatusPill });
