// Ledger Kas — double-entry view
function Ledger({ pushToast }) {
  const totalDebit = LEDGER.reduce((s,l)=>s+l.debit,0);
  const totalCredit = LEDGER.reduce((s,l)=>s+l.credit,0);
  const balance = totalDebit - totalCredit;
  const accounts = Array.from(new Set(LEDGER.map(l=>l.account)));
  return (
    <>
      <PageHeader eyebrow="Buku Besar" title="Ledger Kas & Jurnal" subtitle={`Mutasi demo ${LEDGER.length} baris, debit ${rupiah(totalDebit,{sym:true})}, kredit ${rupiah(totalCredit,{sym:true})}. Selisih sample ${rupiah(balance,{sym:true})}.`} actions={<><Btn icon="plus" tone="primary" onClick={()=>pushToast({msg:'Jurnal manual baru'})}>Jurnal Manual</Btn><Btn icon="download" tone="outline">Ekspor GL</Btn></>} />
      <div className="grid g-4" style={{marginBottom:16}}><Kpi label="Debit" value={rupiah(totalDebit,{sym:true,compact:true})}/><Kpi label="Kredit" value={rupiah(totalCredit,{sym:true,compact:true})}/><Kpi label="Net Mutasi" value={rupiah(balance,{sym:true,compact:true})}/><Kpi label="Akun Aktif" value={accounts.length}/></div>
      <div className="grid" style={{gridTemplateColumns:'1.25fr 0.75fr', gap:16}}>
        <Card><div style={{padding:'14px 16px', borderBottom:'1px solid hsl(var(--border))'}}><SectionHead title="Jurnal Ledger" hint="Format compact Source Code Pro" /></div><table className="table ledger-table"><thead><tr><th>Tanggal</th><th>Ref</th><th>Akun</th><th>Deskripsi</th><th style={{textAlign:'right'}}>Debit</th><th style={{textAlign:'right'}}>Kredit</th></tr></thead><tbody>{LEDGER.map(l => <tr key={l.id}><td>{l.date}</td><td><span className="ledger-ref">{l.ref}</span></td><td>{l.account}</td><td>{l.desc}</td><td className="debit" style={{textAlign:'right'}}>{l.debit?rupiah(l.debit,{sym:true}):'-'}</td><td className="credit" style={{textAlign:'right'}}>{l.credit?rupiah(l.credit,{sym:true}):'-'}</td></tr>)}</tbody></table></Card>
        <Card><div style={{padding:'14px 16px', borderBottom:'1px solid hsl(var(--border))'}}><SectionHead title="Saldo Akun Sample" /></div><div style={{padding:'14px 16px', display:'flex', flexDirection:'column', gap:10}}>{accounts.map(acc => { const val=LEDGER.filter(l=>l.account===acc).reduce((s,l)=>s+l.debit-l.credit,0); return <div key={acc} className="simpanan-card"><div className="row between"><b>{acc}</b><span className="mono" style={{fontWeight:700, color:val<0?'hsl(var(--destructive))':undefined}}>{rupiah(val,{sym:true})}</span></div></div>; })}<div className="callout accent"><Icon name="info" size={14}/><span>Ledger demo menampilkan jurnal operasional koperasi; produksi perlu periode tutup buku dan audit trail immutable.</span></div></div></Card>
      </div>
    </>
  );
}

window.Ledger = Ledger;