const fields = {
  raised_emboss: [['embossHeight', 'Emboss height (mm)', 1.2, 0.4, 4], ['reliefStrength', 'Relief strength', 0.5, 0, 1], ['edgeSoftness', 'Edge softness', 0.3, 0, 1]],
  engraving: [['engravingDepth', 'Engraving depth (mm)', 0.8, 0.2, 3], ['edgeSoftness', 'Edge softness', 0.3, 0, 1]],
  colour_texture: []
};

export default function GeometrySettings({ mode, settings = {}, onChange }) {
  if (mode === 'sculpted_relief' || mode === 'stencil') {
    return <div className="warning-box">Sculpted Relief and Stencil are advanced modes requiring the connected external geometry engine — not available in the browser preview.</div>;
  }
  const list = fields[mode] || [];
  if (!list.length) return <p className="text-xs text-slate-500">Colour texture applies visual colour — no geometry change in preview.</p>;
  return (
    <div className="space-y-3">
      {list.map(([key, label, fallback, min, max]) => (
        <label key={key} className="form-label">{label}
          <input type="number" step="0.1" min={min} max={max} value={settings[key] ?? fallback} onChange={e => onChange({ ...settings, [key]: Number(e.target.value) })} className="field" />
        </label>
      ))}
    </div>
  );
}