// Tweaks panel
const AbacoTweaks = ({ t, setTweak }) => {
  return (
    <TweaksPanel title="Ábaco · Tweaks">
      <TweakSection label="Aparência">
        <TweakColor
          label="Destaque"
          value={t.accent}
          options={['#0B71A1', '#00276D', '#00BDFF', '#373435']}
          onChange={(v) => setTweak('accent', v)}
        />
        <TweakRadio
          label="Layout ensinos"
          value={t.ensinosLayout}
          options={[
            { label: 'Cards', value: 'cards' },
            { label: 'Tabs', value: 'tabs' },
          ]}
          onChange={(v) => setTweak('ensinosLayout', v)}
        />
      </TweakSection>
      <TweakSection label="Comportamento">
        <TweakToggle label="Barra de avisos" value={t.showTopbar} onChange={(v) => setTweak('showTopbar', v)} />
        <TweakToggle label="WhatsApp flutuante" value={t.showWA} onChange={(v) => setTweak('showWA', v)} />
        <TweakToggle label="Micro-animações" value={t.animations} onChange={(v) => setTweak('animations', v)} />
      </TweakSection>
      <TweakSection label="Densidade">
        <TweakSlider label="Padding seções" min={60} max={140} step={4} unit="px" value={t.sectionPad} onChange={(v) => setTweak('sectionPad', v)} /></TweakSection>
    </TweaksPanel>
  );
};

window.AbacoTweaks = AbacoTweaks;