// Am Waldrain, Fusszeile (Laufzeit-Fassung). Gewinnt ueber die Bundle-Kopie,
// index.html greift zuerst nach window.M57SiteFooter. Quelle fuer die
// Komponentenbibliothek: components/layout/SiteFooter.jsx (gleicher Aufbau).
//
// Vier Spalten: Marke und Adresse, Seiten, Vertrieb mit dem Logo von
// Elisabeth Rohr Real Estate, Vertragserrichter und Treuhaender mit dem Logo
// von Eckert Nittmann. Beide Logos einfarbig in Umbra, damit sie sich in die
// Fusszeile einfuegen (assets/logo/*-umbra.png). Darunter eine Zeile mit
// Copyright und Urheber. Kein Schlussakkord mehr, die Fusszeile bleibt kurz.
(function () {
  const { Wordmark } = window.Maison57DesignSystem_40d525;

  function SiteFooter({ onNavigate }) {
    const head = { fontFamily: 'var(--font-text)', fontSize: 'var(--text-micro)', letterSpacing: '0.12em', textTransform: 'uppercase', color: 'var(--umbra-60)', margin: '0 0 var(--space-4)', fontWeight: 'var(--weight-medium)' };
    const line = { fontFamily: 'var(--font-text)', fontSize: 'var(--text-small)', color: 'var(--umbra)', lineHeight: 1.9 };
    const logo = { display: 'block', width: 'auto', opacity: 0.9 };
    const nav = (href) => (e) => { if (onNavigate) { e.preventDefault(); onNavigate(href); } };

    return (
      <footer style={{ borderTop: '1px solid var(--sandstein)' }}>
        <div
          className="m57-footer"
          style={{
            maxWidth: 'var(--content-max)', margin: '0 auto',
            padding: 'clamp(3rem, 6vw, 5rem) var(--page-inset-lg) clamp(2.5rem, 5vw, 4rem)',
            display: 'grid', gridTemplateColumns: '1.3fr 0.8fr 1fr 1fr', gap: 'clamp(2rem, 4vw, 3.5rem)',
          }}
        >
          <div>
            <Wordmark size="md" />
            <div style={{ ...line, marginTop: 'var(--space-4)' }}>Nachreihengasse 5-7<br />1170 Wien</div>
          </div>
          <div>
            <p style={head}>Seiten</p>
            <div style={line}>
              <a href="#projekt" onClick={nav('#projekt')}>Projekt</a><br />
              <a href="#lage" onClick={nav('#lage')}>Lage</a><br />
              <a href="#wohnungen" onClick={nav('#wohnungen')}>Wohnungen</a>
              {window.M57_KONTAKTFORMULAR !== false && <><br /><a href="#vormerkung" onClick={nav('#vormerkung')}>Vormerkung</a></>}
            </div>
          </div>
          <div>
            <p style={head}>Vermarktung exklusiv durch</p>
            <a href="https://www.rohr-real-estate.com" target="_blank" rel="noopener" style={{ display: 'inline-block', marginBottom: 'var(--space-4)' }}>
              <img src="/assets/logo/partner-elisabeth-rohr-umbra.png" alt="Elisabeth Rohr Real Estate" style={{ ...logo, height: '1.3rem' }} />
            </a>
            <div style={line}>Viola Dollinger<br /><a href="tel:+436764347384">+43 676 434 73 84</a><br /><a href="tel:+4315853663">+43 1 585 36 63</a><br /><a href="mailto:sales@waldrain.at">sales@waldrain.at</a></div>
          </div>
          <div>
            <p style={head}>Vertragserrichter und Treuhänder</p>
            <img src="/assets/logo/partner-eckert-nittmann-umbra.png" alt="Eckert Nittmann Rechtsanwälte GmbH" style={{ ...logo, height: '1.9rem', marginBottom: 'var(--space-4)' }} />
            <div style={line}><a href="/impressum/">Impressum &amp; Datenschutz</a></div>
          </div>
        </div>
        <div style={{ maxWidth: 'var(--content-max)', margin: '0 auto', padding: 'var(--space-4) var(--page-inset-lg) var(--space-5)', borderTop: '1px solid var(--sandstein-40)', display: 'flex', justifyContent: 'space-between', gap: 'var(--space-6)', flexWrap: 'wrap', fontFamily: 'var(--font-text)', fontSize: 'var(--text-micro)', color: 'var(--umbra-60)' }}>
          <span>© 2026 Am Waldrain, Wien</span>
          <span>made by <a href="https://www.ad.boutique/" target="_blank" rel="noopener" title="Ad Boutique, Digitalagentur für Performance Marketing und Websites in Wien" style={{ color: 'var(--umbra-60)', textDecoration: 'underline', textUnderlineOffset: '0.15em' }}>Ad Boutique</a></span>
        </div>
        <style>{`
          .m57-footer a { text-decoration: none; }
          .m57-footer a:hover { text-decoration: underline; text-underline-offset: 0.15em; }
          @media (max-width: 900px) { .m57-footer { grid-template-columns: 1fr 1fr !important; gap: var(--space-8) !important; } }
          @media (max-width: 560px) { .m57-footer { grid-template-columns: 1fr !important; gap: var(--space-8) !important; } }
        `}</style>
      </footer>
    );
  }

  window.M57SiteFooter = SiteFooter;
})();
