// === Tokai CAIO — App root ===
const { useEffect } = React;

function App() {
  const [tweaks, setTweak] = useTweaks(TWEAK_DEFAULTS);

  useEffect(() => {
    const html = document.documentElement;
    html.classList.toggle("theme-dark", tweaks.theme === "dark");
  }, [tweaks.theme]);

  return (
    <>
      <Header />
      <main>
        <Hero />
        <About />
        <Pain />
        <Domain />
        <Plans />
        <Flow />
        <Profile />
        <FAQ />
        <FinalCTA />
      </main>
      <Footer />

      <TweaksPanel title="Tweaks">
        <TweakSection label="Theme">
          <TweakRadio
            label="モード"
            value={tweaks.theme}
            options={[
              { value: "light", label: "Cream" },
              { value: "dark", label: "Sumi" },
            ]}
            onChange={(v) => setTweak("theme", v)}
          />
        </TweakSection>
      </TweaksPanel>
    </>
  );
}

const TWEAK_DEFAULTS = /*EDITMODE-BEGIN*/{
  "theme": "light"
}/*EDITMODE-END*/;

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