// Root
function App() {
  const [tweaks, setTweaks] = useState(window.__TWEAKS);
  const [modalOpen, setModalOpen] = useState(false);
  const [tweaksOpen, setTweaksOpen] = useState(false);

  // Apply accent/theme live
  useEffect(() => {
    document.documentElement.style.setProperty("--accent", tweaks.accent);
    document.documentElement.setAttribute("data-theme", tweaks.theme);
  }, [tweaks.accent, tweaks.theme]);

  // Tweaks host-protocol
  useEffect(() => {
    const onMsg = (e) => {
      if (!e.data) return;
      if (e.data.type === "__activate_edit_mode") setTweaksOpen(true);
      if (e.data.type === "__deactivate_edit_mode") setTweaksOpen(false);
    };
    window.addEventListener("message", onMsg);
    try { window.parent.postMessage({ type: "__edit_mode_available" }, "*"); } catch(e) {}
    return () => window.removeEventListener("message", onMsg);
  }, []);

  const lang = tweaks.lang || "tr";
  const c = CONTENT[lang];
  const setLang = (l) => setTweaks(t => ({ ...t, lang: l }));

  return (
    <>
      <Nav lang={lang} setLang={setLang} content={c} onContact={() => setModalOpen(true)} />
      {tweaks.showTicker && <Ticker items={c.ticker} />}
      <Hero c={c} />
      <Services c={c} />
      <Fleet c={c} />
      <About c={c} />
      <Coverage c={c} lang={lang} />
      <FAQ c={c} />
      <Contact c={c} lang={lang} />
      <BigCTA c={c} lang={lang} />
      <Footer c={c} lang={lang} />
      <WAFab lang={lang} />
      <MobileBar lang={lang} />
      <ContactModal open={modalOpen} onClose={() => setModalOpen(false)} info={c.contactInfo} lang={lang} />
      <TweaksPanel open={tweaksOpen} setOpen={setTweaksOpen} tweaks={tweaks} setTweaks={setTweaks} />
    </>
  );
}

ReactDOM.createRoot(document.getElementById("app")).render(<App />);
