(function() {
  var COLS = [
    { title:'Platform', links:[
      { label:'Explore Projects', action:function(){ window.navigate('projects'); } },
      { label:'Submit Idea',      action:function(){ window.navigate('submit'); } },
      { label:'AR Viewer',        action:function(){ window.navigate('ar-demo'); } },
      { label:'Live Map',         action:function(){ window.navigate('projects', { filter:'live' }); } },
      { label:'Funding',          action:function(){ window.navigate('funding'); } },
    ]},
    { title:'Community', links:[
      { label:'Leaderboard',       action:function(){ window.navigate('community'); } },
      { label:'Top Contributors',  action:function(){ window.navigate('community'); } },
      { label:'Blog',              action:function(){ window.showUserToast('Blog coming soon', 'violet'); } },
      { label:'Events',            action:function(){ window.showUserToast('Events coming soon', 'lime'); } },
      { label:'Forum',             action:function(){ window.showUserToast('Forum coming soon', 'cyan'); } },
    ]},
    { title:'Company', links:[
      { label:'About CityBuildR', action:function(){ window.showUserToast('About page coming soon', 'violet'); } },
      { label:'Careers',          action:function(){ window.showUserToast('Careers coming soon', 'lime'); } },
      { label:'Press',            action:function(){ window.showUserToast('Press kit coming soon', 'cyan'); } },
      { label:'Privacy',          action:function(){ window.showUserToast('Privacy policy coming soon', 'violet'); } },
      { label:'Terms',            action:function(){ window.showUserToast('Terms of service coming soon', 'violet'); } },
    ]},
  ];

  function Footer() {
    return (
      <footer id="footer">
        <div className="footer-inner">
          <div className="footer-grid">
            <div>
              <div className="footer-brand" style={{ cursor:'none' }}
                onMouseEnter={function(){ document.body.classList.add('hov'); }}
                onMouseLeave={function(){ document.body.classList.remove('hov'); }}
                onClick={function(){ window.navigate('home'); }}>
                CityBuildR
              </div>
              <div className="footer-tag">Build the city you imagine.</div>
              <div style={{ fontSize:13, color:'var(--text-dim)', lineHeight:1.7, maxWidth:280, marginBottom:24 }}>
                A civic AR platform connecting citizens, businesses, and governments to reshape urban spaces — together, visually, before anything is built.
              </div>
              <div style={{ display:'flex', gap:10 }}>
                {[
                  { name:'x-logo',   label:'X (Twitter)' },
                  { name:'linkedin', label:'LinkedIn' },
                  { name:'youtube',  label:'YouTube' },
                  { name:'mail',     label:'Email' },
                ].map(function(s) {
                  return (
                    <button key={s.name} className="social-btn" aria-label={s.label}
                      onMouseEnter={function(){ document.body.classList.add('hov'); }}
                      onMouseLeave={function(){ document.body.classList.remove('hov'); }}
                      onClick={function(){ window.showUserToast('Opening…', 'violet'); }}>
                      <window.CBIcon name={s.name} size={15} />
                    </button>
                  );
                })}
              </div>
            </div>
            {COLS.map(function(c) {
              return (
                <div key={c.title}>
                  <div className="fcol-title">{c.title}</div>
                  {c.links.map(function(l) {
                    return (
                      <button key={l.label} className="flink"
                        onMouseEnter={function(){ document.body.classList.add('hov'); }}
                        onMouseLeave={function(){ document.body.classList.remove('hov'); }}
                        onClick={l.action}>
                        {l.label}
                      </button>
                    );
                  })}
                </div>
              );
            })}
          </div>
          <div className="footer-bottom">
            <div className="f-status"><span className="f-status-dot" />All systems operational · AR projects live · 14 cities</div>
            <div>© 2026 CityBuildR Inc. — Making cities everyone's canvas.</div>
          </div>
        </div>
      </footer>
    );
  }

  window.UserFooter = Footer;
})();