@extends('layouts.app')
@section('title', 'Bank Reconciliation')

@include('inventory.accounting.partials.styles')

@section('content')
<div class="acc-header">
    <div><h1><i class="fas fa-scale-balanced"></i> Bank Reconciliation</h1><p>Match your bank statement to the ledger so book and bank balances agree.</p></div>
</div>

@include('inventory.accounting.partials.sub-nav')

@if(session('success'))<div class="acc-card" style="color:var(--success,#00d4aa);">{{ session('success') }}</div>@endif
@if($errors->any())<div class="acc-card" style="color:var(--danger,#ff4757);">{{ $errors->first() }}</div>@endif

@if($banks->isEmpty())
    <div class="acc-card acc-empty">
        <i class="fas fa-building-columns"></i>
        <div>Add a bank account first to start a reconciliation.</div>
        <a href="{{ route('inventory.accounting.banks.index') }}" class="acc-btn acc-btn-primary" style="margin-top:1rem;">Add Bank Account</a>
    </div>
@else
<div class="acc-card">
    <h2>Start New Reconciliation</h2>
    <form method="POST" action="{{ route('inventory.accounting.reconciliations.store') }}">
        @csrf
        <div class="acc-form-row">
            <label>Bank Account
                <select name="bank_account_id" required class="acc-select">
                    @foreach($banks as $b)<option value="{{ $b->id }}">{{ $b->bank_name }} — {{ $b->account_name }}</option>@endforeach
                </select>
            </label>
            <label>Period Start <input type="date" required name="period_start" class="acc-input"></label>
            <label>Period End <input type="date" required name="period_end" class="acc-input"></label>
            <label>Statement Opening Balance <input type="number" required step="0.01" name="statement_opening_balance" class="acc-input"></label>
            <label>Statement Closing Balance <input type="number" required step="0.01" name="statement_closing_balance" class="acc-input"></label>
            <label style="grid-column:1/-1;">Notes <textarea name="notes" rows="2" class="acc-input" style="min-width:100%;"></textarea></label>
        </div>
        <button class="acc-btn acc-btn-primary">Start Reconciliation</button>
    </form>
</div>
@endif

<div class="acc-card">
    <h2>History</h2>
    <table class="acc-table">
        <thead><tr><th>Bank</th><th>Period</th><th class="num">Statement Close</th><th class="num">Book</th><th class="num">Difference</th><th>Status</th><th></th></tr></thead>
        <tbody>
            @forelse($reconciliations as $r)
                <tr>
                    <td>{{ optional($r->bankAccount)->bank_name }}</td>
                    <td>{{ $r->period_start->format('M j') }} – {{ $r->period_end->format('M j, Y') }}</td>
                    <td class="num">{{ number_format($r->statement_closing_balance, 2) }}</td>
                    <td class="num">{{ number_format($r->book_balance, 2) }}</td>
                    <td class="num" style="color:{{ abs($r->difference) > 0.01 ? 'var(--danger,#ff4757)' : 'var(--success,#00d4aa)' }};">{{ number_format($r->difference, 2) }}</td>
                    <td>
                        @if($r->status === 'completed')<span class="acc-badge acc-badge-success">Completed</span>
                        @else<span class="acc-badge acc-badge-warning">In progress</span>@endif
                    </td>
                    <td><a href="{{ route('inventory.accounting.reconciliations.show', $r) }}" class="acc-btn acc-btn-ghost" style="padding:0.3rem 0.55rem;font-size:0.72rem;">Open</a></td>
                </tr>
            @empty
                <tr><td colspan="7" class="acc-empty"><i class="fas fa-inbox"></i><div>No reconciliations yet.</div></td></tr>
            @endforelse
        </tbody>
    </table>
</div>
@endsection