@extends('layouts.master')

@section('title', 'Process Cashbook Entry - ')

@section('content')
<style>
    @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap');

    /* Reset and base */
    body, input, select, textarea, button {
        font-family: 'Inter', sans-serif;
    }

    .container {
        max-width: 1400px;
        margin: 3rem auto 4rem;
        background-color: #fff;
        padding: 2.5rem 3rem;
        border-radius: 1rem;
        box-shadow: 0 12px 24px rgba(0,0,0,0.08);
        color: #1f2937;
    }

    h1 {
        text-align: center;
        color: #2563eb;
        margin-bottom: 2rem;
        font-size: 2.75rem;
        font-weight: 700;
        letter-spacing: -0.02em;
    }

    /* Form Sections */
    .form-section {
        background: #f9fafb;
        border-radius: 0.75rem;
        padding: 2rem 2.5rem;
        margin-bottom: 2.5rem;
        box-shadow: 0 4px 12px rgba(37, 99, 235, 0.05);
        border: 1px solid #e0e7ff;
        transition: box-shadow 0.3s ease;
    }

    .form-section:hover {
        box-shadow: 0 6px 20px rgba(37, 99, 235, 0.15);
    }

    .section-title {
        font-size: 1.5rem;
        font-weight: 700;
        color: #1e293b;
        margin-bottom: 1.5rem;
        border-bottom: 2px solid #c7d2fe;
        padding-bottom: 0.5rem;
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

    /* Form Layout */
    .form-row {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
        gap: 1.5rem 2rem;
    }

    .form-group {
        display: flex;
        flex-direction: column;
    }
    .form-group.searchable {
        position: relative;
    }

    label {
        font-weight: 600;
        margin-bottom: 0.5rem;
        color: #374151;
        font-size: 0.95rem;
        user-select: none;
    }

    .required::after {
        content: ' *';
        color: #ef4444;
    }

    .search-results {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: #fff;
        border: 1px solid #e3e8ee;
        border-radius: 10px;
        box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
        z-index: 50;
        max-height: 220px;
        overflow: auto;
        display: none;
    }
    .search-results button {
        width: 100%;
        text-align: left;
        padding: 8px 10px;
        border: 0;
        background: #fff;
        font-size: 12px;
        cursor: pointer;
    }
    .search-results button:hover {
        background: #f5f8fb;
    }

    input[type="text"],
    input[type="date"],
    select,
    textarea,
    input[type="number"] {
        background: #fff;
        border: 2px solid #d1d5db;
        border-radius: 0.5rem;
        padding: 0.75rem 1rem;
        font-size: 1rem;
        color: #111827;
        transition: border-color 0.3s ease, box-shadow 0.3s ease;
        font-weight: 500;
        outline-offset: 2px;
        width: 100%;
        box-sizing: border-box;
    }

    input[type="text"]::placeholder,
    textarea::placeholder {
        color: #9ca3af;
        font-weight: 400;
    }

    input[type="text"]:focus,
    input[type="date"]:focus,
    select:focus,
    textarea:focus,
    input[type="number"]:focus {
        border-color: #2563eb;
        box-shadow: 0 0 8px rgba(37, 99, 235, 0.3);
        outline: none;
    }

    /* Hide number input spinners */
    input[type="number"]::-webkit-outer-spin-button,
    input[type="number"]::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }
    input[type="number"] {
        -moz-appearance: textfield;
    }

    /* Buttons */
    .flex {
        display: flex;
    }

    .justify-end {
        justify-content: flex-end;
    }

    .space-x-4 > * + * {
        margin-left: 1rem;
    }

    button.submit-btn,
    button.reset-btn {
        padding: 0.5rem 1.25rem;
        border-radius: 0.75rem;
        font-size: 0.9rem;
        font-weight: 700;
        cursor: pointer;
        border: none;
        display: inline-flex;
        align-items: center;
        gap: 0.5rem;
        transition: background-color 0.3s ease, box-shadow 0.3s ease, transform 0.15s ease;
        user-select: none;
        text-decoration: none;
        box-shadow: 0 6px 12px rgba(37, 99, 235, 0.15);
    }

    button.submit-btn {
        background: linear-gradient(135deg, #22c55e, #16a34a);
        color: white;
        box-shadow: 0 8px 20px rgba(34, 197, 94, 0.4);
    }

    button.submit-btn:hover {
        background: linear-gradient(135deg, #16a34a, #15803d);
        box-shadow: 0 12px 28px rgba(22, 163, 74, 0.6);
        transform: translateY(-2px);
    }

    button.reset-btn {
        background-color: #6b7280;
        color: #f9fafb;
    }

    button.reset-btn:hover {
        background-color: #4b5563;
        box-shadow: 0 8px 16px rgba(75, 85, 99, 0.3);
        transform: translateY(-2px);
    }

    button.submit-btn:active,
    button.reset-btn:active {
        transform: translateY(0);
        box-shadow: 0 6px 12px rgba(37, 99, 235, 0.3);
    }

    /* Table Styles */
    .table-container {
        background: #f9fafb;
        border-radius: 0.75rem;
        padding: 2rem 2.5rem;
        box-shadow: 0 4px 12px rgba(37, 99, 235, 0.05);
        border: 1px solid #e0e7ff;
    }

    .table-title {
        font-size: 1.5rem;
        font-weight: 700;
        color: #1e293b;
        margin-bottom: 1.5rem;
        border-bottom: 2px solid #c7d2fe;
        padding-bottom: 0.5rem;
    }

    .table {
        width: 100%;
        border-collapse: collapse;
        background: white;
        border-radius: 0.5rem;
        overflow: hidden;
        box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    }

    .table th {
        background: linear-gradient(135deg, #2563eb, #1e40af);
        color: white;
        padding: 1rem;
        text-align: left;
        font-weight: 600;
        border: none;
    }

    .table td {
        padding: 1rem;
        border-bottom: 1px solid #e5e7eb;
        vertical-align: middle;
    }

    .table tbody tr:hover {
        background-color: #f8fafc;
    }

    .table tbody tr:last-child td {
        border-bottom: none;
    }

    .btn-action {
        padding: 0.5rem 1rem;
        border-radius: 0.5rem;
        font-size: 0.875rem;
        font-weight: 600;
        cursor: pointer;
        border: none;
        transition: all 0.3s ease;
        text-decoration: none;
        display: inline-flex;
        align-items: center;
        gap: 0.25rem;
    }

    .btn-edit {
        background-color: #3b82f6;
        color: white;
    }

    .btn-edit:hover {
        background-color: #2563eb;
        transform: translateY(-1px);
    }

    .btn-delete {
        background-color: #ef4444;
        color: white;
    }

    .btn-delete:hover {
        background-color: #dc2626;
        transform: translateY(-1px);
    }

    /* Responsive tweaks */
    @media (max-width: 1024px) {
        .form-row {
            grid-template-columns: 1fr;
        }
    }

    @media (max-width: 768px) {
        .container {
            padding: 1.25rem 1.25rem;
            margin: 1.5rem auto 2.5rem;
        }

        h1 {
            font-size: 2rem;
        }

        .form-section,
        .table-container {
            padding: 1.25rem 1.25rem;
        }

        .d-flex.justify-content-between {
            flex-direction: column;
            align-items: flex-start;
            gap: 0.75rem;
        }

        .flex.justify-end {
            flex-direction: column;
            align-items: stretch;
        }

        .space-x-4 > * + * {
            margin-left: 0;
            margin-top: 0.75rem;
        }
    }

    @media (max-width: 640px) {
        .form-row {
            grid-template-columns: 1fr;
            gap: 1rem;
        }
    }

    /* Success/Error Messages */
    .alert {
        padding: 1rem;
        border-radius: 0.5rem;
        margin-bottom: 1rem;
    }

    .alert-success {
        background-color: #d1fae5;
        color: #065f46;
        border: 1px solid #a7f3d0;
    }

    .alert-error {
        background-color: #fee2e2;
        color: #991b1b;
        border: 1px solid #fecaca;
    }
</style>

<div class="container" role="main" aria-labelledby="pageTitle">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <h1 id="pageTitle">Process Cashbook Entry</h1>
        <a href="{{ route('modules.processing') }}" class="btn btn-outline-primary d-flex align-items-center gap-2" style="border-radius: 0.5rem; padding: 0.5rem 1rem; text-decoration: none;">
            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-left" viewBox="0 0 16 16">
                <path fill-rule="evenodd" d="M15 8a.5.5 0 0 0-.5-.5H2.707l3.147-3.146a.5.5 0 1 0-.708-.708l-4 4a.5.5 0 0 0 0 .708l4 4a.5.5 0 0 0 .708-.708L2.707 8.5H14.5A.5.5 0 0 0 15 8z"/>
            </svg>
            Back to Processing
        </a>
    </div>

    <!-- Success/Error Messages -->
    <div id="messages">
        @if(session('success'))
            <div class="alert alert-success">
                {{ session('success') }}
            </div>
        @endif
        @if(session('error'))
            <div class="alert alert-error">
                {{ session('error') }}
            </div>
        @endif
    </div>

    <div class="row">
        <!-- Form Section -->
        <div class="col-12">
            @php
                $entry = $entry ?? null;
            @endphp
            <form id="cashbookForm" action="{{ $entry ? route('cashbook.entry.transaction.update', $entry->id) : route('cashbook.entry.transaction.store') }}" method="POST" novalidate>
                @csrf
                @if($entry)
                    @method('PUT')
                @endif

                <div class="form-section" aria-labelledby="entryDetailsTitle">
                    <h2 id="entryDetailsTitle" class="section-title">Entry Details</h2>

                    <div class="form-row">
                        <div class="form-group searchable">
                            <label for="cashbook_search" class="required">Cashbook</label>
                            @php
                                $selectedCashbookId = old('cashbook_id', $entry->cashbook_id ?? '');
                                $selectedCashbook = collect($cashbooks ?? [])->firstWhere('id', $selectedCashbookId);
                                $selectedCashbookLabel = $selectedCashbook
                                    ? $selectedCashbook->name . ' - ' . $selectedCashbook->account_number
                                    : '';
                            @endphp
                            <input type="text" id="cashbook_search" list="cashbook_list" value="{{ $selectedCashbookLabel }}" placeholder="Search cashbook" required aria-required="true">
                            <input type="hidden" name="cashbook_id" id="cashbook_id" value="{{ $selectedCashbookId }}">
                            <datalist id="cashbook_list">
                                @foreach($cashbooks ?? [] as $cashbook)
                                    <option value="{{ $cashbook->name }} - {{ $cashbook->account_number }}"></option>
                                @endforeach
                            </datalist>
                            <small id="cashbook_type_hint" class="text-gray-500"></small>
                        </div>

                        <div class="form-group">
                            <label for="transaction_date" class="required">Date</label>
                            <input type="date" id="transaction_date" name="transaction_date"
                                   value="{{ old('transaction_date', optional($entry?->transaction_date)->toDateString() ?? now()->toDateString()) }}" required aria-required="true">
                        </div>

                        <div class="form-group">
                            <label for="transaction_type" class="required">Transaction Type</label>
                            <select name="transaction_type" id="transaction_type" required aria-required="true">
                                <option value="">Select Type</option>
                                @foreach($transactionTypes ?? [] as $type => $label)
                                    <option value="{{ $type }}" {{ old('transaction_type', $entry->transaction_type ?? '') === $type ? 'selected' : '' }}>
                                        {{ $label }}
                                    </option>
                                @endforeach
                            </select>
                        </div>

                        <div class="form-group">
                            <label for="gl_account_id" class="required">Offset GL Account</label>
                            <select name="gl_account_id" id="gl_account_id" required aria-required="true">
                                <option value="">Select GL Account</option>
                                @foreach($glAccounts ?? [] as $account)
                                    <option value="{{ $account->id }}" {{ old('gl_account_id', $entry->gl_account_id ?? null) == $account->id ? 'selected' : '' }}>
                                        {{ $account->account_code }} - {{ $account->account_name }}
                                    </option>
                                @endforeach
                            </select>
                        </div>

                        <div class="form-group">
                            <label for="client_id">Client</label>
                            <select name="client_id_display" id="client_id_display">
                                <option value="">Select Client</option>
                                @foreach($clients ?? [] as $client)
                                    <option value="{{ $client->id }}" {{ old('client_id', $entry->client_id ?? null) == $client->id ? 'selected' : '' }}>
                                        {{ $client->full_name ?? trim(($client->first_name ?? '') . ' ' . ($client->last_name ?? '')) }}
                                    </option>
                                @endforeach
                            </select>
                            <input type="hidden" name="client_id" id="client_id" value="{{ old('client_id', $entry->client_id ?? null) }}">
                        </div>

                        <div class="form-group searchable">
                            <label for="matter_search">Matter</label>
                            @php
                                $selectedMatterId = old('matter_id', $entry->matter_id ?? '');
                                $selectedMatter = collect($matters ?? [])->firstWhere('id', $selectedMatterId);
                                $selectedMatterLabel = $selectedMatter
                                    ? $selectedMatter->matter_number
                                    : '';
                            @endphp
                            <input type="text" id="matter_search" value="{{ $selectedMatterLabel }}" placeholder="Search matter number" autocomplete="off">
                            <input type="hidden" name="matter_id" id="matter_id" value="{{ $selectedMatterId }}">
                            <div id="matter_results" class="search-results"></div>
                        </div>

                        <div class="form-group">
                            <label for="trust_account_id">Trust Account</label>
                            <select name="trust_account_id" id="trust_account_id">
                                <option value="">Select Trust Account</option>
                                @foreach($trustAccounts ?? [] as $trustAccount)
                                    <option value="{{ $trustAccount->id }}" {{ old('trust_account_id', $entry->trust_account_id ?? null) == $trustAccount->id ? 'selected' : '' }}>
                                        {{ $trustAccount->account_number }}
                                    </option>
                                @endforeach
                            </select>
                        </div>

                        <div class="form-group">
                            <label for="reference">Reference</label>
                            <input type="text" id="reference" name="reference"
                                   value="{{ old('reference', $entry->reference ?? '') }}" placeholder="Enter reference">
                            <small class="text-gray-500">Reference number or code</small>
                        </div>

                        <div class="form-group">
                            <label for="description" class="required">Description</label>
                            <textarea id="description" name="description" rows="3"
                                      placeholder="Enter description" required aria-required="true">{{ old('description', $entry->description ?? '') }}</textarea>
                        </div>

<div class="form-group">
                            <label for="amount" class="required">Amount</label>
                            <input type="text" id="amount" name="amount" inputmode="decimal" pattern="[0-9]*[.,]?[0-9]*"
                                   value="{{ number_format(old('amount', $entry->amount ?? 0), 2, '.', '') }}" placeholder="0.00" required aria-required="true">
                        </div>
                    </div>
                </div>

                <div class="flex justify-end space-x-4">
                    <button type="button" class="reset-btn" onclick="resetForm()">
                        <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15" />
                        </svg>
                        Reset
                    </button>
                    <button type="submit" class="submit-btn">
                        <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
                        </svg>
                        {{ isset($entry) ? 'Update Entry' : 'Save Entry' }}
                    </button>
                </div>
            </form>
        </div>

        <!-- Table Section -->
        <div class="col-12">
            <div class="table-container">
                <h2 class="table-title">Cashbook Entries</h2>

                <div class="table-responsive">
                    <table class="table">
                        <thead>
                            <tr>
                                <th>Date</th>
                                <th>Cashbook</th>
                                <th>Type</th>
                                <th>Amount</th>
                                <th>Client</th>
                                <th>Matter</th>
                                <th>Trust Account</th>
                                <th>Reference</th>
                                <th>Description</th>
                                <th>Actions</th>
                            </tr>
                        </thead>
                        <tbody id="cashbookEntries">
                            @forelse($cashbookEntries ?? [] as $entryRow)
                                <tr data-id="{{ $entryRow->id }}">
                                    <td>{{ $entryRow->transaction_date ? $entryRow->transaction_date->format('d/m/Y') : '' }}</td>
                                    <td>{{ $entryRow->cashbook?->name ?? 'N/A' }}</td>
                                    <td>{{ ucfirst($entryRow->transaction_type ?? '') }}</td>
                                    <td class="text-end">{{ number_format($entryRow->amount, 2) }}</td>
                                    <td>{{ $entryRow->client?->full_name ?? trim(($entryRow->client?->first_name ?? '') . ' ' . ($entryRow->client?->last_name ?? '')) ?: 'N/A' }}</td>
                                    <td>{{ $entryRow->matter?->matter_number ?? $entryRow->matter?->matter_title ?? 'N/A' }}</td>
                                    <td>{{ $entryRow->trustAccount?->account_number ?? 'N/A' }}</td>
                                    <td>{{ $entryRow->reference ?? '-' }}</td>
                                    <td>{{ \Illuminate\Support\Str::limit($entryRow->description, 30) }}</td>
                                    <td>
                                        <a class="btn-action btn-edit" href="{{ route('cashbook.entry.edit', $entryRow->id) }}">
                                            <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z" />
                                            </svg>
                                            Edit
                                        </a>
                                        <button class="btn-action btn-delete" onclick="deleteEntry({{ $entryRow->id }})">
                                            <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" />
                                            </svg>
                                            Delete
                                        </button>
                                    </td>
                                </tr>
                            @empty
                                <tr>
                                    <td colspan="10" class="text-center text-muted py-4">
                                        No cashbook entries found. Create your first entry using the form.
                                    </td>
                                </tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>

                <!-- Summary Section -->
                @if(isset($cashbookEntries) && $cashbookEntries->count() > 0)
                    @php
                        $totalReceipts = $cashbookEntries->where('transaction_type', 'receipt')->sum('amount');
                        $totalPayments = $cashbookEntries->where('transaction_type', 'payment')->sum('amount');
                        $totalTransfers = $cashbookEntries->where('transaction_type', 'transfer')->sum('amount');
                    @endphp
                    <div class="mt-4 p-3 bg-white rounded">
                        <div class="row text-center">
                            <div class="col-md-3">
                                <strong>Total Entries:</strong> {{ $cashbookEntries->count() }}
                            </div>
                            <div class="col-md-3">
                                <strong>Total Receipts:</strong>
                                <span class="text-success">
                                    {{ number_format($totalReceipts, 2) }}
                                </span>
                            </div>
                            <div class="col-md-3">
                                <strong>Total Payments:</strong>
                                <span class="text-danger">
                                    {{ number_format($totalPayments, 2) }}
                                </span>
                            </div>
                            <div class="col-md-3">
                                <strong>Total Transfers:</strong>
                                <span class="text-warning">
                                    {{ number_format($totalTransfers, 2) }}
                                </span>
                            </div>
                        </div>
                    </div>
                @endif
            </div>
        </div>
    </div>
</div>

<!-- Delete Confirmation Modal -->
<div class="modal fade" id="deleteModal" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header bg-danger text-white">
                <h5 class="modal-title">Confirm Deletion</h5>
                <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                Are you sure you want to delete this cashbook entry? This action cannot be undone.
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
                <form id="deleteForm" method="POST" style="display: inline;">
                    @csrf
                    @method('DELETE')
                    <button type="submit" class="btn btn-danger">Delete</button>
                </form>
            </div>
        </div>
    </div>
</div>

<script>
document.addEventListener('DOMContentLoaded', function() {
    const form = document.getElementById('cashbookForm');
    form.addEventListener('submit', function(e) {
        const requiredFields = form.querySelectorAll('[required]');
        let isValid = true;

        requiredFields.forEach(field => {
            if (!field.value.trim()) {
                isValid = false;
                field.style.borderColor = '#ef4444';
                field.addEventListener('input', function() {
                    if (this.value.trim()) {
                        this.style.borderColor = '#d1d5db';
                    }
                }, { once: true });
            }
        });

        if (!isValid) {
            e.preventDefault();
        }
    });

    const messages = document.getElementById('messages');
    if (messages.children.length > 0) {
        setTimeout(() => {
            messages.innerHTML = '';
        }, 5000);
    }

    const cashbookSearch = document.getElementById('cashbook_search');
    const cashbookIdInput = document.getElementById('cashbook_id');
    const cashbookTypeHint = document.getElementById('cashbook_type_hint');
    const trustAccountSelect = document.getElementById('trust_account_id');
    const clientSelect = document.getElementById('client_id_display');
    const clientIdHidden = document.getElementById('client_id');
    const matterSelect = document.getElementById('matter_id');
    const matterSearch = document.getElementById('matter_search');
    const matterResults = document.getElementById('matter_results');
    @php
        $cashbookPayload = collect($cashbooks ?? [])->map(function ($c) {
            return [
                'id' => $c->id,
                'name' => $c->name,
                'account_number' => $c->account_number,
                'is_trust' => (bool) $c->is_trust,
                'trust_account_id' => $c->trust_account_id,
                'trust_client_id' => $c->trustAccount?->client_id,
            ];
        })->values();
    @endphp
    const cashbooks = @json($cashbookPayload);
    @php
        $matterPayload = collect($matters ?? [])->map(function ($m) {
            return [
                'id' => $m->id,
                'matter_number' => $m->matter_number,
                'matter_title' => $m->matter_title,
            ];
        })->values();
    @endphp
    const matters = @json($matterPayload);

    const cashbookByLabel = new Map();
    const cashbookById = new Map();
    cashbooks.forEach(cb => {
        const label = `${cb.name} - ${cb.account_number}`;
        cashbookByLabel.set(label, cb);
        cashbookById.set(String(cb.id), cb);
    });

    const applyCashbook = (cb) => {
        if (!cb) {
            if (cashbookIdInput) cashbookIdInput.value = '';
            if (cashbookTypeHint) cashbookTypeHint.textContent = '';
            if (trustAccountSelect) trustAccountSelect.value = '';
            if (trustAccountSelect) trustAccountSelect.disabled = false;
            if (clientSelect) {
                clientSelect.value = '';
                clientSelect.disabled = false;
            }
            if (clientIdHidden) {
                clientIdHidden.value = '';
            }
            if (matterSelect) {
                matterSelect.value = '';
                matterSelect.disabled = false;
            }
            return;
        }
        if (cashbookIdInput) cashbookIdInput.value = cb.id;
        if (cashbookTypeHint) {
            cashbookTypeHint.textContent = cb.is_trust ? 'Trust cashbook selected.' : 'Business cashbook selected.';
        }
        if (trustAccountSelect) {
            if (cb.is_trust) {
                trustAccountSelect.disabled = false;
                trustAccountSelect.value = cb.trust_account_id || '';
            } else {
                trustAccountSelect.value = '';
                trustAccountSelect.disabled = true;
            }
        }
        if (clientSelect) {
            if (cb.is_trust) {
                if (cb.trust_client_id) {
                    clientSelect.value = cb.trust_client_id;
                }
                clientSelect.disabled = true;
            } else {
                clientSelect.value = '';
                clientSelect.disabled = true;
            }
        }
        if (clientIdHidden) {
            if (cb.is_trust) {
                clientIdHidden.value = cb.trust_client_id || '';
            } else {
                clientIdHidden.value = '';
            }
        }
        if (matterSelect) {
            if (!cb.is_trust) {
                matterSelect.value = '';
                if (matterSearch) matterSearch.value = '';
                matterSelect.disabled = true;
                if (matterSearch) matterSearch.disabled = true;
                if (matterResults) matterResults.style.display = 'none';
            } else {
                matterSelect.disabled = false;
                if (matterSearch) matterSearch.disabled = false;
            }
        }
    };

    if (cashbookSearch) {
        const syncFromInput = () => {
            const value = cashbookSearch.value.trim();
            if (!value) {
                applyCashbook(null);
                return;
            }
            const byLabel = cashbookByLabel.get(value);
            const byId = cashbookById.get(value);
            applyCashbook(byLabel || byId || null);
        };

        cashbookSearch.addEventListener('change', syncFromInput);
        cashbookSearch.addEventListener('blur', syncFromInput);

        if (cashbookIdInput && cashbookIdInput.value) {
            const existing = cashbookById.get(String(cashbookIdInput.value));
            if (existing) {
                cashbookSearch.value = `${existing.name} - ${existing.account_number}`;
                applyCashbook(existing);
            }
        }
    }

    if (matterSearch && matterSelect && matterResults) {
        const renderMatterResults = (items) => {
            matterResults.innerHTML = '';
            if (!items.length) {
                matterResults.style.display = 'none';
                return;
            }
            items.forEach(item => {
                const button = document.createElement('button');
                button.type = 'button';
                button.textContent = item.matter_number || item.matter_title || '';
                button.addEventListener('click', () => {
                    matterSearch.value = item.matter_number || item.matter_title || '';
                    matterSelect.value = item.id;
                    matterResults.style.display = 'none';
                });
                matterResults.appendChild(button);
            });
            matterResults.style.display = 'block';
        };

        matterSearch.addEventListener('input', () => {
            const term = matterSearch.value.trim().toLowerCase();
            matterSelect.value = '';
            if (!term) {
                matterResults.style.display = 'none';
                return;
            }
            const filtered = matters.filter(m => (m.matter_number || m.matter_title || '').toLowerCase().includes(term)).slice(0, 20);
            renderMatterResults(filtered);
        });

        document.addEventListener('click', (e) => {
            if (!matterResults.contains(e.target) && e.target !== matterSearch) {
                matterResults.style.display = 'none';
            }
        });
    }
});

function resetForm() {
    const form = document.getElementById('cashbookForm');
    form.reset();
    document.getElementById('transaction_date').value = '{{ now()->toDateString() }}';
    document.getElementById('amount').value = '0.00';
    const clientHidden = document.getElementById('client_id');
    if (clientHidden) clientHidden.value = '';
    const matterSearchField = document.getElementById('matter_search');
    if (matterSearchField) matterSearchField.value = '';

    const fields = document.querySelectorAll('input, select, textarea');
    fields.forEach(field => {
        field.style.borderColor = '#d1d5db';
    });
}

function deleteEntry(id) {
    const deleteForm = document.getElementById('deleteForm');
    deleteForm.action = `{{ route('cashbook.delete', ':id') }}`.replace(':id', id);
    const modal = new bootstrap.Modal(document.getElementById('deleteModal'));
    modal.show();
}

document.getElementById('amount').addEventListener('input', function(e) {
    let value = e.target.value.replace(/[^0-9.,]/g, '').replace(',', '.');
    const parts = value.split('.');
    if (parts.length > 2) {
        value = parts[0] + '.' + parts.slice(1).join('');
    }
    if (parts[1] && parts[1].length > 6) {
        value = parts[0] + '.' + parts[1].substring(0, 6);
    }
    e.target.value = value;
});

document.getElementById('amount').addEventListener('blur', function(e) {
    let value = e.target.value.trim();
    if (value === '' || value === '.') {
        e.target.value = '0.00';
        return;
    }
    let num = parseFloat(value);
    if (!isNaN(num) && num >= 0) {
        e.target.value = num.toFixed(2);
    } else {
        e.target.value = '0.00';
    }
});
</script>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
@endsection