// ─── Create Module — Drops Studio + Slips Editor ─────────
// Simple wrapper with sub-tab toggle. CSS prefix: CR-

function CreateModule(props) {
  var [mode, setMode] = useState('drops');
  return (
    <div style={{height:'100%',display:'flex',flexDirection:'column'}}>
      <div style={{display:'flex',gap:0,borderBottom:'1px solid var(--border)',flexShrink:0}}>
        <div className={'A-tab' + (mode === 'drops' ? ' on' : '')} onClick={function(){setMode('drops')}}>DROPS STUDIO</div>
        <div className={'A-tab' + (mode === 'slips' ? ' on' : '')} onClick={function(){setMode('slips')}}>SLIPS EDITOR</div>
      </div>
      <div style={{flex:1,overflow:'hidden'}}>
        {mode === 'drops' && <DropsModule {...props} />}
        {mode === 'slips' && <SlipsModule {...props} />}
      </div>
    </div>
  );
}