// AreaCards.jsx — 6 activity area cards with Lucide icons
const { useEffect: useEffectArea } = React;

function AreaCards({ lang }) {
  const areas = {
    pl: [
      { icon: 'refresh-ccw',     title: 'Reintegracja i włączenie społeczne',     body: 'Wspieranie osób zagrożonych wykluczeniem w powrocie do aktywności zawodowej i społecznej.' },
      { icon: 'graduation-cap',  title: 'Kompetencje cyfrowe i edukacja',          body: 'Warsztaty cyfrowe, edukacja finansowa i ekonomiczna, przeciwdziałanie wykluczeniu cyfrowemu.' },
      { icon: 'heart-handshake', title: 'Seniorzy i osoby z niepełnosprawnościami', body: 'Programy wsparcia, aktywizacji i samodzielności dla osób starszych i z niepełnosprawnościami.' },
      { icon: 'shield-check',    title: 'Profilaktyka i zdrowie',                   body: 'Przeciwdziałanie uzależnieniom i patologiom społecznym, profilaktyka i edukacja zdrowotna.' },
      { icon: 'trending-up',     title: 'Przedsiębiorczość i innowacje',            body: 'Wspieranie przedsiębiorczości, innowacyjności i transferu wiedzy poprzez szkolenia i doradztwo.' },
      { icon: 'leaf',            title: 'Kultura, ekologia, równość',               body: 'Projekty kulturalne i ekologiczne oraz działania na rzecz równych praw kobiet i mężczyzn.' },
    ],
    en: [
      { icon: 'refresh-ccw',     title: 'Reintegration & social inclusion',  body: 'Supporting people at risk of exclusion in returning to professional and social life.' },
      { icon: 'graduation-cap',  title: 'Digital skills & education',         body: 'Digital workshops, financial education, and combating digital exclusion.' },
      { icon: 'heart-handshake', title: 'Seniors & people with disabilities', body: 'Support, activation and independence programmes for seniors and disabled people.' },
      { icon: 'shield-check',    title: 'Prevention & health',                body: 'Counteracting addictions and social pathologies; prevention and health education.' },
      { icon: 'trending-up',     title: 'Entrepreneurship & innovation',      body: 'Supporting entrepreneurship, innovation and knowledge transfer through training and advisory.' },
      { icon: 'leaf',            title: 'Culture, ecology, equality',         body: 'Cultural and ecological projects and action for equal rights of women and men.' },
    ],
  }[lang];

  useEffectArea(() => {
    if (window.lucide) window.lucide.createIcons();
  }, [lang]);

  const t = lang === 'pl'
    ? { kicker: 'Obszary działania', h2: 'Czym się zajmujemy', intro: 'Nasze cele statutowe są szerokie — poniżej najważniejsze kierunki, w których realizujemy projekty.' }
    : { kicker: 'What we do',         h2: 'Our focus areas',     intro: 'Our statutory goals are broad — below are the most important directions where we deliver projects.' };

  return (
    <section id="obszary" className="section section-alt">
      <div className="container">
        <p className="kicker">{t.kicker}</p>
        <h2>{t.h2}</h2>
        <p className="section-intro">{t.intro}</p>
        <div className="cards">
          {areas.map((a, i) => (
            <article className="card" key={i}>
              <div className="card-ico">
                <i data-lucide={a.icon}></i>
              </div>
              <h3>{a.title}</h3>
              <p>{a.body}</p>
            </article>
          ))}
        </div>
      </div>
    </section>
  );
}

window.AreaCards = AreaCards;