/* ─── Footer — Sufficient Certainty ─── */

const Footer = ({ onNavigate }) => {
  const isMobile = useMediaQuery(680);

  const f = {
    wrapper: {
      background: 'var(--bg-inverse)',
      padding: isMobile ? 'var(--space-7) var(--space-5) var(--space-5)' : 'var(--space-9) var(--space-6) var(--space-7)',
      paddingLeft: isMobile ? 'calc(var(--space-5) + var(--safe-left, 0px))' : 'calc(var(--space-6) + var(--safe-left, 0px))',
      paddingRight: isMobile ? 'calc(var(--space-5) + var(--safe-right, 0px))' : 'calc(var(--space-6) + var(--safe-right, 0px))',
      paddingBottom: isMobile ? 'calc(var(--space-5) + var(--safe-bottom, 0px))' : 'calc(var(--space-7) + var(--safe-bottom, 0px))',
    },
    inner: {
      maxWidth: '1100px',
      margin: '0 auto',
      display: isMobile ? 'grid' : 'flex',
      gridTemplateColumns: isMobile ? '1fr 1fr' : undefined,
      justifyContent: isMobile ? undefined : 'space-between',
      alignItems: 'flex-start',
      gap: isMobile ? 'var(--space-5)' : 'var(--space-7)',
    },
    col: {
      display: 'flex',
      flexDirection: 'column',
      gap: 0,
    },
    brand: {
      fontFamily: 'var(--font-serif)',
      fontSize: '18px',
      fontWeight: 500,
      color: 'var(--fg-inverse)',
      marginBottom: 'var(--space-2)',
    },
    desc: {
      fontFamily: 'var(--font-serif)',
      fontSize: isMobile ? '13px' : '14px',
      color: 'var(--fg-inverse-muted)',
      lineHeight: 1.6,
      maxWidth: '38ch',
    },
    link: {
      fontFamily: 'var(--font-sans)',
      fontSize: '13px',
      color: 'var(--fg-inverse-muted)',
      textDecoration: 'none',
      cursor: 'pointer',
      transition: 'color var(--duration-fast) var(--easing)',
      background: 'none',
      border: 'none',
      padding: '10px 0',
      textAlign: 'left',
      minHeight: '44px',
      display: 'flex',
      alignItems: 'center',
    },
    heading: {
      fontFamily: 'var(--font-sans)',
      fontSize: '11px',
      fontWeight: 600,
      letterSpacing: '0.08em',
      textTransform: 'uppercase',
      color: 'var(--fg-inverse)',
      marginBottom: 'var(--space-1)',
    },
    divider: {
      borderTop: '1px solid var(--bg-inverse-soft)',
      marginTop: isMobile ? 'var(--space-4)' : 'var(--space-7)',
      paddingTop: isMobile ? 'var(--space-3)' : 'var(--space-5)',
      maxWidth: '1100px',
      margin: isMobile ? 'var(--space-4) auto 0' : 'var(--space-7) auto 0',
      display: 'flex',
      justifyContent: 'space-between',
      alignItems: isMobile ? 'flex-start' : 'center',
      flexDirection: isMobile ? 'column' : 'row',
      flexWrap: 'wrap',
      gap: 'var(--space-2)',
    },
    copyright: {
      fontFamily: 'var(--font-sans)',
      fontSize: '12px',
      color: 'var(--fg-inverse-muted)',
    },
  };

  const navClick = (page) => (e) => {
    e.preventDefault();
    onNavigate(page);
  };

  return React.createElement('footer', { style: f.wrapper },
    React.createElement('div', { style: f.inner },
      React.createElement('div', { style: { ...f.col, flex: isMobile ? 'none' : 1, gridColumn: isMobile ? '1 / -1' : undefined } },
        React.createElement('span', { style: f.brand }, 'Sufficient Certainty'),
        React.createElement('span', { style: f.desc },
          'The structured process described by Grant Purdy and Roger Estall in their 2020 book helps organisations make decisions they can defend.'),
      ),
      React.createElement('div', { style: f.col },
        React.createElement('span', { style: f.heading }, 'Pages'),
        React.createElement('button', { style: f.link, onClick: navClick('home') }, 'Home'),
        React.createElement('button', { style: f.link, onClick: navClick('about') }, 'About'),
        React.createElement('button', { style: f.link, onClick: navClick('method') }, 'Method'),
        React.createElement('button', { style: f.link, onClick: navClick('writing') }, 'Writing'),
      ),
      React.createElement('div', { style: f.col },
        React.createElement('span', { style: f.heading }, 'Legal'),
        React.createElement('button', { style: f.link, onClick: navClick('privacy') }, 'Privacy Policy'),
        React.createElement('button', { style: f.link, onClick: navClick('terms') }, 'Terms of Service'),
        React.createElement('a', { style: f.link, href: 'https://www.linkedin.com/company/sufficient-certainty', target: '_blank', rel: 'noopener noreferrer' }, 'Contact'),
      ),
    ),
    React.createElement('div', { style: f.divider },
      React.createElement('span', { style: f.copyright }, '\u00A9 2026 Sufficient Certainty Pty Ltd'),
      React.createElement('span', {
        style: {
          fontFamily: 'var(--font-serif)',
          fontSize: '12px',
          fontStyle: 'italic',
          color: 'var(--fg-inverse-muted)',
        }
      }, 'In memory of Roger Estall (d.\u00A02023), co-author of\u00A0', React.createElement('em', null, 'Deciding'), '.'),
    ),
  );
};

window.Footer = Footer;