/* Footer — institutional, address-heavy, real DLG data */

const Footer = ({ onNav }) => {
  const go = (route) => (e) => { e.preventDefault(); onNav(route); };
  return (
    <footer className="dlg-footer" data-screen-label="Footer">
      <FooterStyles/>
      <div className="container">
        <div className="dlg-footer__top">
          <div className="dlg-footer__brand">
            <img src="assets/dlg-seal.svg" alt="" width="64" height="64"/>
            <div>
              <div className="dlg-footer__name">Deutsche Legat Gesellschaft</div>
              <div className="dlg-footer__sub">für Zertifizierung mbH</div>
              <div className="dlg-footer__addr">
                Radelandstraße 4<br/>
                13589 Berlin
              </div>
              <div className="dlg-footer__contact">
                <span><Icon d={Icons.mail} size={12}/> info@deutsche-legat.de</span>
              </div>
            </div>
          </div>

          <div className="dlg-footer__cols">
            <div>
              <h4>Verfahren</h4>
              <ul>
                <li><a href="#" onClick={go("home")}>BSO 2011 Zertifizierung</a></li>
                <li><a href="#" onClick={go("home")}>Deutsches Hygienesiegel (BSO 2079)</a></li>
                <li><a href="#" onClick={go("home")}>ISO-konforme Prozesszertifizierung</a></li>
                <li><a href="#" onClick={go("home")}>AZAV-Trägerzulassung</a></li>
                <li><a href="#" onClick={go("home")}>Qualitätsbetrieb des Jahres</a></li>
              </ul>
            </div>
            <div>
              <h4>Service</h4>
              <ul>
                <li><a href="#" onClick={go("antrag")}>Antrag stellen</a></li>
                <li><a href="#" onClick={go("news")}>Aktuelles</a></li>
                <li><a href="#" onClick={go("kontakt")}>Kontakt</a></li>
              </ul>
            </div>
            <div>
              <h4>Rechtliches</h4>
              <ul>
                <li><a href="#" onClick={go("impressum")}>Impressum</a></li>
                <li><a href="#" onClick={go("datenschutz")}>Datenschutz</a></li>
              </ul>
            </div>
          </div>
        </div>

        <div className="dlg-footer__bottom">
          <div className="dlg-footer__legal">
            <OfficialStamp>Eingetragen · HRB 176105</OfficialStamp>
            <span>· Amtsgericht Charlottenburg · Sitz Berlin</span>
          </div>
          <div className="dlg-footer__bottom-links">
            <a href="#" onClick={go("impressum")}>Impressum</a>
            <a href="#" onClick={go("datenschutz")}>Datenschutz</a>
            <a href="#" onClick={go("kontakt")}>Kontakt</a>
          </div>
        </div>
      </div>
    </footer>
  );
};

const FooterStyles = () => (
  <style>{`
    .dlg-footer { background: var(--dlg-navy-900); color: var(--dlg-ink-200); padding: 64px 0 24px; font-size: 14px; }
    .dlg-footer__top { display: grid; grid-template-columns: 1fr 2fr; gap: 56px; padding-bottom: 48px; border-bottom: 1px solid rgba(255,255,255,0.08); }
    .dlg-footer__brand { display: flex; gap: 16px; align-items: flex-start; }
    .dlg-footer__name { font-family: var(--font-serif); font-weight: 700; font-size: 18px; color: #fff; line-height: 1.2; }
    .dlg-footer__sub  { font-size: 13px; color: var(--dlg-gold-400); font-weight: 600; letter-spacing: 0.4px; margin: 2px 0 14px; }
    .dlg-footer__addr { font-size: 13.5px; line-height: 1.55; color: var(--dlg-ink-200); margin-bottom: 12px; }
    .dlg-footer__contact { display: flex; flex-direction: column; gap: 6px; font-size: 13px; }
    .dlg-footer__contact span { display: inline-flex; gap: 6px; align-items: center; }
    .dlg-footer__cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
    .dlg-footer__cols h4 { font-family: var(--font-sans); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 2px; color: var(--dlg-gold-400); margin: 0 0 16px; }
    .dlg-footer__cols ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
    .dlg-footer__cols a { color: var(--dlg-ink-200); text-decoration: none; font-size: 13.5px; }
    .dlg-footer__cols a:hover { color: #fff; }
    .dlg-footer__bottom { display: flex; justify-content: space-between; align-items: center; padding-top: 24px; gap: 16px; flex-wrap: wrap; font-size: 12px; color: var(--dlg-ink-400); }
    .dlg-footer__legal { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
    .dlg-footer__bottom-links { display: flex; gap: 18px; }
    .dlg-footer__bottom-links a { color: var(--dlg-ink-200); text-decoration: none; }
    .dlg-footer__bottom-links a:hover { color: #fff; }
  `}</style>
);

Object.assign(window, { Footer });