/* eslint-disable */
// Footer

// Inline brand glyphs — Lucide removed branded socials, so we ship our own.
const Svg = ({ children }) => (
  <svg viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">{children}</svg>
);
const LinkedInIcon = () => (
  <Svg><path d="M20.45 20.45h-3.55v-5.57c0-1.33-.03-3.04-1.85-3.04-1.85 0-2.14 1.45-2.14 2.94v5.67H9.36V9h3.41v1.56h.05c.47-.9 1.64-1.85 3.38-1.85 3.61 0 4.28 2.38 4.28 5.47v6.27ZM5.34 7.43a2.06 2.06 0 1 1 0-4.12 2.06 2.06 0 0 1 0 4.12ZM7.12 20.45H3.55V9h3.57v11.45ZM22.22 0H1.77C.79 0 0 .77 0 1.72v20.56C0 23.23.79 24 1.77 24h20.45c.98 0 1.78-.77 1.78-1.72V1.72C24 .77 23.2 0 22.22 0Z"/></Svg>
);
const FacebookIcon = () => (
  <Svg><path d="M22 12a10 10 0 1 0-11.56 9.88v-6.99H7.9V12h2.54V9.8c0-2.51 1.49-3.89 3.77-3.89 1.09 0 2.24.2 2.24.2v2.46h-1.26c-1.24 0-1.63.77-1.63 1.56V12h2.77l-.44 2.89h-2.33v6.99A10 10 0 0 0 22 12Z"/></Svg>
);
const InstagramIcon = () => (
  <Svg><path d="M12 2.16c3.2 0 3.58.01 4.85.07 1.17.05 1.8.25 2.23.41.56.22.96.48 1.38.9.42.42.68.82.9 1.38.16.42.36 1.06.41 2.23.06 1.27.07 1.65.07 4.85s-.01 3.58-.07 4.85c-.05 1.17-.25 1.8-.41 2.23-.22.56-.48.96-.9 1.38-.42.42-.82.68-1.38.9-.42.16-1.06.36-2.23.41-1.27.06-1.65.07-4.85.07s-3.58-.01-4.85-.07c-1.17-.05-1.8-.25-2.23-.41a3.72 3.72 0 0 1-1.38-.9 3.72 3.72 0 0 1-.9-1.38c-.16-.42-.36-1.06-.41-2.23C2.17 15.58 2.16 15.2 2.16 12s.01-3.58.07-4.85c.05-1.17.25-1.8.41-2.23.22-.56.48-.96.9-1.38.42-.42.82-.68 1.38-.9.42-.16 1.06-.36 2.23-.41C8.42 2.17 8.8 2.16 12 2.16ZM12 0C8.74 0 8.33.01 7.05.07 5.78.13 4.9.34 4.14.63a5.88 5.88 0 0 0-2.13 1.38A5.88 5.88 0 0 0 .63 4.14C.34 4.9.13 5.78.07 7.05.01 8.33 0 8.74 0 12s.01 3.67.07 4.95c.06 1.27.27 2.15.56 2.91.3.79.7 1.46 1.38 2.13a5.88 5.88 0 0 0 2.13 1.38c.76.29 1.64.5 2.91.56C8.33 23.99 8.74 24 12 24s3.67-.01 4.95-.07c1.27-.06 2.15-.27 2.91-.56a5.88 5.88 0 0 0 2.13-1.38 5.88 5.88 0 0 0 1.38-2.13c.29-.76.5-1.64.56-2.91.06-1.28.07-1.69.07-4.95s-.01-3.67-.07-4.95c-.06-1.27-.27-2.15-.56-2.91a5.88 5.88 0 0 0-1.38-2.13A5.88 5.88 0 0 0 19.86.63C19.1.34 18.22.13 16.95.07 15.67.01 15.26 0 12 0Zm0 5.84a6.16 6.16 0 1 0 0 12.32 6.16 6.16 0 0 0 0-12.32ZM12 16a4 4 0 1 1 0-8 4 4 0 0 1 0 8Zm6.4-11.85a1.44 1.44 0 1 0 0 2.88 1.44 1.44 0 0 0 0-2.88Z"/></Svg>
);
const YouTubeIcon = () => (
  <Svg><path d="M23.5 6.2a3 3 0 0 0-2.12-2.12C19.55 3.6 12 3.6 12 3.6s-7.55 0-9.38.48A3 3 0 0 0 .5 6.2C0 8.03 0 12 0 12s0 3.97.5 5.8a3 3 0 0 0 2.12 2.12C4.45 20.4 12 20.4 12 20.4s7.55 0 9.38-.48a3 3 0 0 0 2.12-2.12C24 15.97 24 12 24 12s0-3.97-.5-5.8ZM9.6 15.6V8.4l6.24 3.6L9.6 15.6Z"/></Svg>
);

const SiteFooter = ({ setRoute }) => {
  const t = (window.useT && window.useT()) || ((k) => k);
  return (
    <footer className="cbm-footer">
      <div className="cbm-footer__inner">
        <div className="cbm-footer__partner">
          <img src="../../assets/logos/kvk-curacao.png" alt="Kamer van Koophandel & Nijverheid Curaçao" />
          <div>
            <span className="cbm-eyebrow cbm-eyebrow--gold">{t('footer_partner_eyebrow')}</span>
            <p>{t('footer_partner_body')}</p>
          </div>
        </div>
        <div className="cbm-footer__grid">
          <div className="cbm-footer__brand">
            <Logo size={32} />
            <p>{t('footer_brand_body')}</p>
          </div>
          <div className="cbm-footer__col">
            <h4>{t('footer_discover')}</h4>
            <ul>
              <li><a onClick={() => setRoute('directory')}>{t('footer_directory')}</a></li>
              <li><a onClick={() => setRoute('jobs')}>{t('footer_jobs')}</a></li>
              <li><a onClick={() => setRoute('courses')}>{t('footer_courses')}</a></li>
              <li><a onClick={() => setRoute('article')}>{t('footer_editorial')}</a></li>
              <li><a>{t('footer_events')}</a></li>
            </ul>
          </div>
          <div className="cbm-footer__col">
            <h4>{t('footer_partner')}</h4>
            <ul>
              <li><a onClick={() => setRoute('advertise')}>{t('footer_advertise')}</a></li>
              <li><a onClick={() => setRoute('jobs')}>{t('footer_post_job')}</a></li>
              <li><a onClick={() => setRoute('directory')}>{t('footer_list_business')}</a></li>
              <li><a>{t('footer_sponsored')}</a></li>
            </ul>
          </div>
          <div className="cbm-footer__col">
            <h4>{t('footer_about')}</h4>
            <ul>
              <li><a>{t('footer_publication')}</a></li>
              <li><a>{t('footer_editorial_team')}</a></li>
              <li><a>{t('footer_chamber')}</a></li>
              <li><a>{t('footer_contact')}</a></li>
            </ul>
          </div>
        </div>
        <div className="cbm-footer__bottom">
          <span>{t('footer_copyright')}</span>
          <div className="cbm-footer__social">
            <a><LinkedInIcon /></a>
            <a><FacebookIcon /></a>
            <a><InstagramIcon /></a>
            <a><YouTubeIcon /></a>
          </div>
        </div>
      </div>
    </footer>
  );
};

Object.assign(window, { SiteFooter });
