// Main App
const { useState: useStateA, useEffect: useEffectA } = React;
const S = window.Sections;

function App() {
  const [lang, setLang] = useStateA('pt-BR');
  const [currency, setCurrency] = useStateA(() => window.getCurrency('pt-BR'));

  useEffectA(() => {
    // Initial detection: keep PT-BR default but recompute currency for that lang
    setCurrency(window.getCurrency('pt-BR'));
  }, []);

  const handleSetLang = (newLang) => {
    setLang(newLang);
    setCurrency(window.getCurrency(newLang));
    document.documentElement.lang = newLang;
  };

  const t = window.translations[lang];

  return (
    <div className="min-h-screen bg-white">
      <S.Header lang={lang} setLang={handleSetLang} t={t} />
      <S.Hero t={t} />
      <S.TrustBar t={t} />
      <S.Features t={t} />
      <S.Benefits t={t} />
      <S.HowItWorks t={t} />
      <S.Showcase t={t} />
      <S.Testimonials t={t} />
      <S.Pricing t={t} currency={currency} />
      <S.FAQ t={t} />
      <S.FinalCTA t={t} />
      <S.Footer t={t} />
    </div>
  );
}

ReactDOM.createRoot(document.getElementById('root')).render(<App />);