/* Imprenditorialmente — Tweaks island
   Drives section variations via <body> classes. */
const TWEAK_DEFAULTS = /*EDITMODE-BEGIN*/{
  "atmosfera": "cool",
  "accento": "blu",
  "titoli": "serif",
  "hero": "editoriale",
  "servizi": "indice",
  "animazioni": true
}/*EDITMODE-END*/;

function applyTweaks(t) {
  const b = document.body;
  b.classList.toggle('tone-warm', t.atmosfera === 'warm');
  b.classList.toggle('tone-cool', t.atmosfera === 'cool');
  b.classList.toggle('accent-brass', t.accento === 'brass');
  b.classList.toggle('font-sans', t.titoli === 'sans');
  b.classList.toggle('hero-centered', t.hero === 'centrato');
  b.classList.toggle('serv-cards-on', t.servizi === 'schede');
  b.classList.toggle('motion-off', !t.animazioni);
}

function TweaksApp() {
  const [t, setTweak] = useTweaks(TWEAK_DEFAULTS);
  React.useEffect(() => { applyTweaks(t); }, [t]);
  return (
    <TweaksPanel title="Tweaks">
      <TweakSection label="Atmosfera" />
      <TweakRadio label="Carta" value={t.atmosfera}
        options={[{value:'warm',label:'Avorio'},{value:'cool',label:'Bianco'}]}
        onChange={(v) => setTweak('atmosfera', v)} />
      <TweakRadio label="Accento" value={t.accento}
        options={[{value:'blu',label:'Blu'},{value:'brass',label:'Ottone'}]}
        onChange={(v) => setTweak('accento', v)} />
      <TweakRadio label="Titoli" value={t.titoli}
        options={[{value:'serif',label:'Serif'},{value:'sans',label:'Sans'}]}
        onChange={(v) => setTweak('titoli', v)} />

      <TweakSection label="Sezioni" />
      <TweakRadio label="Hero" value={t.hero}
        options={[{value:'editoriale',label:'Editoriale'},{value:'centrato',label:'Centrato'}]}
        onChange={(v) => setTweak('hero', v)} />
      <TweakRadio label="Percorso" value={t.servizi}
        options={[{value:'indice',label:'Indice'},{value:'schede',label:'Schede'}]}
        onChange={(v) => setTweak('servizi', v)} />

      <TweakSection label="Movimento" />
      <TweakToggle label="Animazioni" value={t.animazioni}
        onChange={(v) => setTweak('animazioni', v)} />
    </TweaksPanel>
  );
}

// Apply defaults immediately (the EDITMODE block is the persisted source of truth).
applyTweaks(TWEAK_DEFAULTS);

ReactDOM.createRoot(document.getElementById('tweaks-root')).render(<TweaksApp />);
