/* Kontakt page: interactive Europe map → country contact popup,
   with a Germany detail view (PLZ search + HQ dots per licensee).
   Geographic data: window.GEO (geo-data.js). Props: lang, navigate */
(function () {
  const { useState, useMemo, useEffect } = React;
  const Icon = window.Icon;

  /* Flat colour flags (CSS only — stripes/cross, no emoji) */
  const FLAGS = {
    DE: 'linear-gradient(180deg,#000 0 33.33%,#DD0000 33.33% 66.66%,#FFCE00 66.66% 100%)',
    AT: 'linear-gradient(180deg,#C8102E 0 33.33%,#fff 33.33% 66.66%,#C8102E 66.66% 100%)',
    CH: 'linear-gradient(#fff,#fff) center/36% 16% no-repeat, linear-gradient(#fff,#fff) center/16% 36% no-repeat, #D52B1E',
    IT: 'linear-gradient(90deg,#008C45 0 33.33%,#fff 33.33% 66.66%,#CD212A 66.66% 100%)',
    ES: 'linear-gradient(180deg,#AA151B 0 25%,#F1BF00 25% 75%,#AA151B 75% 100%)',
  };
  const Flag = ({ c, style }) => React.createElement('span', {
    className: 'flagchip', title: c, 'aria-label': c,
    style: { background: FLAGS[c] || 'var(--gray-200)', ...style },
  });
  const flagOrChip = (id) => React.createElement(Flag, { c: id, style: { width: 24, height: 16 } });

  const Kontakt = ({ lang }) => {
    const t = (v) => window.tr(lang, v);
    const C = window.SITE.contact;
    const partners = window.SITE.partners;
    const plzMap = window.SITE.plzMap;
    const GEO = window.GEO;
    const byId = (id) => partners.find((p) => p.id === id);
    const logoOf = (id) => (window.SITE.logoStrip.find((l) => l.id === id) || {}).src;
    const EINSTEIN_LOGO = 'assets/logo-full.png';

    const [view, setView] = useState('europe');   // 'europe' | 'germany'
    const [modal, setModal] = useState(null);       // clicked country code
    const [hover, setHover] = useState(null);       // {name, x, y} hovered country tooltip
    const [active, setActive] = useState(null);     // selected German partner id
    const [plz, setPlz] = useState('');
    const [expanded, setExpanded] = useState(false);

    const deList = partners.filter((p) => p.country === 'DE');

    const plzResult = useMemo(() => {
      const m = /^(\d{5})$/.exec(plz.trim());
      if (!m) return undefined;
      const P = window.PLZ || {};
      for (const id of Object.keys(P)) {
        const s = P[id];
        for (let i = 0; i < s.length; i += 5) { if (s.slice(i, i + 5) === m[1]) return byId(id); }
      }
      return null;
    }, [plz]);

    /* PLZ hit highlights its partner on the Germany map */
    useEffect(() => { if (plzResult) setActive(plzResult.id); }, [plzResult]);

    /* Escape closes the popup */
    useEffect(() => {
      if (!modal) return;
      const onKey = (e) => { if (e.key === 'Escape') setModal(null); };
      window.addEventListener('keydown', onKey);
      return () => window.removeEventListener('keydown', onKey);
    }, [modal]);

    const clickCountry = (c) => {
      if (c.id === 'DE') { setView('germany'); window.scrollTo({ top: 0, behavior: 'smooth' }); return; }
      setModal(c.id);
    };

    /* ---------------------------------------------------------- Europe map */
    const onMove = (c, e) => {
      const box = e.currentTarget.closest('.geo').getBoundingClientRect();
      setHover({ name: c.name, role: c.id === 'DE' ? t({ de: 'Lizenzpartner', en: 'licence partner' }) : c.partner ? t({ de: 'Lizenzpartner', en: 'licence partner' }) : t({ de: 'Anfrage über Entwickler', en: 'enquiry via developer' }), x: e.clientX - box.left, y: e.clientY - box.top });
    };
    const MapSwitch = React.createElement('div', { className: 'geo__switch' },
      [['europe', 'Europa', 'Europe'], ['germany', 'Deutschland', 'Germany'], ['america', 'Amerika', 'America']].map(([v, de, en]) =>
        React.createElement('button', { key: v, type: 'button', className: 'geo__switch-btn' + (view === v ? ' is-active' : ''), onClick: () => { setView(v); setActive(null); setPlz(''); } }, t({ de, en }))));

    const EuropeMap = React.createElement('div', { className: 'mapwrap' },
      React.createElement('div', { className: 'geo' },
        MapSwitch,
        React.createElement('span', { className: 'geo__hint' }, t({ de: 'Europa · Lizenzgebiete', en: 'Europe · licence territories' })),
        React.createElement('svg', { className: 'geo__svg', viewBox: GEO.europe.viewBox, role: 'img', 'aria-label': t({ de: 'Interaktive Europakarte', en: 'Interactive Europe map' }), onMouseLeave: () => setHover(null) },
          GEO.europe.countries.map((c) => React.createElement('path', {
            key: c.id, d: c.d, vectorEffect: 'non-scaling-stroke',
            className: 'geo-country ' + (c.id === 'DE' ? 'geo-country--de' : c.partner ? 'geo-country--partner' : 'geo-country--plain'),
            onClick: () => clickCountry(c), role: 'button', tabIndex: 0,
            onMouseMove: (e) => onMove(c, e), onMouseEnter: (e) => onMove(c, e),
            onFocus: () => setHover({ name: c.name, role: '', x: -999, y: -999 }),
            onKeyDown: (e) => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); clickCountry(c); } },
          }, React.createElement('title', null, c.name))),
        ),
        hover && hover.x > -900 ? React.createElement('div', { className: 'geo-tip', style: { left: hover.x, top: hover.y } },
          React.createElement('span', { className: 'geo-tip__name' }, hover.name),
          hover.role ? React.createElement('span', { className: 'geo-tip__role' }, hover.role) : null) : null
      ),
      React.createElement('div', { className: 'geo-legend' },
        React.createElement('span', { className: 'geo-legend__item' }, React.createElement('span', { className: 'geo-legend__swatch geo-legend__swatch--partner' }), t({ de: 'Land mit Lizenzpartner', en: 'Country with a partner' })),
        React.createElement('span', { className: 'geo-legend__item' }, React.createElement('span', { className: 'geo-legend__swatch geo-legend__swatch--plain' }), t({ de: 'Anfrage über Entwickler', en: 'Enquiry via developer' })))
    );

    const amVB = GEO.america.viewBox.split(' ').map(Number);
    const amLeft = ((GEO.america.marker.x - amVB[0]) / amVB[2]) * 100;
    const amTop = ((GEO.america.marker.y - amVB[1]) / amVB[3]) * 100;
    const AmericaMap = React.createElement('div', { className: 'mapwrap' },
      React.createElement('div', { className: 'geo' },
        MapSwitch,
        React.createElement('span', { className: 'geo__hint' }, t({ de: 'Amerika · Lizenzpartner', en: 'America · licence partners' })),
        React.createElement('svg', { className: 'geo__svg', viewBox: GEO.america.viewBox, role: 'img', 'aria-label': t({ de: 'Karte Amerika mit Lizenzpartner', en: 'Map of America with partner' }) },
          GEO.america.land.map((c) => React.createElement('path', {
            key: c.id, d: c.d, vectorEffect: 'non-scaling-stroke',
            className: 'geo-country ' + (c.hl === 'na' ? 'geo-country--partner geo-world-clk' : 'geo-country--plain'),
            onClick: c.hl === 'na' ? () => setModal('p:unilock') : undefined,
            role: c.hl === 'na' ? 'button' : undefined, tabIndex: c.hl === 'na' ? 0 : undefined,
          }, React.createElement('title', null, c.name))),
          React.createElement('g', { className: 'geo-de-dot is-active geo-world-clk', onClick: () => setModal('p:unilock') },
            React.createElement('circle', { className: 'geo-de-dot__hit', cx: GEO.america.marker.x, cy: GEO.america.marker.y, r: 8 }),
            React.createElement('circle', { className: 'geo-de-dot__ring', cx: GEO.america.marker.x, cy: GEO.america.marker.y, r: 3, vectorEffect: 'non-scaling-stroke' }),
            React.createElement('circle', { className: 'geo-de-dot__core', cx: GEO.america.marker.x, cy: GEO.america.marker.y, r: 1.1 }))),
        React.createElement('button', { type: 'button', className: 'geo-bubble geo-bubble--world', style: { left: amLeft + '%', top: amTop + '%' }, onClick: () => setModal('p:unilock'), title: 'Unilock' },
          React.createElement('span', { className: 'geo-bubble__img' }, React.createElement('img', { src: logoOf('unilock'), alt: 'Unilock' }))),
        React.createElement('div', { className: 'geo-world-cap' }, t({ de: 'Unilock — Kanada & USA', en: 'Unilock — Canada & USA' })))
    );

    /* ---------------------------------------------------------- Licensee groupings */
    const deLicensees = partners.filter((p) => p.country === 'DE');
    const cityOf = (p) => p.addr[p.addr.length - 1].replace(/^\d{4,5}\s*/, '');

    // countries served by each international licensee, derived from the map data
    const servedBy = {};
    GEO.europe.countries.forEach((c) => {
      if (c.serve && c.serve !== 'DE') (servedBy[c.serve] = servedBy[c.serve] || []).push({ id: c.id, name: c.name });
    });
    const intlOrder = ['wienerberger', 'tschuemperlin', 'ferrari', 'roda', 'unilock'];
    const OFF = { unilock: [{ id: 'CA', name: 'Kanada', off: true }, { id: 'US', name: 'USA', off: true }] };
    const intlLicensees = intlOrder.map((id) => byId(id)).filter(Boolean).map((p) => {
      let list = (servedBy[p.id] || []).slice();
      // home country first, then alphabetical
      list.sort((a, b) => (a.id === p.country ? -1 : b.id === p.country ? 1 : a.name.localeCompare(b.name)));
      if (!list.length) list = OFF[p.id] || [{ id: p.country, name: p.country, off: true }];
      return { p, countries: list };
    });

    /* Right column: German licensees (logos) + international partners below a divider */
    const goGermany = (id) => { if (id) setActive(id); setView('germany'); window.scrollTo({ top: 0, behavior: 'smooth' }); };
    const VISIBLE = 3;
    const IntlRow = ({ p, countries }) => {
      const isOpen = expanded === p.id;
      const shown = isOpen ? countries : countries.slice(0, VISIBLE);
      const rest = countries.length - VISIBLE;
      const stop = (fn) => (e) => { e.stopPropagation(); fn(); };
      return React.createElement('div', { className: 'intl-row', role: 'button', tabIndex: 0, onClick: () => setModal('p:' + p.id),
        onKeyDown: (e) => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); setModal('p:' + p.id); } } },
        React.createElement('div', { className: 'intl-row__head' },
          React.createElement('span', { className: 'intl-row__logo' }, React.createElement('img', { src: logoOf(p.id), alt: p.name })),
          React.createElement('h4', { className: 'intl-row__name' }, p.name),
          React.createElement(Icon, { name: 'arrow', size: 15, className: 'de-logo-row__arrow' })),
        React.createElement('div', { className: 'intl-card__countries' },
          shown.map((c) => c.off
            ? React.createElement('span', { key: c.id, className: 'country-chip country-chip--off' }, c.name)
            : React.createElement('button', { key: c.id, className: 'country-chip', type: 'button', onClick: stop(() => setModal(c.id)) }, c.name)),
          rest > 0 ? React.createElement('button', { className: 'intl-card__more', type: 'button', onClick: stop(() => setExpanded(isOpen ? false : p.id)) },
            isOpen ? t({ de: 'weniger', en: 'less' }) : '+' + rest + ' ' + t({ de: 'mehr', en: 'more' })) : null));
    };

    const partnerOrder = ['uhl', 'berding', 'pfenning', 'wienerberger', 'tschuemperlin', 'roda', 'ferrari', 'unilock'];
    const allPartners = partnerOrder.map(byId).filter(Boolean);
    const CompanyCard = React.createElement('button', { className: 'company-card company-card--btn company-card--compact', type: 'button', onClick: () => setModal('__dev') },
      React.createElement('div', { className: 'company-card__main' },
        React.createElement('p', { className: 'eyebrow' }, t({ de: 'Entwickler & Lizenzgeber', en: 'Developer & licensor' })),
        React.createElement('h3', { className: 'display display--md', style: { marginTop: 10 } }, C.company.name)),
      React.createElement('span', { className: 'company-card__cta' },
        React.createElement('span', null, t({ de: 'Kontakt anzeigen', en: 'Show contact' })),
        React.createElement(Icon, { name: 'arrow', size: 16 })));

    const europeItems = ['uhl', 'berding', 'pfenning', 'wienerberger', 'tschuemperlin', 'roda', 'ferrari'].map(byId).filter(Boolean);
    const americaItems = [byId('unilock')].filter(Boolean);
    const devTile = React.createElement('button', { key: '__dev', type: 'button', className: 'plogo plogo--dev', onClick: () => setModal('__dev') },
      React.createElement('span', { className: 'plogo__eyebrow' }, t({ de: 'Entwickler & Lizenzgeber', en: 'Developer & licensor' })),
      React.createElement('span', { className: 'plogo__devname' }, 'Inventions'),
      React.createElement('span', { className: 'plogo__devcta' }, t({ de: 'Kontakt anzeigen', en: 'Show contact' }), React.createElement(Icon, { name: 'arrow', size: 14 })));
    const makePanel = (items, kicker) => React.createElement('aside', { className: 'de-panel' },
      React.createElement('p', { className: 'de-panel__kicker', style: { marginBottom: 'var(--space-4)' } }, kicker),
      React.createElement('div', { className: 'partner-logos' },
        items.map((p) => React.createElement('button', {
          key: p.id, className: 'plogo', type: 'button',
          onClick: () => setModal(p.dev ? '__dev' : 'p:' + p.id),
        },
          React.createElement('span', { className: 'plogo__img' }, React.createElement('img', { src: p.logo || logoOf(p.id), alt: p.name })),
          React.createElement('span', { className: 'plogo__name' }, p.name))).concat([devTile])));
    const PartnerPanelEU = makePanel(europeItems, t({ de: 'Unsere Lizenzpartner', en: 'Our licence partners' }));
    const PartnerPanelAM = makePanel(americaItems, t({ de: 'Lizenzpartner Amerika', en: 'Licence partner America' }));

    /* ---------------------------------------------------------- Germany detail */
    const PartnerCard = (p) => React.createElement('article', {
      key: p.id, className: 'partner ' + (active === p.id ? 'is-active' : ''),
      onClick: () => setActive(p.id),
    },
      React.createElement('div', { className: 'partner__top' },
        React.createElement('h3', { className: 'partner__name' }, p.name),
        flagOrChip(p.country)),
      React.createElement('p', { className: 'partner__addr' }, p.addr.map((l, i) => React.createElement('span', { key: i }, l, React.createElement('br')))),
      React.createElement('div', { className: 'partner__contact' },
        React.createElement('a', { href: 'tel:' + p.tel.replace(/[^+\d]/g, '') }, React.createElement(Icon, { name: 'phone', size: 13 }), p.tel),
        React.createElement('a', { href: 'https://' + p.web, target: '_blank', rel: 'noreferrer' }, React.createElement(Icon, { name: 'globe', size: 13 }), p.web)));

    const PlzBox = React.createElement('div', { className: 'plz' },
      React.createElement('label', { className: 'plz__label' }, t(C.plzLabel)),
      React.createElement('div', { className: 'plz__row' },
        React.createElement('input', {
          className: 'input', inputMode: 'numeric', maxLength: 5, value: plz,
          placeholder: t(C.plzPlaceholder),
          onChange: (e) => setPlz(e.target.value.replace(/\D/g, '')),
        }),
        React.createElement('button', { className: 'btn btn--primary plz__btn', type: 'button', 'aria-label': 'Suchen' },
          React.createElement(Icon, { name: 'search', size: 18 }))),
      plz.length === 5 ? React.createElement('div', { className: 'plz__result' },
        plzResult
          ? React.createElement('div', { className: 'plz__card' },
            React.createElement('div', { className: 'plz__card-logo' }, React.createElement('img', { src: logoOf(plzResult.id), alt: plzResult.name })),
            React.createElement('p', { className: 'plz__result-label' }, t({ de: 'Ihr Ansprechpartner', en: 'Your contact' })),
            React.createElement('p', { className: 'partner__name', style: { margin: '2px 0 0' } }, plzResult.name),
            React.createElement('p', { className: 'partner__addr', style: { marginTop: 6 } }, plzResult.addr.join(', ')),
            React.createElement('div', { className: 'geo-modal__links', style: { marginTop: 'var(--space-4)' } },
              React.createElement('a', { href: 'tel:' + plzResult.tel.replace(/[^+\d]/g, '') }, React.createElement(Icon, { name: 'phone', size: 15 }), plzResult.tel),
              React.createElement('a', { href: 'https://' + plzResult.web, target: '_blank', rel: 'noreferrer' }, React.createElement(Icon, { name: 'globe', size: 15 }), plzResult.web)))
          : React.createElement('div', { className: 'plz__card' },
            React.createElement('p', { className: 'plz__result-label' }, t({ de: 'Kein regionaler Lizenzpartner', en: 'No regional licence partner' })),
            React.createElement('p', { className: 'partner__addr', style: { margin: '4px 0 0' } }, t({ de: 'Für diese PLZ läuft Ihre Anfrage direkt über den Entwickler und Lizenzgeber.', en: 'For this postcode your enquiry goes directly via the developer and licensor.' })),
            React.createElement('hr', { className: 'geo-modal__divider' }),
            React.createElement('p', { className: 'plz__result-label' }, t({ de: 'Entwickler & Lizenzgeber', en: 'Developer & licensor' })),
            React.createElement('p', { className: 'partner__name', style: { margin: '2px 0 0' } }, C.company.name),
            React.createElement('p', { className: 'partner__addr', style: { marginTop: 6 } }, C.company.addr.join(', ')),
            React.createElement('div', { className: 'geo-modal__links', style: { marginTop: 'var(--space-4)' } },
              React.createElement('a', { href: 'tel:' + C.company.tel.replace(/[^+\d]/g, '') }, React.createElement(Icon, { name: 'phone', size: 15 }), C.company.tel),
              React.createElement('a', { href: 'mailto:' + C.company.mail }, React.createElement(Icon, { name: 'mail', size: 15 }), C.company.mail)))
      ) : null);

    const deVB = GEO.germany.viewBox.split(' ').map(Number);
    const deBubbles = GEO.germany.dots.map((d) => ({ d, p: byId(d.id), left: ((d.x - deVB[0]) / deVB[2]) * 100, top: ((d.y - deVB[1]) / deVB[3]) * 100 }));
    const GermanyMap = React.createElement('div', { className: 'mapwrap' },
      React.createElement('div', { className: 'geo geo--de' },
        MapSwitch,
        React.createElement('span', { className: 'geo__hint' }, t({ de: 'Deutschland · Lizenzpartner', en: 'Germany · partners' })),
        React.createElement('svg', { className: 'geo__svg', viewBox: GEO.germany.viewBox, role: 'img', 'aria-label': t({ de: 'Karte Deutschland mit Lizenzpartnern', en: 'Map of Germany with licence partners' }) },
          React.createElement('g', { className: 'geo-de-neighbours' },
            GEO.europe.countries.filter((c) => c.id !== 'DE').map((c) => React.createElement('path', { key: 'nb-' + c.id, d: c.d, className: 'geo-de-neighbour', vectorEffect: 'non-scaling-stroke' }))),
          React.createElement('g', { className: 'geo-de-states' },
            GEO.germany.states.map((s) => React.createElement('path', { key: s.id, d: s.d, className: 'geo-de-state', vectorEffect: 'non-scaling-stroke' },
              React.createElement('title', null, s.name)))),
          deBubbles.map(({ d }) => React.createElement('g', { key: d.id, className: 'geo-de-dot' },
            React.createElement('circle', { className: 'geo-de-dot__ring', cx: d.x, cy: d.y, r: 0.32, vectorEffect: 'non-scaling-stroke' }),
            React.createElement('circle', { className: 'geo-de-dot__core', cx: d.x, cy: d.y, r: 0.11 })))),
        deBubbles.map(({ d, p, left, top }) => React.createElement('button', {
          key: d.id, type: 'button', className: 'geo-bubble', style: { left: left + '%', top: top + '%' },
          onClick: () => setModal('p:' + d.id), title: p.name,
        },
          React.createElement('span', { className: 'geo-bubble__img' }, React.createElement('img', { src: logoOf(d.id), alt: p.name })))))
    );

    const PlzPanel = React.createElement('aside', { className: 'de-panel' },
      React.createElement('p', { className: 'de-panel__kicker', style: { marginBottom: 'var(--space-4)' } }, t({ de: 'Partner nach Postleitzahl', en: 'Partner by postcode' })),
      PlzBox);

    /* ---------------------------------------------------------- Popup */
    const renderModal = () => {
      if (!modal) return null;
      if (modal === '__dev') {
        return React.createElement('div', { className: 'geo-modal__backdrop', onClick: () => setModal(null) },
          React.createElement('div', { className: 'geo-modal', role: 'dialog', 'aria-modal': 'true', onClick: (e) => e.stopPropagation() },
            React.createElement('button', { className: 'geo-modal__close', onClick: () => setModal(null), 'aria-label': t({ de: 'Schließen', en: 'Close' }) },
              React.createElement(Icon, { name: 'x', size: 18 })),
            React.createElement('div', { className: 'geo-modal__logo' }, React.createElement('img', { src: EINSTEIN_LOGO, alt: C.company.name })),
            React.createElement('p', { className: 'geo-modal__role' }, t({ de: 'Entwickler & Lizenzgeber', en: 'Developer & licensor' })),
            React.createElement('p', { className: 'geo-modal__addr' }, C.company.addr.join(', ')),
            React.createElement('div', { className: 'geo-modal__links' },
              React.createElement('a', { href: 'tel:' + C.company.tel.replace(/[^+\d]/g, '') }, React.createElement(Icon, { name: 'phone', size: 15 }), C.company.tel),
              React.createElement('a', { href: 'mailto:' + C.company.mail }, React.createElement(Icon, { name: 'mail', size: 15 }), C.company.mail))));
      }
      const c = GEO.europe.countries.find((x) => x.id === modal);
      if (modal.startsWith('p:')) {
        const p = byId(modal.slice(2));
        const grp = intlLicensees.find((g) => g.p.id === p.id);
        const cn = grp ? grp.countries.map((x) => x.name).join(' · ') : '';
        return React.createElement('div', { className: 'geo-modal__backdrop', onClick: () => setModal(null) },
          React.createElement('div', { className: 'geo-modal', role: 'dialog', 'aria-modal': 'true', onClick: (e) => e.stopPropagation() },
            React.createElement('button', { className: 'geo-modal__close', onClick: () => setModal(null), 'aria-label': t({ de: 'Schließen', en: 'Close' }) },
              React.createElement(Icon, { name: 'x', size: 18 })),
            React.createElement('div', { className: 'geo-modal__logo' }, React.createElement('img', { src: logoOf(p.id), alt: p.name })),
            React.createElement('p', { className: 'geo-modal__role' }, t({ de: 'EINSTEIN®-Lizenzpartner', en: 'EINSTEIN® licence partner' })),
            cn ? React.createElement('p', { className: 'geo-modal__countries' }, cn) : null,
            React.createElement('p', { className: 'geo-modal__addr' }, p.addr.join(', ')),
            React.createElement('div', { className: 'geo-modal__links' },
              React.createElement('a', { href: 'tel:' + p.tel.replace(/[^+\d]/g, '') }, React.createElement(Icon, { name: 'phone', size: 15 }), p.tel),
              React.createElement('a', { href: 'https://' + p.web, target: '_blank', rel: 'noreferrer' }, React.createElement(Icon, { name: 'globe', size: 15 }), p.web))));
      }
      const p = c.serve && c.serve !== 'DE' ? byId(c.serve) : null;
      return React.createElement('div', { className: 'geo-modal__backdrop', onClick: () => setModal(null) },
        React.createElement('div', { className: 'geo-modal', role: 'dialog', 'aria-modal': 'true', onClick: (e) => e.stopPropagation() },
          React.createElement('button', { className: 'geo-modal__close', onClick: () => setModal(null), 'aria-label': t({ de: 'Schließen', en: 'Close' }) },
            React.createElement(Icon, { name: 'x', size: 18 })),
          React.createElement('div', { className: 'geo-modal__head' },
            React.createElement('h3', { className: 'geo-modal__country' }, c.name)),
          p
            ? React.createElement(React.Fragment, null,
              React.createElement('div', { className: 'geo-modal__logo' }, React.createElement('img', { src: logoOf(p.id), alt: p.name })),
              React.createElement('p', { className: 'geo-modal__role' }, t({ de: 'EINSTEIN®-Lizenzpartner', en: 'EINSTEIN® licence partner' })),
              React.createElement('p', { className: 'geo-modal__addr' }, p.addr.join(', ')),
              React.createElement('div', { className: 'geo-modal__links' },
                React.createElement('a', { href: 'tel:' + p.tel.replace(/[^+\d]/g, '') }, React.createElement(Icon, { name: 'phone', size: 15 }), p.tel),
                React.createElement('a', { href: 'https://' + p.web, target: '_blank', rel: 'noreferrer' }, React.createElement(Icon, { name: 'globe', size: 15 }), p.web)))
            : React.createElement(React.Fragment, null,
              React.createElement('div', { className: 'geo-modal__logo' }, React.createElement('img', { src: EINSTEIN_LOGO, alt: C.company.name })),
              React.createElement('p', { className: 'geo-modal__role' }, t({ de: 'Kein regionaler Lizenzpartner', en: 'No regional licence partner' })),
              React.createElement('p', { className: 'geo-modal__msg' }, t({
                de: 'Für ' + c.name + ' gibt es derzeit keinen regionalen Lizenzpartner. Wenden Sie sich für Anfragen und Lieferungen direkt an den Entwickler und Lizenzgeber.',
                en: 'There is currently no regional licence partner for ' + c.name + '. For enquiries and supply, please contact the developer and licensor directly.',
              })),
              React.createElement('hr', { className: 'geo-modal__divider' }),
              React.createElement('p', { className: 'geo-modal__role' }, t({ de: 'Entwickler & Lizenzgeber', en: 'Developer & licensor' })),
              React.createElement('p', { className: 'geo-modal__addr' }, C.company.addr.join(', ')),
              React.createElement('div', { className: 'geo-modal__links' },
                React.createElement('a', { href: 'tel:' + C.company.tel.replace(/[^+\d]/g, '') }, React.createElement(Icon, { name: 'phone', size: 15 }), C.company.tel),
                React.createElement('a', { href: 'mailto:' + C.company.mail }, React.createElement(Icon, { name: 'mail', size: 15 }), C.company.mail)))));
    };

    const header = React.createElement('div', { style: { maxWidth: 760, marginBottom: 'var(--space-5)' } },
      React.createElement('p', { className: 'eyebrow' }, t(C.eyebrow)),
      React.createElement('h1', { className: 'display display--md', style: { marginTop: 8 } }, t(C.title)));
    const mapForView = view === 'germany' ? GermanyMap : view === 'america' ? AmericaMap : EuropeMap;
    const rightForView = view === 'germany' ? PlzPanel : view === 'america' ? PartnerPanelAM : PartnerPanelEU;
    return React.createElement('section', { className: 'section section--contact' },
      React.createElement('div', { className: 'container' },
        header,
        React.createElement('div', { className: 'contact-top' }, mapForView, rightForView)),
      renderModal());
  };

  window.Kontakt = Kontakt;
})();