// Rumbo — Accounts · v3 · Billetera Digital con gradientes y drawer
const { useState: useStA, useEffect: useEffA } = React;
const ACCOUNT_GRADIENTS = {
cash: ['#10B981','#059669'],
bank: ['#2563EB','#1D4ED8'],
digital: ['#7C3AED','#6D28D9'],
investment: ['#F59E0B','#D97706'],
};
const ACCOUNT_ICONS = { cash:'banknote', bank:'landmark', digital:'smartphone', investment:'trending' };
const ACCOUNT_LABELS = { cash:'Efectivo', bank:'Cuenta bancaria', digital:'Billetera digital', investment:'Inversión' };
/* ── Tarjeta estilo wallet ── */
const WalletCard = ({ account, transactions, selectedMonth, recurringIncomes = [], fixedExpenses = [], debts = [] }) => {
const [g1, g2] = ACCOUNT_GRADIENTS[account.type] || ['#2563EB','#1D4ED8'];
const todayKey = `${new Date().getFullYear()}-${String(new Date().getMonth()+1).padStart(2,'0')}`;
const curMonth = selectedMonth || todayKey;
const isFutureMonth = curMonth > todayKey;
const isCurrentMonth = curMonth === todayKey;
// Movimientos del mes seleccionado (no globales)
const monthTxs = transactions.filter(t => t.accountId === account.id && (t.date||'').startsWith(curMonth));
const monthInc = monthTxs.filter(t => t.type === 'income').reduce((s,t)=>s+t.amount, 0);
const monthExp = monthTxs.filter(t => t.type === 'expense').reduce((s,t)=>s+t.amount, 0);
const monthDelta = monthInc - monthExp;
// Proyección de la cuenta para el mes — solo ingresos recurrentes (tienen accountId).
// Los gastos fijos / cuotas no tienen accountId en el modelo, así que no los atribuimos por cuenta
// (mostrarlos repetidos en cada card sería engañoso). Se ven en el hero global.
const projectedIncomeForAccount = (typeof getDueDatesInMonth === 'function')
? recurringIncomes.filter(r => r.active && r.accountId === account.id)
.reduce((s, r) => s + getDueDatesInMonth(r, curMonth).length * r.amount, 0)
: 0;
// Mostramos el saldo actual de la cuenta (no calculamos retroactivo: los balances iniciales
// del demo no son derivados de las tx, así que el cálculo daría números incoherentes).
// El "cómo te fue" en el mes lo expresamos por el delta y los stats abajo.
const displayBalance = account.balance;
// Recientes del mes seleccionado (no globales)
const recentTxs = [...monthTxs].sort((a,b) => b.date.localeCompare(a.date)).slice(0, 3);
const balanceLabel = 'saldo actual';
return (
{/* Cabecera tipo tarjeta de crédito */}
{ACCOUNT_LABELS[account.type] || account.type}
{account.name}
{fmtFull(displayBalance, account.currency)}
{account.currency}·{balanceLabel}
{/* (Antes había un chip flotante con el delta del mes — se sacó porque era ambiguo.
Los stats "Ingresos del mes / Gastos del mes" abajo ya cubren esa info de forma clara.) */}
{/* Stats — anclados al mes. En futuro: ingresos esperados (atribuidos por accountId);
los gastos no se atribuyen por cuenta porque fixedExpenses no tienen accountId. */}