@extends('crm.layouts.master')
@section('title', $lead->fname . ' Portfolio')
@section('page-css')
    <link rel="stylesheet" href="{{ asset('assets/styles/vendor/datatables.min.css') }}">
@endsection
@section('main-content')

{{-- ── Page header ── --}}
<div class="page-title-head d-flex align-items-sm-center flex-sm-row flex-column gap-2 mb-3">
    <div class="flex-grow-1">
        <h4 class="fs-xl fw-bold mb-1">{{ $lead->fname }} {{ $lead->lname }}</h4>
        <ol class="breadcrumb mb-0 p-0">
            <li class="breadcrumb-item"><a href="{{ route('crm.dashboard') }}">Dashboard</a></li>
            <li class="breadcrumb-item"><a href="{{ route('trading.trades') }}">Trading</a></li>
            <li class="breadcrumb-item active">Portfolio</li>
        </ol>
    </div>
    <div class="d-flex gap-2 flex-shrink-0">
        <button class="btn btn-primary btn-sm" data-toggle="modal" data-target="#exec_trade_modal">
            <i class="fa fa-exchange-alt me-1"></i> Execute Trade
        </button>
        @if($canCreateDeposit)
            <button class="btn btn-success btn-sm" data-toggle="modal" data-target="#add_deposit_modal">
                <i class="fa fa-plus me-1"></i> New Deposit
            </button>
        @endif
        <a href="{{ route('lead_detail', ['id' => $lead->id]) }}" class="btn btn-outline-secondary btn-sm">
            ← Lead Profile
        </a>
    </div>
</div>

@if(session('success'))
<div class="alert alert-success alert-dismissible fade show" role="alert">
    {{ session('success') }}
    <button type="button" class="close" data-dismiss="alert">&times;</button>
</div>
@endif

<div class="card mb-3"><div class="card-body d-flex align-items-end gap-3 flex-wrap"><div><strong>Automated leveraged trading</strong><div class="text-muted small">Consent: {{ $automationSetting->client_consented?'Yes':'No' }} · Admin approval: {{ $automationSetting->admin_approved?'Yes':'No' }} · Sandbox: {{ $automationSetting->sandbox_enabled?'On':'Off' }}</div></div><form class="d-flex align-items-end gap-2 ms-auto" method="POST" action="{{ route('trading.ai.client-risk',$lead) }}">@csrf @method('PUT')<div><label class="small">Risk profile</label><select name="risk_profile" class="form-control"><option value="conservative" @selected($automationSetting->risk_profile==='conservative')>Conservative</option><option value="moderate" @selected($automationSetting->risk_profile==='moderate')>Moderate</option><option value="aggressive" @selected($automationSetting->risk_profile==='aggressive')>Aggressive</option></select></div><button class="btn btn-primary">Update</button></form></div></div>
@if(session('status'))
<div class="alert alert-info alert-dismissible fade show" role="alert">
    {{ session('status') }}
    <button type="button" class="close" data-dismiss="alert">&times;</button>
</div>
@endif
@if(session('error'))
<div class="alert alert-danger alert-dismissible fade show" role="alert">
    <strong>Trade rejected:</strong> {{ session('error') }}
    <button type="button" class="close" data-dismiss="alert">&times;</button>
</div>
@endif
@if($errors->any() && session()->hasOldInput('side'))
<div class="alert alert-danger alert-dismissible fade show" role="alert">
    <strong>Trade rejected:</strong> {{ $errors->first() }}
    <button type="button" class="close" data-dismiss="alert">&times;</button>
</div>
@endif

{{-- ══════════════════════════════════════════════
     KPI STRIP — PACES finance style
══════════════════════════════════════════════ --}}
@php
    /* Build SVG sparkline from an array of floats */
    $mkSparkline = function(array $vals, string $stroke) {
        $w = 220; $h = 52; $pad = 3;
        if (count($vals) < 2) {
            $mid = $h / 2;
            return "<svg viewBox=\"0 0 {$w} {$h}\" preserveAspectRatio=\"none\" style=\"display:block;width:100%;height:{$h}px\"><line x1=\"0\" y1=\"{$mid}\" x2=\"{$w}\" y2=\"{$mid}\" stroke=\"{$stroke}\" stroke-width=\"1.5\" fill=\"none\" opacity=\".6\"/></svg>";
        }
        $min = min($vals); $max = max($vals);
        $range = ($max - $min) ?: 1;
        $n = count($vals) - 1;
        $pts = [];
        foreach ($vals as $i => $v) {
            $x = round($i / $n * $w, 2);
            $y = round($h - $pad - (($v - $min) / $range) * ($h - $pad * 2), 2);
            $pts[] = "$x,$y";
        }
        $d = 'M ' . implode(' L ', $pts);
        // Fill area under curve
        $fill = "M 0,{$h} L " . implode(' L ', $pts) . " L {$w},{$h} Z";
        $colorRgb = $stroke === '#0d6efd' ? '13,110,253' : ($stroke === '#198754' ? '25,135,84' : ($stroke === '#fd7e14' ? '253,126,20' : '108,117,125'));
        return "<svg viewBox=\"0 0 {$w} {$h}\" preserveAspectRatio=\"none\" style=\"display:block;width:100%;height:{$h}px\">
  <path d=\"{$fill}\" fill=\"rgba({$colorRgb},.08)\"/>
  <path d=\"{$d}\" stroke=\"{$stroke}\" stroke-width=\"2\" fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>
</svg>";
    };

    /* Price history for first open position → used for "Position Value" sparkline */
    $firstPos = $portfolio['positions']->first();
    $posSparkVals = [];
    if ($firstPos) {
        $hist = $priceHistories[$firstPos['position']->symbol_id] ?? collect();
        $posSparkVals = $hist->pluck('price')->map(fn($v) => (float)$v)->values()->toArray();
        /* Scale to USD position value (multiply by qty) */
        $qty = (float) $firstPos['position']->quantity;
        $posSparkVals = array_map(fn($p) => $p * $qty, $posSparkVals);
    }

    /* Equity sparkline = position value curve shifted by totalCash */
    $eqSparkVals = array_map(fn($v) => $v + (float)$portfolio['totalCash'], $posSparkVals);

    $ks = $lead->kyc_status;
    $kycColor   = $ks === 'approved' ? '#198754' : ($ks === 'rejected' ? '#dc3545' : '#fd7e14');
    $kycLabel   = ucwords(str_replace('_', ' ', $ks));
@endphp

<style>
.pf-kpi-row { display:grid; grid-template-columns:repeat(4,1fr); gap:.75rem; margin-bottom:1rem; }
@media(max-width:991px){ .pf-kpi-row{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:575px){ .pf-kpi-row{ grid-template-columns:1fr; } }
.pf-kpi-card { background:#fff; border:1px solid rgba(0,0,0,.06); border-radius:.5rem; box-shadow:0 1px 4px rgba(0,0,0,.06); overflow:hidden; }
.pf-kpi-card .pf-kpi-body { padding:1rem 1rem .5rem; }
.pf-kpi-card .pf-kpi-icon { width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0; }
.pf-kpi-card .pf-kpi-label { font-size:.68rem;text-transform:uppercase;letter-spacing:.04em;font-weight:600;color:#6c757d;margin-bottom:.35rem; }
.pf-kpi-card .pf-kpi-value { font-size:1.55rem;font-weight:700;line-height:1.1;margin-bottom:.25rem; }
.pf-kpi-card .pf-kpi-sub   { font-size:.73rem;color:#6c757d; }
.pf-kpi-card .pf-kpi-spark { padding:0; line-height:0; }
</style>

<div class="pf-kpi-row">

    {{-- ① Total Cash --}}
    <div class="pf-kpi-card">
        <div class="pf-kpi-body d-flex justify-content-between align-items-start gap-2">
            <div style="min-width:0">
                <div class="pf-kpi-label">USD Cash</div>
                <div class="pf-kpi-value text-success">
                    ${{ number_format($portfolio['totalCash'], 2) }}
                </div>
                <div class="pf-kpi-sub">Trading available: ${{ number_format($portfolio['totalAvailable'], 2) }}</div>
            </div>
            <div class="pf-kpi-icon" style="background:rgba(25,135,84,.12)">
                <i class="fas fa-wallet" style="color:#198754"></i>
            </div>
        </div>
        <div class="pf-kpi-spark">{!! $mkSparkline(array_fill(0, 10, (float)$portfolio['totalCash']), '#198754') !!}</div>
    </div>

    {{-- ② Non-withdrawable trading credit --}}
    <div class="pf-kpi-card">
        <div class="pf-kpi-body d-flex justify-content-between align-items-start gap-2"><div style="min-width:0"><div class="pf-kpi-label">USD Credit</div><div class="pf-kpi-value text-primary">${{ number_format($portfolio['creditBalance'], 2) }}</div><div class="pf-kpi-sub">Trading only · not withdrawable</div></div><div class="pf-kpi-icon" style="background:rgba(13,110,253,.12)"><i class="fas fa-gift" style="color:#0d6efd"></i></div></div>
        <div class="pf-kpi-spark">{!! $mkSparkline(array_fill(0, 10, (float)$portfolio['creditBalance']), '#0d6efd') !!}</div>
    </div>

    {{-- ③ Position Value --}}
    <div class="pf-kpi-card">
        <div class="pf-kpi-body d-flex justify-content-between align-items-start gap-2">
            <div style="min-width:0">
                <div class="pf-kpi-label">Position Value</div>
                <div class="pf-kpi-value text-warning" data-portfolio-position-value>
                    ${{ number_format($valuation['position_market_value'], 2) }}
                </div>
                <div class="pf-kpi-sub">
                    {{ $valuation['counts']['total'] }} open position{{ $valuation['counts']['total'] !== 1 ? 's' : '' }}
                </div>
            </div>
            <div class="pf-kpi-icon" style="background:rgba(253,126,20,.12)">
                <i class="fas fa-layer-group" style="color:#fd7e14"></i>
            </div>
        </div>
        <div class="pf-kpi-spark">{!! $mkSparkline($posSparkVals, '#fd7e14') !!}</div>
    </div>

    {{-- ③ Total Equity --}}
    <div class="pf-kpi-card" style="border-color:rgba(13,110,253,.25)">
        <div class="pf-kpi-body d-flex justify-content-between align-items-start gap-2">
            <div style="min-width:0">
                <div class="pf-kpi-label" style="color:#0d6efd">Total Equity</div>
                <div class="pf-kpi-value text-primary" data-portfolio-equity>
                    ${{ number_format($valuation['equity'], 2) }}
                </div>
                <div class="pf-kpi-sub">Cash + Positions</div>
            </div>
            <div class="pf-kpi-icon" style="background:rgba(13,110,253,.12)">
                <i class="fas fa-chart-pie" style="color:#0d6efd"></i>
            </div>
        </div>
        <div class="pf-kpi-spark">{!! $mkSparkline($eqSparkVals, '#0d6efd') !!}</div>
    </div>

    {{-- ④ KYC Status --}}
    <div class="pf-kpi-card">
        <div class="pf-kpi-body d-flex justify-content-between align-items-start gap-2">
            <div style="min-width:0">
                <div class="pf-kpi-label">KYC Status</div>
                <div class="pf-kpi-value" style="font-size:1.1rem;padding-top:.3rem">
                    <span class="badge px-3 py-2" style="background:{{ $kycColor }};font-size:.85rem">
                        {{ $kycLabel }}
                    </span>
                </div>
                <div class="pf-kpi-sub mt-1">Client #{{ $lead->id }}</div>
            </div>
            <div class="pf-kpi-icon" style="background:rgba(108,117,125,.1)">
                <i class="fas fa-id-card" style="color:#6c757d"></i>
            </div>
        </div>
        <div class="pf-kpi-spark">{!! $mkSparkline([], '#6c757d') !!}</div>
    </div>

</div>

<div class="alert {{ $valuation['is_complete'] ? 'alert-light' : 'alert-warning' }} py-2 mb-3 d-flex flex-wrap gap-3 align-items-center">
    <strong>Position mix:</strong>
    <span>{{ $valuation['counts']['regular'] }} asset</span>
    <span>{{ $valuation['counts']['leveraged'] }} leveraged</span>
    <span>{{ $valuation['counts']['prediction'] }} prediction</span>
    <span>{{ $valuation['counts']['binary'] }} binary</span>
    @if(!$valuation['is_complete'])<span class="ms-auto">Some values use delayed or fallback pricing.</span>@endif
</div>

{{-- ══════════════════════════════════════════════
     USD WALLET STRIP
══════════════════════════════════════════════ --}}
<div class="card mb-3">
    <div class="card-body py-2">
        <div class="d-flex align-items-center flex-wrap gap-3">

            <span class="text-muted text-uppercase fs-xs fw-semibold me-1" style="white-space:nowrap">Wallets:</span>

            @foreach($portfolio['wallets'] as $currency => $wallet)
            <div class="d-flex align-items-center gap-1">
                <span class="badge {{ ($lead->main_currency ?? 'USD') === $currency ? 'bg-primary' : 'bg-secondary' }} me-1"
                      style="font-size:.65rem">{{ $currency }}</span>
                <span class="fw-semibold" style="font-size:.95rem">{{ number_format($wallet->balance, 2) }}</span>
                @if(($lead->main_currency ?? 'USD') === $currency)
                    <span class="badge bg-primary ms-1" style="font-size:.6rem">Main</span>
                @endif
            </div>
            @endforeach

            <div class="ms-auto text-muted fs-xs fw-semibold text-uppercase">Account currency: USD</div>

        </div>
    </div>
</div>

{{-- ══════════════════════════════════════════════
     OPEN POSITIONS — full width
══════════════════════════════════════════════ --}}
<div class="row g-3 mb-3">
    <div class="col-12">
        <div class="card h-100">
            <div class="card-header d-flex justify-content-between align-items-center">
                <h5 class="mb-0 fw-semibold">
                    <i class="fas fa-layer-group me-2 text-primary"></i>Asset Positions
                </h5>
                <span class="badge bg-soft-primary text-primary">
                    {{ $portfolio['positions']->count() }} position{{ $portfolio['positions']->count() !== 1 ? 's' : '' }}
                </span>
            </div>
            <div class="card-body p-0">
                @if($portfolio['positions']->isEmpty())
                    <div class="text-center text-muted py-5">
                        <i class="fas fa-inbox fs-2 d-block mb-2"></i>
                        No open positions.
                    </div>
                @else
                <div class="table-responsive">
                    <table class="table table-sm table-hover mb-0" style="font-size:.82rem">
                        <thead class="table-light">
                        <tr>
                            <th>Symbol</th>
                            <th class="text-end">Qty</th>
                            <th class="text-end">Avg</th>
                            <th class="text-end">Price</th>
                            <th class="text-end">Value</th>
                            <th class="text-end">P&L</th>
                            <th class="text-end">Action</th>
                        </tr>
                        </thead>
                        <tbody>
                        @foreach($portfolio['positions'] as $row)
                        @php
                            $symId   = $row['position']->symbol_id;
                            $history = $priceHistories[$symId] ?? collect();
                            $pnlPct  = ($row['position']->avg_price > 0 && $row['latest_price'] > 0)
                                ? (($row['latest_price'] - $row['position']->avg_price) / $row['position']->avg_price) * 100
                                : 0;
                        @endphp
                        <tr style="cursor:pointer" onclick="toggleChart({{ $symId }})" data-asset-position="{{ $row['position']->id }}" data-decimals="{{ $row['symbol']->decimal_places ?? 2 }}">
                            <td>
                                <div class="fw-semibold">{{ $row['symbol']->name ?? '—' }} <span class="badge bg-secondary-subtle text-secondary">{{ $row['position']->currency ?? 'USD' }}</span></div>
                                <div class="text-muted" style="font-size:.72rem">{{ $row['symbol']->tv_symbol ?? '' }}</div>
                            </td>
                            <td class="text-end">{{ rtrim(rtrim(number_format($row['position']->quantity, 8), '0'), '.') }}</td>
                            <td class="text-end text-muted">{{ number_format($row['position']->avg_price, 2) }}</td>
                            <td class="text-end"><span data-asset-current>{{ $row['latest_price'] > 0 ? number_format($row['latest_price'], $row['symbol']->decimal_places ?? 2) : '—' }}</span><small class="d-block badge bg-secondary-subtle text-secondary mt-1" data-asset-price-status>Updating</small></td>
                            <td class="text-end fw-semibold" data-asset-value>USD {{ number_format($row['current_value'], 2) }}</td>
                            <td class="text-end fw-semibold {{ $row['unrealised_pnl'] >= 0 ? 'text-success' : 'text-danger' }}" data-asset-pnl>
                                @if($row['latest_price'] > 0)
                                    {{ ($row['unrealised_pnl'] >= 0 ? '+' : '') . number_format($row['unrealised_pnl'], 2) }}
                                    <div style="font-size:.7rem;font-weight:400">{{ ($pnlPct >= 0 ? '+' : '') . number_format($pnlPct, 2) }}%</div>
                                @else
                                    —
                                @endif
                            </td>
                            <td class="text-end" onclick="event.stopPropagation()">
                                <div class="d-flex gap-1 justify-content-end flex-wrap">
                                @if($row['latest_price'] > 0)
                                <button type="button" class="btn btn-xs btn-danger"
                                    onclick="openCloseModal(
                                        {{ $row['position']->id }},
                                        {{ $row['position']->symbol_id }},
                                        '{{ addslashes($row['symbol']->name ?? '?') }}',
                                        {{ (float) $row['position']->quantity }},
                                        {{ $row['latest_price'] }},
                                        {{ $row['current_value'] }},
                                        '{{ $row['position']->currency ?? 'USD' }}'
                                    )">Close</button>
                                @endif
                                <button type="button" class="btn btn-xs btn-warning"
                                    onclick="openAdjustModal(
                                        {{ $row['position']->id }},
                                        '{{ addslashes($row['symbol']->name ?? '?') }}',
                                        {{ (float) $row['position']->quantity }},
                                        {{ (float) $row['position']->avg_price }},
                                        '{{ $row['position']->currency ?? 'USD' }}'
                                    )">Adj</button>
                                </div>
                            </td>
                        </tr>
                        <tr id="chart_row_{{ $symId }}" style="display:none">
                            <td colspan="7" style="padding:0;background:#131722">
                                @if($history->isEmpty())
                                <div style="padding:1.25rem;text-align:center;color:#6b7280;font-size:.82rem">No price data recorded yet.</div>
                                @else
                                <div style="padding:.4rem .75rem .2rem;color:#9ca3af;font-size:.7rem;text-transform:uppercase;letter-spacing:.3px">
                                    {{ $row['symbol']->name ?? '' }} · Price History
                                    <span style="color:#f59e0b;margin-left:.5rem">— Entry @ {{ number_format($row['position']->avg_price, 2) }}</span>
                                </div>
                                <div id="chart_{{ $symId }}" style="width:100%;height:240px"
                                     data-history='@json($history->map(fn($p) => ["time" => $p->priced_at->timestamp, "value" => (float)$p->price])->values())'
                                     data-avg="{{ (float)$row['position']->avg_price }}"
                                     data-pnl="{{ $pnlPct }}">
                                </div>
                                @endif
                            </td>
                        </tr>
                        @endforeach
                        </tbody>
                    </table>
                </div>
                @endif
            </div>
        </div>
    </div>
</div>{{-- /row open-positions --}}

<div class="card mb-3">
    <div class="card-header d-flex justify-content-between align-items-center">
        <h5 class="mb-0 fw-semibold"><i class="fas fa-clock-rotate-left me-2 text-primary"></i>All Trades</h5>
        <span class="badge bg-primary-subtle text-primary">{{ $allHistory->total() }} position{{ $allHistory->total() === 1 ? '' : 's' }}</span>
    </div>
    <div class="card-body p-0">@include('shared.trade-history-timeline', ['history' => $allHistory])</div>
</div>

@if($valuation['leveraged_rows']->isNotEmpty())
<div class="card mb-3">
    <div class="card-header d-flex justify-content-between align-items-center"><h5 class="mb-0 fw-semibold"><i class="fas fa-bolt me-2 text-warning"></i>Leveraged Positions</h5><span class="badge bg-warning-subtle text-warning">{{ $valuation['counts']['leveraged'] }} open</span></div>
    <div class="card-body p-0"><div class="table-responsive"><table class="table table-sm table-hover table-nowrap mb-0" style="font-size:.82rem">
        <thead class="table-light"><tr><th>Instrument</th><th>Direction</th><th class="text-end">Leverage</th><th class="text-end">Units</th><th class="text-end">Margin</th><th class="text-end">Exposure</th><th class="text-end">Entry</th><th>Opened (UTC)</th><th class="text-end">Current</th><th class="text-end">Stop Loss</th><th class="text-end">Take Profit</th><th class="text-end">P&amp;L</th><th class="text-end">Value</th><th>Price</th><th class="text-end">Action</th></tr></thead>
        <tbody>@foreach($valuation['leveraged_rows'] as $row)
            @php $position = $row['position']; $decimals = $position->symbol?->decimal_places ?? 4; $units = $position->entry_price > 0 ? $position->exposure / $position->entry_price : 0; @endphp
            <tr data-leveraged-position="{{ $position->id }}" data-decimals="{{ $decimals }}"><td><div class="fw-semibold">{{ $position->symbol?->name ?? 'Unknown' }}</div><small class="text-muted">{{ $position->symbol?->display_symbol ?? $position->symbol?->symbol }}</small></td><td class="fw-semibold {{ $position->direction === 'up' ? 'text-success' : 'text-danger' }}">{{ strtoupper($position->direction) }}</td><td class="text-end">{{ $position->leverage }}×</td><td class="text-end">{{ rtrim(rtrim(number_format($units, 8, '.', ''), '0'), '.') }}</td><td class="text-end">USD {{ number_format($position->margin, 2) }}@if((float)$position->credit_margin > 0)<small class="d-block text-muted">Credit {{ number_format($position->credit_margin, 2) }}</small>@endif</td><td class="text-end">USD {{ number_format($position->exposure, 2) }}</td><td class="text-end">{{ number_format($position->entry_price, $decimals) }}</td><td>{{ $position->opened_at?->utc()->format('Y-m-d H:i') ?? '—' }}</td><td class="text-end" data-leveraged-current>{{ number_format($row['latest'], $decimals) }}</td><td class="text-end">{{ $position->stop_loss !== null ? number_format($position->stop_loss, $decimals) : '—' }}</td><td class="text-end">{{ $position->take_profit !== null ? number_format($position->take_profit, $decimals) : '—' }}</td><td class="text-end fw-semibold {{ $row['pnl'] >= 0 ? 'text-success' : 'text-danger' }}" data-leveraged-pnl>{{ $row['pnl'] >= 0 ? '+' : '' }}USD {{ number_format($row['pnl'], 2) }}</td><td class="text-end fw-semibold" data-leveraged-value>USD {{ number_format($row['value'], 2) }}</td><td><span class="badge {{ $row['priceStatus'] === 'current' ? 'bg-success-subtle text-success' : ($row['priceStatus'] === 'delayed' ? 'bg-warning-subtle text-warning' : 'bg-secondary-subtle text-secondary') }}" data-leveraged-price-status>{{ ucfirst($row['priceStatus']) }}</span></td><td class="text-end"><div class="d-flex gap-1 justify-content-end"><form method="POST" action="{{ route('trading.portfolio.leveraged.close', $position) }}" class="d-inline crm-leveraged-close-form" data-symbol="{{ $position->symbol?->name ?? 'this instrument' }}">@csrf<button type="submit" class="btn btn-sm btn-outline-danger crm-leveraged-close-button">Close</button></form><button type="button" class="btn btn-sm btn-warning leveraged-adjust-button"
                data-position-id="{{ $position->id }}" data-symbol="{{ $position->symbol?->name ?? 'Unknown' }}" data-status="{{ $position->status }}" data-direction="{{ $position->direction }}" data-entry-price="{{ $position->entry_price }}" data-opened-at="{{ $position->opened_at?->utc()->format('Y-m-d\\TH:i') }}" data-units="{{ $units }}" data-leverage="{{ $position->leverage }}" data-margin="{{ $position->margin }}" data-cash-margin="{{ $position->cash_margin }}" data-credit-margin="{{ $position->credit_margin }}" data-stop-loss="{{ $position->stop_loss }}" data-take-profit="{{ $position->take_profit }}" data-close-price="" data-realized-pnl="" data-version="{{ $position->version }}" data-adjust-url="{{ route('trading.portfolio.leveraged.adjust', $position) }}">Adjust</button></div></td></tr>
        @endforeach</tbody>
    </table></div></div>
</div>
@endif

<div class="card mb-3">
    <div class="card-header d-flex justify-content-between align-items-center"><h5 class="mb-0 fw-semibold"><i class="fas fa-history me-2 text-secondary"></i>Leveraged Position History</h5><span class="badge bg-secondary-subtle text-secondary">{{ $leveragedHistory->count() }} completed</span></div>
    <div class="card-body p-0"><div class="table-responsive"><table class="table table-sm table-hover table-nowrap mb-0" style="font-size:.82rem">
        <thead class="table-light"><tr><th>Instrument</th><th>Direction</th><th>Status</th><th class="text-end">Leverage</th><th class="text-end">Units</th><th class="text-end">Entry</th><th class="text-end">Close</th><th>Opened (UTC)</th><th>Closed (UTC)</th><th class="text-end">Margin</th><th class="text-end">Realized P&amp;L</th><th class="text-end">Action</th></tr></thead>
        <tbody>
        @forelse($leveragedHistory as $position)
            @php $decimals = $position->symbol?->decimal_places ?? 4; $units = $position->entry_price > 0 ? $position->exposure / $position->entry_price : 0; @endphp
            <tr><td><div class="fw-semibold">{{ $position->symbol?->name ?? 'Unknown' }}</div><small class="text-muted">{{ $position->symbol?->display_symbol ?? $position->symbol?->symbol }}</small></td><td class="fw-semibold {{ $position->direction === 'up' ? 'text-success' : 'text-danger' }}">{{ strtoupper($position->direction) }}</td><td><span class="badge {{ $position->status === 'liquidated' ? 'bg-danger-subtle text-danger' : 'bg-secondary-subtle text-secondary' }}">{{ ucfirst($position->status) }}</span></td><td class="text-end">{{ $position->leverage }}×</td><td class="text-end">{{ rtrim(rtrim(number_format($units, 8, '.', ''), '0'), '.') }}</td><td class="text-end">{{ number_format($position->entry_price, $decimals) }}</td><td class="text-end">{{ number_format($position->close_price, $decimals) }}</td><td>{{ $position->opened_at?->utc()->format('Y-m-d H:i') ?? '—' }}</td><td>{{ $position->closed_at?->utc()->format('Y-m-d H:i') ?? '—' }}</td><td class="text-end">USD {{ number_format($position->margin, 2) }}</td><td class="text-end fw-semibold {{ (float)$position->realized_pnl >= 0 ? 'text-success' : 'text-danger' }}">{{ (float)$position->realized_pnl >= 0 ? '+' : '' }}USD {{ number_format($position->realized_pnl, 2) }}</td><td class="text-end"><button type="button" class="btn btn-sm btn-warning leveraged-adjust-button"
                data-position-id="{{ $position->id }}" data-symbol="{{ $position->symbol?->name ?? 'Unknown' }}" data-status="{{ $position->status }}" data-direction="{{ $position->direction }}" data-entry-price="{{ $position->entry_price }}" data-opened-at="{{ $position->opened_at?->utc()->format('Y-m-d\\TH:i') }}" data-units="{{ $units }}" data-leverage="{{ $position->leverage }}" data-margin="{{ $position->margin }}" data-cash-margin="{{ $position->cash_margin }}" data-credit-margin="{{ $position->credit_margin }}" data-stop-loss="{{ $position->stop_loss }}" data-take-profit="{{ $position->take_profit }}" data-close-price="{{ $position->close_price }}" data-realized-pnl="{{ $position->realized_pnl }}" data-version="{{ $position->version }}" data-adjust-url="{{ route('trading.portfolio.leveraged.adjust', $position) }}">Adjust</button></td></tr>
        @empty
            <tr><td colspan="12" class="text-center text-muted py-4">No completed leveraged positions yet.</td></tr>
        @endforelse
        </tbody>
    </table></div></div>
</div>

@if($valuation['prediction_rows']->isNotEmpty())
<div class="card mb-3">
    <div class="card-header d-flex justify-content-between align-items-center"><h5 class="mb-0 fw-semibold"><i class="fas fa-chart-line me-2 text-info"></i>Prediction-Market Positions</h5><span class="badge bg-info-subtle text-info">{{ $valuation['counts']['prediction'] }} open</span></div>
    <div class="card-body p-0"><div class="table-responsive"><table class="table table-sm table-hover table-nowrap mb-0" style="font-size:.82rem">
        <thead class="table-light"><tr><th>Market</th><th>Outcome</th><th class="text-end">Shares</th><th class="text-end">Average</th><th class="text-end">Current</th><th class="text-end">Cost</th><th class="text-end">Value</th><th class="text-end">P&amp;L</th><th>Price</th></tr></thead>
        <tbody>@foreach($valuation['prediction_rows'] as $row)@php $pnl=(float)($row['value']??0)-(float)($row['cost']??0); @endphp
            <tr><td style="white-space:normal;min-width:260px">{{ $row['position']->question }}</td><td class="fw-semibold">{{ $row['position']->outcome }}</td><td class="text-end">{{ rtrim(rtrim(number_format($row['shares'], 8), '0'), '.') }}</td><td class="text-end">{{ number_format($row['average'] * 100, 2) }}¢</td><td class="text-end">{{ number_format($row['latest'] * 100, 2) }}¢</td><td class="text-end">USD {{ number_format($row['cost'] ?? 0, 2) }}</td><td class="text-end">USD {{ number_format($row['value'] ?? 0, 2) }}</td><td class="text-end fw-semibold {{ $pnl >= 0 ? 'text-success' : 'text-danger' }}">{{ $pnl >= 0 ? '+' : '' }}USD {{ number_format($pnl, 2) }}</td><td>{{ ucfirst($row['priceStatus']) }}</td></tr>
        @endforeach</tbody>
    </table></div></div>
</div>
@endif

@if($valuation['binary_rows']->isNotEmpty())
<div class="card mb-3">
    <div class="card-header d-flex justify-content-between align-items-center"><h5 class="mb-0 fw-semibold"><i class="fas fa-hourglass-half me-2 text-danger"></i>Open Binary Options</h5><span class="badge bg-danger-subtle text-danger">{{ $valuation['counts']['binary'] }} open</span></div>
    <div class="card-body p-0"><div class="table-responsive"><table class="table table-sm table-hover table-nowrap mb-0" style="font-size:.82rem">
        <thead class="table-light"><tr><th>Instrument</th><th>Direction</th><th class="text-end">Strike</th><th class="text-end">Stake at Cost</th><th>Opened</th><th>Expires</th><th>Status</th></tr></thead>
        <tbody>@foreach($valuation['binary_rows'] as $row)<tr><td class="fw-semibold">{{ $row['option']->symbol?->name ?? 'Unknown' }}</td><td class="fw-semibold {{ $row['option']->direction === 'call' ? 'text-success' : 'text-danger' }}">{{ strtoupper($row['option']->direction) }}</td><td class="text-end">{{ number_format($row['option']->strike_price, $row['option']->symbol?->decimal_places ?? 4) }}</td><td class="text-end">USD {{ number_format($row['stake'] ?? 0, 2) }}</td><td>{{ $row['option']->created_at?->format('M j, Y H:i') ?? '—' }}</td><td>{{ $row['option']->expires_at?->format('M j, Y H:i') ?? '—' }}</td><td><span class="badge bg-warning-subtle text-warning">Open</span></td></tr>@endforeach</tbody>
    </table></div></div>
</div>
@endif

<script>
document.addEventListener('DOMContentLoaded', function () {
    document.querySelectorAll('.crm-leveraged-close-form').forEach(function (form) {
        form.addEventListener('submit', function (event) {
            if (!window.confirm('Close the leveraged position on ' + form.dataset.symbol + ' at the current market price?')) {
                event.preventDefault();
                return;
            }

            var button = form.querySelector('.crm-leveraged-close-button');
            if (button) {
                button.disabled = true;
                button.textContent = 'Closing…';
            }
        });
    });

    var portfolioStateUrl = @json(route('trading.portfolio.state', $lead->id));
    var portfolioStateInFlight = false;
    var portfolioStateStopped = false;
    var lastPortfolioStateAt = 0;

    function money(value) {
        return 'USD ' + Number(value || 0).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 });
    }

    function signedMoney(value) {
        var amount = Number(value || 0);
        return (amount >= 0 ? '+' : '-') + 'USD ' + Math.abs(amount).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 });
    }

    function setProfitState(element, value) {
        if (!element) return;
        element.classList.remove('text-success', 'text-danger');
        element.classList.add(Number(value) >= 0 ? 'text-success' : 'text-danger');
    }

    function setPriceStatus(element, status) {
        if (!element) return;
        element.className = 'badge mt-1 ' + (status === 'current'
            ? 'bg-success-subtle text-success'
            : (status === 'delayed' ? 'bg-warning-subtle text-warning' : 'bg-secondary-subtle text-secondary'));
        element.textContent = status === 'current' ? 'Live' : (status === 'delayed' ? 'Delayed' : 'Unavailable');
    }

    function applyPortfolioState(payload) {
        var generatedAt = Date.parse(payload.generated_at || '');
        if (Number.isFinite(generatedAt) && generatedAt < lastPortfolioStateAt) return;
        if (Number.isFinite(generatedAt)) lastPortfolioStateAt = generatedAt;

        var positionValue = document.querySelector('[data-portfolio-position-value]');
        var equity = document.querySelector('[data-portfolio-equity]');
        if (positionValue) positionValue.textContent = '$' + Number(payload.summary?.position_value || 0).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 });
        if (equity) equity.textContent = '$' + Number(payload.summary?.equity || 0).toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 });

        Object.entries(payload.regular || {}).forEach(function (entry) {
            var row = document.querySelector('[data-asset-position="' + entry[0] + '"]');
            if (!row) return;
            var state = entry[1], decimals = Number(row.dataset.decimals || 2);
            var current = row.querySelector('[data-asset-current]');
            var value = row.querySelector('[data-asset-value]');
            var pnl = row.querySelector('[data-asset-pnl]');
            if (current) current.textContent = Number(state.current_price).toLocaleString(undefined, { minimumFractionDigits: decimals, maximumFractionDigits: decimals });
            if (value) value.textContent = money(state.market_value);
            if (pnl) {
                pnl.innerHTML = signedMoney(state.pnl) + '<div style="font-size:.7rem;font-weight:400">' + (Number(state.pnl_pct) >= 0 ? '+' : '') + Number(state.pnl_pct).toFixed(2) + '%</div>';
                setProfitState(pnl, state.pnl);
            }
            setPriceStatus(row.querySelector('[data-asset-price-status]'), state.price_status);
        });

        Object.entries(payload.leveraged || {}).forEach(function (entry) {
            var row = document.querySelector('[data-leveraged-position="' + entry[0] + '"]');
            if (!row) return;
            var state = entry[1], decimals = Number(row.dataset.decimals || 4);
            var current = row.querySelector('[data-leveraged-current]');
            var pnl = row.querySelector('[data-leveraged-pnl]');
            var value = row.querySelector('[data-leveraged-value]');
            if (current) current.textContent = Number(state.current_price).toLocaleString(undefined, { minimumFractionDigits: decimals, maximumFractionDigits: decimals });
            if (pnl) { pnl.textContent = signedMoney(state.pnl); setProfitState(pnl, state.pnl); }
            if (value) value.textContent = money(state.cash_value);
            setPriceStatus(row.querySelector('[data-leveraged-price-status]'), state.price_status);
        });
    }

    async function refreshPortfolioState() {
        if (portfolioStateStopped || document.hidden || portfolioStateInFlight) return;
        portfolioStateInFlight = true;
        try {
            var response = await fetch(portfolioStateUrl, {
                headers: { 'Accept': 'application/json', 'X-Requested-With': 'XMLHttpRequest' },
                cache: 'no-store',
                credentials: 'same-origin'
            });
            if (!response.ok) throw new Error('Portfolio refresh failed (' + response.status + ')');
            applyPortfolioState(await response.json());
        } catch (error) {
            console.warn('Keeping the last successful portfolio values:', error);
        } finally {
            portfolioStateInFlight = false;
        }
    }

    refreshPortfolioState();
    var portfolioStateTimer = window.setInterval(refreshPortfolioState, 2000);
    document.addEventListener('visibilitychange', function () { if (!document.hidden) refreshPortfolioState(); });
    window.addEventListener('pagehide', function () {
        portfolioStateStopped = true;
        window.clearInterval(portfolioStateTimer);
    }, { once: true });
});
</script>

{{-- ══════════════════════════════════════════════
     DEPOSITS + TRADE HISTORY — side by side
══════════════════════════════════════════════ --}}
<div class="row g-3">

    {{-- ── COL 1: Deposits (col-lg-6) ── --}}
    <div class="col-lg-6">
        <div class="card h-100">
            <div class="card-header d-flex justify-content-between align-items-center">
                <h5 class="mb-0 fw-semibold">
                    <i class="fas fa-arrow-down-to-bracket me-2 text-success"></i>Deposits
                </h5>
                @if($canCreateDeposit)
                    <button class="btn btn-xs btn-success" data-toggle="modal" data-target="#add_deposit_modal">
                        <i class="fa fa-plus"></i>
                    </button>
                @endif
            </div>
            <div class="card-body p-0">
                <div class="table-responsive">
                    <table class="display table table-sm mb-0" id="dep_table" style="width:100%;font-size:.78rem">
                        <thead class="table-light">
                            <tr>
                                <th>Amt</th>
                                <th>CCY</th>
                                <th>Status</th>
                                <th>Date</th>
                                <th></th>
                            </tr>
                        </thead>
                        <tbody>
                        @foreach($deposits as $dep)
                        <tr>
                            <td class="fw-semibold">
                                {{ number_format($dep->amount, 2) }}
                                @if($dep->credited_usd_amount !== null && $dep->currency !== 'USD')
                                    <div class="text-muted fw-normal" style="font-size:.68rem">USD {{ number_format($dep->credited_usd_amount, 2) }} credited</div>
                                @endif
                            </td>
                            <td>{{ $dep->currency }}</td>
                            <td>
                                <span class="badge bg-{{ $dep->status === 'approved' ? 'success' : ($dep->status === 'rejected' ? 'danger' : 'warning') }}"
                                      style="font-size:.65rem">{{ ucfirst($dep->status) }}</span>
                            </td>
                            <td class="text-muted" style="white-space:nowrap">{{ $dep->created_at->format('d M y') }}</td>
                            <td>
                                @if($dep->status === 'pending' && in_array(Auth::user()->access_level, ['Admin','Office Manager']))
                                <div class="d-flex gap-1">
                                    <form method="POST" action="{{ route('trading.deposits.approve', $dep->id) }}" class="d-inline">
                                        @csrf
                                        <button type="submit" class="btn btn-xs btn-success" onclick="return confirm('Approve deposit #{{ $dep->id }}?')" title="Approve">
                                            <i class="fa fa-check"></i>
                                        </button>
                                    </form>
                                    <form method="POST" action="{{ route('trading.deposits.reject', $dep->id) }}" class="d-inline">
                                        @csrf
                                        <button type="submit" class="btn btn-xs btn-danger" onclick="return confirm('Reject deposit #{{ $dep->id }}?')" title="Reject">
                                            <i class="fa fa-times"></i>
                                        </button>
                                    </form>
                                </div>
                                @endif
                                @if(Auth::user()->access_level === 'Admin')
                                <form method="POST" action="{{ route('trading.deposits.destroy', $dep->id) }}" class="d-inline">
                                    @csrf @method('DELETE')
                                    <button type="submit" class="btn btn-xs btn-outline-danger mt-1"
                                            onclick="return confirm('Delete and reverse deposit #{{ $dep->id }}?\n\nThis will remove the record and reverse the wallet credit if it was approved.\n\nThis cannot be undone.')"
                                            title="Delete / Reverse">
                                        <i class="fa fa-trash"></i>
                                    </button>
                                </form>
                                @endif
                            </td>
                        </tr>
                        @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>

    {{-- ── COL 2: Trade History (col-lg-6) ── --}}
    <div class="col-lg-6">
        <div class="card h-100">
            <div class="card-header d-flex justify-content-between align-items-center">
                <h5 class="mb-0 fw-semibold">
                    <i class="fas fa-clock-rotate-left me-2 text-warning"></i>Trade History
                </h5>
                <button class="btn btn-xs btn-primary" data-toggle="modal" data-target="#exec_trade_modal">
                    <i class="fa fa-exchange-alt"></i>
                </button>
            </div>
            <div class="card-body p-0">
                <div class="table-responsive">
                    <table class="display table table-sm mb-0" id="trade_table" style="width:100%;font-size:.78rem">
                        <thead class="table-light">
                            <tr>
                                <th>Symbol</th>
                                <th>Side</th>
                                <th class="text-end">Qty</th>
                                <th class="text-end">Price</th>
                                <th>Date</th>
                            </tr>
                        </thead>
                        <tbody>
                        @foreach($trades as $trade)
                        <tr>
                            <td class="fw-semibold">{{ $trade->symbol->name ?? '—' }}</td>
                            <td>
                                <span class="badge bg-{{ $trade->side === 'buy' ? 'success' : 'danger' }}" style="font-size:.65rem">
                                    {{ strtoupper($trade->side) }}
                                </span>
                            </td>
                            <td class="text-end">{{ rtrim(rtrim(number_format($trade->quantity, 8), '0'), '.') }}</td>
                            <td class="text-end">{{ number_format($trade->price, 2) }}</td>
                            <td class="text-muted" style="white-space:nowrap">{{ $trade->traded_at->format('d M y') }}</td>
                        </tr>
                        @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>

</div>{{-- /row --}}

{{-- ══════════════════════════════════════════════
     MODALS (unchanged)
══════════════════════════════════════════════ --}}

{{-- Leveraged Position Adjustment Modal --}}
<div class="modal fade" id="leveraged_adjust_modal" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header bg-warning">
                <h5 class="modal-title"><i class="fa fa-sliders-h me-2"></i>Adjust Leveraged Position — <span id="lpa_symbol">—</span></h5>
                <button type="button" class="close" data-dismiss="modal">&times;</button>
            </div>
            <div class="modal-body">
                <div class="alert alert-warning py-2 mb-3" style="font-size:.84rem">
                    This accounting adjustment changes the position and automatically reconciles the client's USD cash and credit. It cannot bypass insufficient funds.
                </div>
                <div id="lpa_error" class="alert alert-danger py-2" style="display:none"></div>
                <div class="row g-3">
                    <div class="col-md-3">
                        <label class="form-label fw-bold" for="lpa_direction">Direction <span class="text-danger">*</span></label>
                        <select id="lpa_direction" class="form-control" required>
                            <option value="up">UP</option>
                            <option value="down">DOWN</option>
                        </select>
                    </div>
                    <div class="col-md-3">
                        <label class="form-label fw-bold" for="lpa_entry_price">Entry Price <span class="text-danger">*</span></label>
                        <input type="number" id="lpa_entry_price" class="form-control" step="any" min="0.000000000001" required>
                    </div>
                    <div class="col-md-3">
                        <label class="form-label fw-bold" for="lpa_opened_at">Opening Date/Time (UTC) <span class="text-danger">*</span></label>
                        <input type="datetime-local" id="lpa_opened_at" class="form-control" required>
                    </div>
                    <div class="col-md-3">
                        <label class="form-label fw-bold" for="lpa_units">Asset Units / Volume <span class="text-danger">*</span></label>
                        <input type="number" id="lpa_units" class="form-control" step="any" min="0.000000000001" required>
                    </div>
                </div>
                <div id="lpa_direction_warning" class="alert alert-danger py-2 mt-3 mb-0" style="display:none;font-size:.84rem">
                    Changing direction will permanently clear this position's Stop Loss and Take Profit values.
                </div>
                <div class="row g-3 mt-1">
                    <div class="col-md-3"><div class="border rounded p-2 h-100"><small class="text-muted d-block">Leverage</small><strong id="lpa_leverage">—</strong></div></div>
                    <div class="col-md-3"><div class="border rounded p-2 h-100"><small class="text-muted d-block">Calculated Exposure</small><strong id="lpa_exposure">—</strong></div></div>
                    <div class="col-md-3"><div class="border rounded p-2 h-100"><small class="text-muted d-block">Calculated Margin</small><strong id="lpa_margin">—</strong></div></div>
                    <div class="col-md-3"><div class="border rounded p-2 h-100"><small class="text-muted d-block">Estimated Balance Impact</small><strong id="lpa_balance_impact">—</strong></div></div>
                </div>
                <div class="mt-3">
                    <label class="form-label fw-bold" for="lpa_reason">Adjustment Reason <span class="text-muted">(optional)</span></label>
                    <textarea id="lpa_reason" class="form-control" rows="3" maxlength="500" placeholder="Explain why this position is being corrected…"></textarea>
                    <small class="text-muted">Staff identity and before/after values are always recorded. Empty reasons are saved as “Not provided”.</small>
                </div>
                <div class="alert alert-light border mt-3 mb-0 py-2" style="font-size:.8rem">
                    Leverage, close price, close time, and close reason remain unchanged.
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                <button type="button" class="btn btn-warning" id="lpa_submit"><i class="fa fa-check me-1"></i>Apply Adjustment</button>
            </div>
        </div>
    </div>
</div>

{{-- Close Position Modal --}}
<div class="modal fade" id="close_position_modal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header bg-danger text-white">
                <h5 class="modal-title"><i class="fa fa-times-circle me-2"></i>Close Position</h5>
                <button type="button" class="close text-white" data-dismiss="modal">&times;</button>
            </div>
            <div class="modal-body">
                <table class="table table-sm table-bordered mb-3">
                    <tr><th>Symbol</th><td id="cp_symbol">—</td></tr>
                    <tr><th>Current Price</th><td id="cp_price">—</td></tr>
                    <tr><th>Credit Currency</th><td id="cp_currency">—</td></tr>
                </table>
                <div class="mb-2">
                    <label class="form-label fw-bold">Quantity to Sell <span class="text-danger">*</span></label>
                    <input type="number" id="cp_qty_input" class="form-control" step="any" min="0.00000001">
                    <small class="text-muted">Max available: <span id="cp_max_qty">—</span></small>
                </div>
                <div class="alert alert-success py-2 mb-0" id="cp_proceeds_box">
                    Estimated proceeds: <strong id="cp_proceeds">—</strong>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                <form id="close_position_form" method="POST" action="{{ route('trading.trades.store') }}" class="d-inline">
                    @csrf
                    <input type="hidden" name="lead_id"   value="{{ $lead->id }}">
                    <input type="hidden" name="side"      value="sell">
                    <input type="hidden" name="note"      id="cp_note_field" value="Agent close">
                    <input type="hidden" id="cp_symbol_id"        name="symbol_id">
                    <input type="hidden" id="cp_quantity"          name="quantity">
                    <input type="hidden" id="cp_currency_field"    name="currency">
                    <button type="submit" class="btn btn-danger">
                        <i class="fa fa-check me-1"></i> Confirm Close
                    </button>
                </form>
            </div>
        </div>
    </div>
</div>

{{-- Adjust Position Modal --}}
<div class="modal fade" id="adjust_position_modal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header bg-warning">
                <h5 class="modal-title"><i class="fa fa-sliders-h me-2"></i>Adjust Position — <span id="adj_symbol_name">—</span></h5>
                <button type="button" class="close" data-dismiss="modal">&times;</button>
            </div>
            <div class="modal-body">
                <div class="alert alert-warning py-2 mb-3" style="font-size:.84rem">
                    <strong>Admin override.</strong> Directly sets the stored quantity and entry price without posting a market trade.
                </div>
                <div class="row g-3">
                    <div class="col-6">
                        <label class="form-label fw-bold">New Quantity</label>
                        <input type="number" id="adj_qty" class="form-control" step="any" min="0">
                    </div>
                    <div class="col-6">
                        <label class="form-label fw-bold">New Entry Price</label>
                        <input type="number" id="adj_avg_price" class="form-control" step="any" min="0">
                    </div>
                    <div class="col-12">
                        <label class="form-label fw-bold">Note</label>
                        <input type="text" id="adj_note" class="form-control" placeholder="Reason for adjustment…">
                    </div>
                    <div class="col-12">
                        <div class="form-check">
                            <input class="form-check-input" type="checkbox" id="adj_wallet_check">
                            <label class="form-check-label" for="adj_wallet_check">
                                Also adjust wallet balance for quantity delta (at new avg price)
                            </label>
                        </div>
                        <input type="hidden" id="adj_currency" value="USD">
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                <button type="button" class="btn btn-warning" id="adj_confirm_btn">
                    <i class="fa fa-check me-1"></i> Apply Adjustment
                </button>
            </div>
        </div>
    </div>
</div>

{{-- Execute Trade Modal --}}
<div class="modal fade" id="exec_trade_modal" tabindex="-1">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title"><i class="fa fa-exchange-alt me-2"></i>Trade Ticket — {{ $lead->fname }} {{ $lead->lname }}</h4>
                <button type="button" class="close" data-dismiss="modal">&times;</button>
            </div>
            <div class="modal-body">
                <form method="POST" action="{{ route('trading.trades.store') }}" id="portfolio_trade_form">
                    @csrf
                    <input type="hidden" name="lead_id" value="{{ $lead->id }}">
                    <div class="form-group mb-3"><label class="form-label">Position Type</label><select name="position_type" id="pt_position_type" class="form-control"><option value="spot" @selected(old('position_type', 'spot') === 'spot')>Spot</option><option value="leveraged" @selected(old('position_type') === 'leveraged')>Leveraged</option><option value="binary" @selected(old('position_type') === 'binary')>Binary Option</option></select></div>
                    <div class="row">
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label">Available USD</label>
                                <div id="pt_balance_display" class="p-2 bg-light rounded" style="font-size:.85rem">Loading…</div>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group mb-3">
                                <label class="form-label">Symbol <span class="text-danger">*</span></label>
                                <select name="symbol_id" id="pt_symbol_id" class="form-control" required>
                                    <option value="">-- Select symbol --</option>
                                    @foreach($symbols as $sym)
                                    <option value="{{ $sym->id }}" @selected((string) old('symbol_id') === (string) $sym->id)>{{ $sym->name }} ({{ $sym->tv_symbol }})</option>
                                    @endforeach
                                </select>
                            </div>
                            <div id="pt_symbol_price_info" class="mb-3" style="display:none">
                                <label class="form-label">Latest Price</label>
                                <div id="pt_symbol_price_display" class="p-2 bg-light rounded" style="font-size:.85rem"></div>
                            </div>
                        </div>
                    </div>
                    <div class="row pt-product-fields" data-product="spot">
                        <div class="col-md-4">
                            <div class="form-group mb-3">
                                <label class="form-label">Side <span class="text-danger">*</span></label>
                                <select name="side" id="pt_side" class="form-control" required>
                                    <option value="buy" @selected(old('side', 'buy') === 'buy')>BUY</option>
                                    <option value="sell" @selected(old('side') === 'sell')>SELL</option>
                                </select>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group mb-3">
                                <label class="form-label">Account Currency</label>
                                <input type="hidden" name="currency" id="pt_currency" value="USD">
                                <div class="form-control bg-light">USD</div>
                            </div>
                        </div>
                        <div class="col-md-4">
                            <div class="form-group mb-3">
                                <label class="form-label">Quantity <span class="text-danger">*</span></label>
                                <input type="number" name="quantity" id="pt_qty" value="{{ old('quantity') }}" class="form-control" step="any" min="0.00000001" required>
                            </div>
                        </div>
                    </div>
                    <div class="pt-product-fields" data-product="leveraged" style="display:none">
                        <div class="row"><div class="col-md-3"><div class="form-group mb-3"><label>Direction</label><select name="direction" class="form-control"><option value="up">UP</option><option value="down">DOWN</option></select></div></div><div class="col-md-3"><div class="form-group mb-3"><label>Input</label><select name="input_mode" class="form-control"><option value="margin">USD margin</option><option value="units">Units</option></select></div></div><div class="col-md-3 pt-leveraged-margin"><div class="form-group mb-3"><label>Margin (USD)</label><input name="margin" type="number" step="any" min="0.00000001" class="form-control"></div></div><div class="col-md-3 pt-leveraged-units" style="display:none"><div class="form-group mb-3"><label>Units</label><input name="units" type="number" step="any" min="0.00000001" class="form-control"></div></div><div class="col-md-3"><div class="form-group mb-3"><label>Leverage</label><select name="leverage" class="form-control">@foreach(\App\Services\LeveragedTradingService::LEVERAGES as $leverage)<option value="{{ $leverage }}">{{ $leverage }}×</option>@endforeach</select></div></div></div>
                        <div class="row"><div class="col-md-6"><div class="form-group mb-3"><label>Stop Loss</label><input name="stop_loss" type="number" step="any" min="0.00000001" class="form-control" placeholder="Optional"></div></div><div class="col-md-6"><div class="form-group mb-3"><label>Take Profit</label><input name="take_profit" type="number" step="any" min="0.00000001" class="form-control" placeholder="Optional"></div></div></div>
                    </div>
                    <div class="pt-product-fields" data-product="binary" style="display:none"><div class="row"><div class="col-md-4"><div class="form-group mb-3"><label>Direction</label><select name="direction" class="form-control" disabled><option value="call">Higher</option><option value="put">Lower</option></select></div></div><div class="col-md-4"><div class="form-group mb-3"><label>Stake (USD)</label><input name="stake" type="number" step="any" min="1" class="form-control" disabled></div></div><div class="col-md-4"><div class="form-group mb-3"><label>Expiry</label><select name="expiry_key" class="form-control" disabled></select></div></div></div><div class="alert alert-info py-2 pt-binary-summary">Select a symbol to see payout and potential return.</div></div>
                    <div class="pt-opening-price-field mb-3">
                        <label class="form-label" for="pt_price">Opening Price <small class="text-muted">(optional)</small></label>
                        <input type="number" name="price" id="pt_price" value="{{ old('price') }}" class="form-control" step="any" min="0.00000001" placeholder="Blank uses latest AST quote">
                        <div id="pt_price_context" class="form-text">Select a symbol to see the latest AST quote.</div>
                    </div>
                    <div class="row">
                        <div class="col-md-3 pt-product-fields" data-product="spot">
                            <div class="form-group mb-3">
                                <label class="form-label">Fee</label>
                                <input type="number" name="fee" id="pt_fee" class="form-control" step="any" min="0" value="{{ old('fee', 0) }}">
                            </div>
                        </div>
                        <div class="col-md-9">
                            <div class="form-group mb-3">
                                <label class="form-label">Note</label>
                                <input type="text" name="note" value="{{ old('note') }}" class="form-control" placeholder="Optional note">
                            </div>
                        </div>
                    </div>
                    <div id="pt_estimated_cost" class="alert alert-info py-2 mb-3" style="display:none;font-size:.88rem"></div>
                    <button type="submit" id="pt_submit" class="btn btn-primary w-100">Execute Trade</button>
                </form>
            </div>
        </div>
    </div>
</div>

{{-- Admin-only immediate USD deposit modal --}}
@if($canCreateDeposit)
<div class="modal fade" id="add_deposit_modal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title"><i class="fa fa-plus me-2"></i>New Deposit — {{ $lead->fname }} {{ $lead->lname }}</h4>
                <button type="button" class="close" data-dismiss="modal">&times;</button>
            </div>
            <div class="modal-body">
                <form method="POST" action="{{ route('lead.admin_deposit', $lead->id) }}">
                    @csrf
                    <input type="hidden" name="currency" value="USD">
                    <div class="form-group mb-3">
                        <label class="form-label">Currency</label>
                        <input type="text" class="form-control" value="USD" readonly>
                    </div>
                    <div class="form-group mb-3">
                        <label class="form-label">Amount <span class="text-danger">*</span></label>
                        <input type="number" name="amount" class="form-control" step="0.01" min="0.01" required placeholder="0.00">
                    </div>
                    <div class="form-group mb-3">
                        <label class="form-label">Reference</label>
                        <input type="text" name="reference" class="form-control" maxlength="100" placeholder="Wire ref, transaction ID, etc.">
                    </div>
                    <div class="form-group mb-3">
                        <label class="form-label">Notes</label>
                        <textarea name="notes" class="form-control" rows="2" maxlength="500" placeholder="Optional internal notes"></textarea>
                    </div>
                    <button type="submit" class="btn btn-success w-100">Approve Deposit</button>
                </form>
            </div>
        </div>
    </div>
</div>
@endif

@endsection

@section('page-js')
<script src="{{ asset('assets/js/vendor/datatables.min.js') }}"></script>
<script src="https://unpkg.com/lightweight-charts@4.2.0/dist/lightweight-charts.standalone.production.js"></script>
<script>
document.addEventListener('DOMContentLoaded', function () {
    var depositForm = document.querySelector('#add_deposit_modal form');
    if (depositForm) {
        depositForm.addEventListener('submit', function () {
            var button = depositForm.querySelector('button[type="submit"]');
            if (!button || button.disabled) return;
            button.disabled = true;
            button.innerHTML = '<i class="fa fa-spinner fa-spin me-1"></i>Processing…';
        });
    }
});

/* ── Lightweight chart toggle ── */
const _charts = {};

function toggleChart(symId) {
    const row = document.getElementById('chart_row_' + symId);
    if (!row) return;
    if (row.style.display === 'none') {
        row.style.display = '';
        if (!_charts[symId]) initChart(symId);
    } else {
        row.style.display = 'none';
    }
}

function initChart(symId) {
    const container = document.getElementById('chart_' + symId);
    if (!container) return;

    const chartData = JSON.parse(container.dataset.history || '[]');
    const avgPrice  = parseFloat(container.dataset.avg) || 0;
    const pnlPct    = parseFloat(container.dataset.pnl) || 0;
    const positive  = pnlPct >= 0;

    const chart = LightweightCharts.createChart(container, {
        layout: { background: { color: '#131722' }, textColor: '#9ca3af' },
        grid: { vertLines: { color: '#1f2937' }, horzLines: { color: '#1f2937' } },
        crosshair: { mode: LightweightCharts.CrosshairMode.Normal },
        rightPriceScale: { borderColor: '#374151' },
        timeScale: { borderColor: '#374151', timeVisible: true, secondsVisible: false },
        width:  container.clientWidth,
        height: 240,
    });

    const areaSeries = chart.addAreaSeries({
        lineColor:    positive ? '#10b981' : '#ef4444',
        topColor:     positive ? 'rgba(16,185,129,0.25)' : 'rgba(239,68,68,0.25)',
        bottomColor:  'rgba(0,0,0,0)',
        lineWidth: 2,
        priceLineVisible: false,
    });

    areaSeries.setData(chartData);

    if (avgPrice > 0) {
        areaSeries.createPriceLine({
            price: avgPrice,
            color: '#f59e0b',
            lineWidth: 1,
            lineStyle: LightweightCharts.LineStyle.Dashed,
            axisLabelVisible: true,
            title: 'Entry',
        });
    }

    chart.timeScale().fitContent();
    _charts[symId] = chart;
    window.addEventListener('resize', () => { chart.applyOptions({ width: container.clientWidth }); });
}
</script>
<script>
$(document).ready(function () {
    let portfolioTradeBalances = {};
    let preserveSubmittedCurrency = @json(session()->hasOldInput('currency'));
    let portfolioTradeOverBudget = false;
    let ptSymbolInfo = {};

    function updatePtLeverageMode() {
        const units = $('#portfolio_trade_form [name="input_mode"]').val() === 'units';
        $('#portfolio_trade_form .pt-leveraged-margin').toggle(!units).find(':input').prop('disabled', units);
        $('#portfolio_trade_form .pt-leveraged-units').toggle(units).find(':input').prop('disabled', !units);
    }
    function updatePtProductFields() {
        const product = $('#pt_position_type').val();
        $('.pt-product-fields').hide().find(':input').prop('disabled', true);
        $('.pt-product-fields[data-product="' + product + '"]').show().find(':input').prop('disabled', false);
        $('.pt-opening-price-field').toggle(product !== 'binary').find(':input').prop('disabled', product === 'binary');
        if (product === 'leveraged') updatePtLeverageMode();
        updatePtOpeningPriceContext();
        updatePtEstimate();
    }
    $('#pt_position_type').on('change', updatePtProductFields);
    $('#portfolio_trade_form [name="input_mode"]').on('change', function(){ updatePtLeverageMode(); updatePtEstimate(); });

    $('#dep_table').DataTable({
        order: [[0,'DESC']], pageLength: 8,
        columnDefs: [{ orderable: false, targets: [4] }],
        language: { lengthMenu: '_MENU_', search: '' },
    });
    $('#trade_table').DataTable({
        order: [[4,'DESC']], pageLength: 8,
        language: { lengthMenu: '_MENU_', search: '' },
    });

    /* Load balances when trade modal opens */
    $('#exec_trade_modal').on('show.bs.modal', function () {
        $.getJSON('{{ url("trading/trades/client-balances") }}/{{ $lead->id }}', function (data) {
            const cash = Number(data.cash_usd || 0);
            const credit = Number(data.credit_usd || 0);
            const available = Number(data.available_usd || 0);
            portfolioTradeBalances = { USD: available };
            $('#pt_balance_display').html(`<strong>USD ${available.toFixed(2)}</strong> <span class="text-muted ms-2">Cash ${cash.toFixed(2)} · Credit ${credit.toFixed(2)}</span>`);
            $('#pt_currency').val('USD');
            preserveSubmittedCurrency = false;
            updatePtEstimate();
        });
    });

    /* Load latest price when symbol changes */
    $('#pt_symbol_id').on('change', function () {
        const id = $(this).val();
        if (!id) { $('#pt_symbol_price_info').hide(); return; }
        $.getJSON('{{ url("trading/trades/symbol-price") }}/' + id, function (data) {
            ptSymbolInfo = data;
            if (data.price) {
                $('#pt_symbol_price_display').html(`<strong>${parseFloat(data.price).toFixed(8)}</strong> <span class="text-muted">as of ${data.priced_at ?? 'N/A'}</span>`);
            } else {
                $('#pt_symbol_price_display').html('<span class="text-warning">No price set for this symbol.</span>');
            }
            const expiry = $('#portfolio_trade_form [name="expiry_key"]');
            expiry.empty();
            (data.binary_expiries || []).forEach(function(key) { expiry.append(new Option((data.expiry_labels || {})[key] || key, key)); });
            $('#pt_symbol_price_info').show();
            updatePtOpeningPriceContext();
            updatePtEstimate();
        });
    });

    function updatePtOpeningPriceContext() {
        const latest = parseFloat(ptSymbolInfo.price) || 0;
        const manual = parseFloat($('#pt_price').val()) || 0;
        const context = $('#pt_price_context');
        if (!latest) {
            context.text(manual ? `Manual opening price: ${manual.toFixed(8)} · A current AST quote is required for leveraged trades.` : 'Select a priced symbol or enter a Spot opening price.');
            return;
        }
        if (!manual) {
            context.text(`Latest AST quote: ${latest.toFixed(8)} · Blank uses this price.`);
            return;
        }
        const difference = ((manual - latest) / latest) * 100;
        context.text(`Latest AST quote: ${latest.toFixed(8)} · Manual opening price: ${manual.toFixed(8)} (${difference >= 0 ? '+' : ''}${difference.toFixed(2)}%).`);
    }

    function updatePtEstimate() {
        const product = $('#pt_position_type').val();
        const availableUsd = portfolioTradeBalances.USD || 0;
        const livePrice = parseFloat(ptSymbolInfo.price) || 0;
        const openingPrice = parseFloat($('#pt_price').val()) || livePrice;
        const priceLabel = $('#pt_price').val() ? 'manual' : 'latest';
        if (product === 'leveraged') {
            const leverage = parseInt($('#portfolio_trade_form [name="leverage"]').val()) || 1;
            const unitsMode = $('#portfolio_trade_form [name="input_mode"]').val() === 'units';
            const amount = unitsMode ? ((parseFloat($('#portfolio_trade_form [name="units"]').val()) || 0) * openingPrice / leverage) : (parseFloat($('#portfolio_trade_form [name="margin"]').val()) || 0);
            portfolioTradeOverBudget = amount > availableUsd;
            $('#pt_estimated_cost').toggle(amount > 0).attr('class', 'alert py-2 mb-3 ' + (portfolioTradeOverBudget ? 'alert-danger' : 'alert-info')).text(`Margin: USD ${amount.toFixed(2)} · Exposure: USD ${(amount * leverage).toFixed(2)} · Opening: ${openingPrice ? openingPrice.toFixed(8) : 'unavailable'} (${priceLabel}) · Available: USD ${availableUsd.toFixed(2)}`);
            $('#pt_submit').prop('disabled', portfolioTradeOverBudget);
            return;
        }
        if (product === 'binary') {
            const stake = parseFloat($('#portfolio_trade_form [name="stake"]').val()) || 0;
            const payout = parseFloat(ptSymbolInfo.binary_payout_pct) || 80;
            portfolioTradeOverBudget = stake > availableUsd || ptSymbolInfo.binary_enabled === false;
            $('#portfolio_trade_form .pt-binary-summary').attr('class', 'alert py-2 pt-binary-summary ' + (portfolioTradeOverBudget ? 'alert-danger' : 'alert-info')).text(ptSymbolInfo.binary_enabled === false ? 'Binary options are disabled for this symbol.' : `Payout: ${payout}% · Potential return: USD ${(stake * (1 + payout / 100)).toFixed(2)} · Available: USD ${availableUsd.toFixed(2)}`);
            $('#pt_estimated_cost').hide();
            $('#pt_submit').prop('disabled', portfolioTradeOverBudget);
            return;
        }
        const qty   = parseFloat($('#pt_qty').val()) || 0;
        const price = openingPrice;
        const fee = parseFloat($('#pt_fee').val()) || 0;
        const side = $('#pt_side').val();
        const currency = $('#pt_currency').val();
        const available = portfolioTradeBalances[currency] || 0;
        portfolioTradeOverBudget = false;

        if (qty && price) {
            const amount = side === 'buy' ? (qty * price) + fee : Math.max(0, (qty * price) - fee);
            const estimate = $('#pt_estimated_cost');
            if (side === 'buy' && amount > available) {
                portfolioTradeOverBudget = true;
                estimate.removeClass('alert-info').addClass('alert-danger')
                    .text(`Insufficient ${currency} balance. Available: ${available.toFixed(2)} · Required: ${amount.toFixed(2)}`)
                    .show();
            } else {
                estimate.removeClass('alert-danger').addClass('alert-info')
                    .text(side === 'buy'
                        ? `Available: ${currency} ${available.toFixed(2)} · Estimated total: ${amount.toFixed(2)} (including fee) · Opening: ${price.toFixed(8)} (${priceLabel})`
                        : `Estimated proceeds: ${currency} ${amount.toFixed(2)} (after fee) · Opening: ${price.toFixed(8)} (${priceLabel})`)
                    .show();
            }
        } else {
            $('#pt_estimated_cost').hide();
        }
        $('#pt_submit').prop('disabled', portfolioTradeOverBudget);
    }
    $('#pt_qty, #pt_price, #pt_fee').on('input', function () { updatePtOpeningPriceContext(); updatePtEstimate(); });
    $('#pt_currency, #pt_side').on('change', updatePtEstimate);
    $('#portfolio_trade_form [name="margin"], #portfolio_trade_form [name="units"], #portfolio_trade_form [name="leverage"], #portfolio_trade_form [name="stake"]').on('input change', updatePtEstimate);
    $('#portfolio_trade_form').on('submit', function (event) {
        updatePtEstimate();
        if (portfolioTradeOverBudget) event.preventDefault();
        else $('#pt_submit').prop('disabled', true).text('Processing…');
    });

    if ($('#pt_symbol_id').val()) $('#pt_symbol_id').trigger('change');
    updatePtProductFields();

    @if(session('error') || ($errors->any() && session()->hasOldInput('side')))
    $('#exec_trade_modal').modal('show');
    @endif
});
</script>
<script>
/* ── Close Position (supports partial) ── */
var _cp_price = 0, _cp_max_qty = 0, _cp_currency = '';

function openCloseModal(posId, symbolId, symbolName, qty, price, currentValue, currency) {
    _cp_price    = parseFloat(price);
    _cp_max_qty  = parseFloat(qty);
    _cp_currency = currency;
    document.getElementById('cp_symbol').textContent   = symbolName;
    document.getElementById('cp_price').textContent    = _cp_price.toLocaleString(undefined, {minimumFractionDigits:2, maximumFractionDigits:8});
    document.getElementById('cp_currency').textContent = currency;
    document.getElementById('cp_max_qty').textContent  = qty;
    document.getElementById('cp_qty_input').value      = qty;
    document.getElementById('cp_qty_input').max        = qty;
    document.getElementById('cp_symbol_id').value      = symbolId;
    document.getElementById('cp_currency_field').value = currency;
    updateCpProceeds();
    $('#close_position_modal').modal('show');
}

function updateCpProceeds() {
    var q        = parseFloat(document.getElementById('cp_qty_input').value) || 0;
    var proceeds = q * _cp_price;
    var isPartial = q < _cp_max_qty;
    document.getElementById('cp_quantity').value       = q;
    document.getElementById('cp_note_field').value     = isPartial ? 'Agent partial close (' + q + ')' : 'Agent close — full position';
    document.getElementById('cp_proceeds').textContent = _cp_currency + ' ' + proceeds.toLocaleString(undefined, {minimumFractionDigits:2, maximumFractionDigits:2});
}

document.getElementById('cp_qty_input').addEventListener('input', updateCpProceeds);

document.getElementById('close_position_form').addEventListener('submit', function(e) {
    var q = parseFloat(document.getElementById('cp_qty_input').value) || 0;
    if (q <= 0 || q > _cp_max_qty) {
        e.preventDefault();
        alert('Please enter a valid quantity between 0 and ' + _cp_max_qty);
    }
});

/* ── Adjust Position ── */
var _adj_pos_id = null;

function openAdjustModal(posId, symbolName, qty, avgPrice, currency) {
    _adj_pos_id = posId;
    document.getElementById('adj_symbol_name').textContent = symbolName;
    document.getElementById('adj_qty').value       = qty;
    document.getElementById('adj_avg_price').value = avgPrice;
    document.getElementById('adj_note').value      = '';
    document.getElementById('adj_wallet_check').checked = false;
    document.getElementById('adj_currency').value  = 'USD';
    $('#adjust_position_modal').modal('show');
}

document.getElementById('adj_confirm_btn').addEventListener('click', function() {
    var btn      = this;
    var qty      = parseFloat(document.getElementById('adj_qty').value);
    var avg      = parseFloat(document.getElementById('adj_avg_price').value);
    var note     = document.getElementById('adj_note').value.trim() || 'Admin position adjustment';
    var adjWallet = document.getElementById('adj_wallet_check').checked;
    var currency  = document.getElementById('adj_currency').value;

    if (isNaN(qty) || qty < 0) { alert('Enter a valid quantity (0 or more).'); return; }
    if (isNaN(avg) || avg < 0) { alert('Enter a valid entry price.'); return; }

    btn.disabled = true;
    btn.innerHTML = '<i class="fa fa-spinner fa-spin me-1"></i> Applying…';

    fetch('{{ url('trading/positions') }}/' + _adj_pos_id + '/adjust', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json',
            'X-CSRF-TOKEN': document.querySelector('meta[name=csrf-token]').getAttribute('content'),
            'Accept': 'application/json',
        },
        body: JSON.stringify({
            quantity: qty,
            avg_price: avg,
            note: note,
            adjust_wallet: adjWallet,
            wallet_currency: currency,
        }),
        credentials: 'same-origin',
    })
    .then(r => r.json())
    .then(d => {
        if (d.success) {
            $('#adjust_position_modal').modal('hide');
            location.reload();
        } else {
            alert(d.message || 'Adjustment failed.');
            btn.disabled = false;
            btn.innerHTML = '<i class="fa fa-check me-1"></i> Apply Adjustment';
        }
    })
    .catch(() => {
        alert('Network error. Please try again.');
        btn.disabled = false;
        btn.innerHTML = '<i class="fa fa-check me-1"></i> Apply Adjustment';
    });
});

/* ── Leveraged Position Adjustment ── */
(function () {
    var active = null;
    var modal = document.getElementById('leveraged_adjust_modal');
    var directionInput = document.getElementById('lpa_direction');
    var entryInput = document.getElementById('lpa_entry_price');
    var openedInput = document.getElementById('lpa_opened_at');
    var unitsInput = document.getElementById('lpa_units');
    var reasonInput = document.getElementById('lpa_reason');
    var submit = document.getElementById('lpa_submit');
    var errorBox = document.getElementById('lpa_error');
    var directionWarning = document.getElementById('lpa_direction_warning');

    function usd(value, signed) {
        var number = Number(value || 0);
        var prefix = signed && number > 0 ? '+' : '';
        return prefix + 'USD ' + number.toLocaleString(undefined, {minimumFractionDigits: 2, maximumFractionDigits: 2});
    }

    function settlement(margin, cashMargin, creditMargin, pnl) {
        var net = Math.max(0, margin + pnl);
        var cashReturn = Math.max(0, Math.min(net, cashMargin + pnl));
        var creditReturn = Math.max(0, Math.min(creditMargin, net - cashReturn));
        return {cash: cashReturn, credit: creditReturn};
    }

    function estimate() {
        if (!active) return;
        var entry = Number(entryInput.value || 0);
        var units = Number(unitsInput.value || 0);
        var direction = directionInput.value;
        var exposure = entry * units;
        var margin = active.leverage > 0 ? exposure / active.leverage : 0;
        directionWarning.style.display = direction !== active.direction ? 'block' : 'none';
        document.getElementById('lpa_exposure').textContent = entry > 0 && units > 0 ? usd(exposure, false) : '—';
        document.getElementById('lpa_margin').textContent = margin > 0 ? usd(margin, false) : '—';

        if (!(entry > 0 && units > 0)) {
            document.getElementById('lpa_balance_impact').textContent = '—';
            return;
        }

        if (active.status === 'open') {
            var marginDelta = margin - active.margin;
            document.getElementById('lpa_balance_impact').textContent = Math.abs(marginDelta) < 0.00000001
                ? 'No margin change'
                : (marginDelta > 0 ? 'Debit ' + usd(marginDelta, false) : 'Return ' + usd(Math.abs(marginDelta), false));
            return;
        }

        var oldCashRatio = active.margin > 0 ? Math.max(0, Math.min(1, active.cashMargin / active.margin)) : 0;
        var newCashMargin = margin * oldCashRatio;
        var newCreditMargin = margin - newCashMargin;
        var move = direction === 'up'
            ? (active.closePrice - entry) / entry
            : (entry - active.closePrice) / entry;
        var newPnl = exposure * move;
        var oldSettlement = settlement(active.margin, active.cashMargin, active.creditMargin, active.realizedPnl);
        var newSettlement = settlement(margin, newCashMargin, newCreditMargin, newPnl);
        var cashDelta = (-newCashMargin + newSettlement.cash) - (-active.cashMargin + oldSettlement.cash);
        var creditDelta = (-newCreditMargin + newSettlement.credit) - (-active.creditMargin + oldSettlement.credit);
        document.getElementById('lpa_balance_impact').textContent = 'Cash ' + usd(cashDelta, true) + ' · Credit ' + usd(creditDelta, true);
    }

    document.querySelectorAll('.leveraged-adjust-button').forEach(function (button) {
        button.addEventListener('click', function () {
            var version = Number(button.dataset.version);
            if (!Number.isInteger(version) || version < 1) {
                window.alert('This portfolio page is out of date and will now be refreshed. Please reopen the adjustment afterward.');
                window.location.reload();
                return;
            }
            active = {
                id: button.dataset.positionId,
                url: button.dataset.adjustUrl,
                status: button.dataset.status,
                direction: button.dataset.direction,
                leverage: Number(button.dataset.leverage),
                margin: Number(button.dataset.margin),
                cashMargin: Number(button.dataset.cashMargin),
                creditMargin: Number(button.dataset.creditMargin),
                stopLoss: button.dataset.stopLoss === '' ? null : Number(button.dataset.stopLoss),
                takeProfit: button.dataset.takeProfit === '' ? null : Number(button.dataset.takeProfit),
                closePrice: Number(button.dataset.closePrice || 0),
                realizedPnl: Number(button.dataset.realizedPnl || 0),
                version: version
            };
            document.getElementById('lpa_symbol').textContent = button.dataset.symbol;
            document.getElementById('lpa_leverage').textContent = active.leverage + '×';
            directionInput.value = active.direction;
            entryInput.value = button.dataset.entryPrice;
            openedInput.value = button.dataset.openedAt;
            unitsInput.value = button.dataset.units;
            reasonInput.value = '';
            errorBox.style.display = 'none';
            errorBox.textContent = '';
            submit.disabled = false;
            submit.innerHTML = '<i class="fa fa-check me-1"></i>Apply Adjustment';
            estimate();
            $(modal).modal('show');
        });
    });

    directionInput.addEventListener('change', estimate);
    entryInput.addEventListener('input', estimate);
    unitsInput.addEventListener('input', estimate);

    submit.addEventListener('click', function () {
        if (!active) return;
        var entry = Number(entryInput.value);
        var units = Number(unitsInput.value);
        var direction = directionInput.value;
        var reason = reasonInput.value.trim();
        if (!(entry > 0) || !(units > 0) || !openedInput.value || !['up', 'down'].includes(direction)) {
            errorBox.textContent = 'Choose a direction and enter a positive entry price and volume with an opening time.';
            errorBox.style.display = 'block';
            return;
        }
        if (direction !== active.direction && !window.confirm('Change this trade from ' + active.direction.toUpperCase() + ' to ' + direction.toUpperCase() + '? Existing Stop Loss and Take Profit values will be permanently cleared.')) {
            return;
        }

        submit.disabled = true;
        submit.innerHTML = '<i class="fa fa-spinner fa-spin me-1"></i>Applying…';
        errorBox.style.display = 'none';

        fetch(active.url, {
            method: 'PUT',
            headers: {
                'Content-Type': 'application/json',
                'Accept': 'application/json',
                'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute('content')
            },
            credentials: 'same-origin',
            body: JSON.stringify({
                direction: direction,
                entry_price: entry,
                opened_at: openedInput.value,
                units: units,
                reason: reason,
                expected_version: active.version,
                expected_status: active.status
            })
        }).then(function (response) {
            return response.json().then(function (body) { return {ok: response.ok, status: response.status, body: body}; });
        }).then(function (result) {
            if (!result.ok || !result.body.success) {
                if (result.status === 409 && ['stale_position_data', 'position_conflict'].includes(result.body.code)) {
                    window.alert(result.body.message || 'The position changed and the portfolio will be refreshed.');
                    window.location.reload();
                    return null;
                }
                var validationMessage = result.body.errors ? Object.values(result.body.errors).flat()[0] : null;
                throw new Error(validationMessage || result.body.message || 'The adjustment was rejected.');
            }
            if (!result) return;
            $(modal).modal('hide');
            window.location.reload();
        }).catch(function (error) {
            errorBox.textContent = error.message || 'The adjustment could not be saved.';
            errorBox.style.display = 'block';
            submit.disabled = false;
            submit.innerHTML = '<i class="fa fa-check me-1"></i>Apply Adjustment';
        });
    });
})();
</script>
@endsection