@extends('admin.layouts.app')

@section('title', __('admin/client-balances.create'))

@section('content')
<div class="container-fluid px-4">
    <x-admin.page-header
        :title="__('admin/client-balances.create')"
        :subtitle="__('admin/client-balances.create_subtitle')"
        icon="fas fa-wallet"
        :buttons="[
            ['label' => __('admin/client-balances.buttons_back'), 'route' => route('admin.client-balances.index'), 'icon' => 'fas fa-arrow-left', 'color' => 'outline-secondary'],
        ]"
    />

    <x-admin.alert />

    {{-- PRC-477 — form MUST wrap the card so the footer-slot Save button
         (x-admin.form-actions, type=submit) is inside the form; previously
         </form> closed before the footer → button.closest('form')=null,
         submit never fired (AJAX handler in create.js bound to form submit). --}}
    <form id="addBalanceForm">
    <x-admin.card :title="__('admin/client-balances.balance_info')">
            <div class="row g-3">
                <div class="col-md-4">
                    <label for="client_id" class="form-label">{{ __('admin/client-balances.fields_client') }} <span class="text-danger">*</span></label>
                    <select class="form-select" id="client_id" name="client_id" required>
                        <option value="">{{ __('admin/client-balances.placeholders_select_client') }}</option>
                    </select>
                    @error('client_id') <div class="invalid-feedback">{{ $message }}</div> @enderror
                </div>
                <div class="col-md-4">
                    <label for="balance_type_id" class="form-label">{{ __('admin/client-balances.fields_balance_type') }} <span class="text-danger">*</span></label>
                    <select class="form-select" id="balance_type_id" name="balance_type_id" required>
                        <option value="">{{ __('admin/client-balances.placeholders_select_balance_type') }}</option>
                        @foreach($balanceTypes as $type)
                            <option value="{{ $type->id }}" data-positive="{{ $type->is_positive }}">
                                {{ $type->name }} ({{ $type->is_positive ? '+' : '-' }})
                            </option>
                        @endforeach
                    </select>
                    @error('balance_type_id') <div class="invalid-feedback">{{ $message }}</div> @enderror
                </div>
                <div class="col-md-4">
                    <label for="amount" class="form-label">{{ __('admin/client-balances.fields_amount') }} <span class="text-danger">*</span></label>
                    <input type="number" class="form-control" id="amount" name="amount"
                           step="0.01" min="0.01" max="999999.99"
                           placeholder="{{ __('admin/client-balances.placeholders_enter_amount') }}" required>
                           @error('amount') <div class="invalid-feedback">{{ $message }}</div> @enderror
                </div>
            </div>

            <!-- Hidden currency field - will be set automatically from client -->
            <input type="hidden" id="currency_id" name="currency_id">

            <div class="row g-3 mt-1">
                <div class="col-md-12">
                    <label for="description" class="form-label">{{ __('admin/client-balances.fields_description') }}</label>
                    <textarea class="form-control" id="description" name="description" rows="3"
                              placeholder="{{ __('admin/client-balances.placeholders_enter_description') }}"></textarea>
                </div>
            </div>

            <div class="row g-3 mt-1">
                <div class="col-md-6">
                    <label for="reference_type" class="form-label">{{ __('admin/client-balances.fields_reference_type') }}</label>
                    <input type="text" class="form-control" id="reference_type" name="reference_type"
                           placeholder="{{ __('admin/client-balances.placeholders_enter_reference_type') }}">
                </div>
                <div class="col-md-6">
                    <label for="reference_id" class="form-label">{{ __('admin/client-balances.fields_reference_id') }}</label>
                    <input type="number" class="form-control" id="reference_id" name="reference_id"
                           placeholder="{{ __('admin/client-balances.placeholders_enter_reference_id') }}">
                </div>
            </div>

        <x-slot:footer>
            <x-admin.form-actions
                :cancel-url="route('admin.client-balances.index')"
                :submit-text="__('admin/client-balances.buttons_save')"
            />
        </x-slot:footer>
    </x-admin.card>
    </form>
</div>
@endsection

@push('scripts')
<script>
    window.routes = {
        clientBalances: {
            addBalance: '{{ route('api.admin.client-balances.add-balance') }}',
            index: '{{ route('admin.client-balances.index') }}',
            clientSearch: '{{ route('api.admin.clients.search') }}'
        }
    };

    window.translations = {
        clientBalances: {
            placeholders_select_client: '{{ __("admin/client-balances.placeholders_select_client") }}',
            placeholders: {
                positive_amount: '{{ __("admin/client-balances.placeholders_positive_amount") }}',
                negative_amount: '{{ __("admin/client-balances.placeholders_negative_amount") }}'
            }
        }
    };
</script>
@vite('resources/js/admin/client-balances/create.js')
@endpush
