import { Link } from 'react-router-dom'

// Styles live in src/styles/landing.css under `.landing-footer*`. The component
// must be rendered inside a `.landing-page` wrapper so the `--lp-*` CSS
// variables resolve. All current marketing surfaces (LandingPage,
// PricingPage, ContactSalesPage) already provide that wrapper.
export function MarketingFooter() {
  return (
    <footer className="landing-footer">
      <div className="landing-footer-inner">
        <div className="landing-footer-left">
          <div className="landing-nav-logo-icon" style={{ width: 24, height: 24, borderRadius: 6 }}>
            <svg viewBox="0 0 24 24" fill="none" stroke="#000" strokeWidth="2.5" strokeLinecap="round" strokeLinejoin="round" style={{ width: 14, height: 14 }}>
              <circle cx="12" cy="5" r="2" />
              <line x1="12" y1="7" x2="12" y2="11" />
              <circle cx="6" cy="15" r="2" />
              <circle cx="18" cy="15" r="2" />
              <line x1="12" y1="11" x2="6" y2="13" />
              <line x1="12" y1="11" x2="18" y2="13" />
            </svg>
          </div>
          <span className="landing-footer-copy">&copy; 2026 ResolutionFlow</span>
        </div>
        <ul className="landing-footer-links">
          <li><Link to="/privacy">Privacy</Link></li>
          <li><Link to="/terms">Terms</Link></li>
          <li><Link to="/policies">Policies</Link></li>
          <li><Link to="/contact">Contact</Link></li>
        </ul>
      </div>
    </footer>
  )
}

export default MarketingFooter