// Shared Nav + Footer used across all pages. Imports Logo & Icon from shared.jsx.

const Nav = ({ current }) => {
  const items = [
    { href: 'campus.html', label: 'Campus', key: 'campus' },
    { href: 'how-it-works.html', label: 'How it works', key: 'how' },
    { href: 'courses.html', label: 'Courses', key: 'courses' },
    { href: 'about.html', label: 'About', key: 'about' },
    { href: 'manifesto.html', label: 'Manifesto', key: 'manifesto' },
  ];
  return (
    <nav className="nav">
      <div className="container nav-inner">
        <div className="nav-left">
          <Logo/>
          <div className="nav-links">
            {items.map(it => (
              <a key={it.key} href={it.href} style={current === it.key ? { color: 'var(--ink-0)' } : null}>{it.label}</a>
            ))}
          </div>
        </div>
        <div className="nav-right">
          <div className="nav-trust">
            <span className="chip chip-warm"><span className="dot"></span>WASC accredited</span>
            <span className="chip chip-warm">UC A–G</span>
          </div>
          <a className="btn btn-secondary btn-sm" href="#">Sign in</a>
          <a className="btn btn-primary btn-sm" href="enroll.html">Enroll <Icon name="arrowRight" size={14}/></a>
        </div>
      </div>
    </nav>
  );
};

const Footer = () => (
  <footer>
    <div className="container">
      <div className="foot-grid">
        <div>
          <Logo/>
          <div className="foot-addr">
            <b>520 Lasuen Mall #200</b><br/>
            Stanford, CA 94309<br/>
            admissions@thevr.school<br/>
            (650) 422-9180
          </div>
          <div style={{ marginTop: 24, display: 'flex', gap: 8, flexWrap: 'wrap' }}>
            <span className="chip chip-warm"><span className="dot"></span>WASC · 43 46070 999</span>
            <span className="chip">UC A–G</span>
          </div>
        </div>
        <div className="foot-col">
          <h6>Learn</h6>
          <a href="campus.html">Campus & worlds</a>
          <a href="how-it-works.html">How it works</a>
          <a href="courses.html">Courses</a>
          <a href="manifesto.html">Manifesto</a>
        </div>
        <div className="foot-col">
          <h6>Apply</h6>
          <a href="enroll.html">Enroll</a>
          <a href="accreditation.html">Accreditation & diploma</a>
          <a href="schools-districts.html">For schools & districts</a>
          <a href="partners.html">For partners</a>
        </div>
        <div className="foot-col">
          <h6>The school</h6>
          <a href="about.html">About</a>
          <a href="school-profile.html">School profile</a>
          <a href="give.html">Give</a>
          <a href="contact.html">Contact</a>
          <a href="privacy.html">Privacy policy</a>
        </div>
      </div>
      <div className="foot-bot">
        <span>© 2026 The VR School · Founded 2017 · Stanford · Palo Alto · China · Singapore</span>
        <span className="mono">LAST UPDATED · 2026–27 ACADEMIC YEAR</span>
      </div>
    </div>
  </footer>
);

Object.assign(window, { Nav, Footer });
