/* Tweaks panel — uses TweaksPanel/useTweaks shell API */

const TWEAK_DEFAULTS = /*EDITMODE-BEGIN*/{
  "theme": "dark",
  "accent": "#5fa8ff",
  "density": "comfy",
  "fontScale": 100,
  "showSync": true,
  "sidebarCollapsed": false,
  "dashLayout": "bento",
  "researchLayout": "cards",
  "animations": true,
  "monoNumerals": false,
  "showHiddenColumns": false,
  "shortcutsEnabled": true,
  "locale": "fr",
  "currency": "CAD",
  "timezone": "America/Toronto",
  "dateFormat": "DD/MM/YYYY",
  "weekStart": "monday",
  "emailFreq": "daily",
  "emailTime": "07:00",
  "inAppNotifs": true,
  "criticalOnly": false,
  "soundOn": false,
  "emailKillSwitch": false,
  "stockThreshold": 20,
  "marginThreshold": 18,
  "bsrThreshold": 50000,
  "acosThreshold": 24,
  "referralDefault": 15,
  "fbaDefault": 4.50,
  "ppcCapDefault": 1.20,
  "showOnboarding": false,
  "autopilotOn": true
}/*EDITMODE-END*/;

const ACCENT_OPTIONS = ["#5fa8ff", "#7c3aed", "#10b981", "#f59e0b", "#ec4899"];

const KccTweaks = ({ t, setTweak }) => (
  <TweaksPanel title="Tweaks · KCC">
    <TweakSection label="Apparence" />
    <TweakRadio label="Thème" value={t.theme}
      options={["dark", "light"]}
      onChange={(v) => setTweak("theme", v)} />
    <TweakColor label="Accent" value={t.accent}
      options={ACCENT_OPTIONS}
      onChange={(v) => setTweak("accent", v)} />

    <TweakSection label="Densité & layout" />
    <TweakRadio label="Densité" value={t.density}
      options={["compact", "comfy"]}
      onChange={(v) => setTweak("density", v)} />
    <TweakSlider label="Échelle texte" value={t.fontScale} min={90} max={115} step={1} unit="%"
      onChange={(v) => setTweak("fontScale", v)} />
    <TweakToggle label="Sidebar réduite" value={t.sidebarCollapsed}
      onChange={(v) => setTweak("sidebarCollapsed", v)} />

    <TweakSection label="Layouts" />
    <TweakRadio label="Dashboard" value={t.dashLayout}
      options={["bento", "classic"]}
      onChange={(v) => setTweak("dashLayout", v)} />
    <TweakRadio label="Recherche" value={t.researchLayout}
      options={["cards", "grille"]}
      onChange={(v) => setTweak("researchLayout", v)} />

    <TweakSection label="Affichage" />
    <TweakToggle label="Pill sync (topbar)" value={t.showSync}
      onChange={(v) => setTweak("showSync", v)} />
  </TweaksPanel>
);

window.KccTweaks = KccTweaks;
window.TWEAK_DEFAULTS = TWEAK_DEFAULTS;