@php($editing = isset($recurringExpense))
<div class="grid gap-4 md:grid-cols-2">
    <div><label class="mf-label">Branch</label><select class="mf-select" name="branch_id" id="recurring-branch" required><option value="">Select branch</option>@foreach($branches as $branch)<option value="{{ $branch->id }}" data-business="{{ $branch->business_id }}" @selected((string)old('branch_id',$editing?$recurringExpense->branch_id:null)===(string)$branch->id)>{{ $branch->name }}</option>@endforeach</select>@error('branch_id')<div class="mf-error">{{ $message }}</div>@enderror</div>
    <div><label class="mf-label">Category</label><select class="mf-select" name="expense_category_id" id="recurring-category" required><option value="">Select category</option>@foreach($categories as $category)<option value="{{ $category->id }}" data-business="{{ $category->business_id }}" @selected((string)old('expense_category_id',$editing?$recurringExpense->expense_category_id:null)===(string)$category->id)>{{ $category->name }}</option>@endforeach</select>@error('expense_category_id')<div class="mf-error">{{ $message }}</div>@enderror</div>
    <div><label class="mf-label">Default paid-from account</label><select class="mf-select" name="financial_account_id" id="recurring-account" required><option value="">Select account</option>@foreach($accounts as $account)<option value="{{ $account->id }}" data-branch="{{ $account->branch_id }}" @selected((string)old('financial_account_id',$editing?$recurringExpense->financial_account_id:null)===(string)$account->id)>{{ $account->name }} — {{ number_format((float)$account->current_balance,2) }}</option>@endforeach</select>@error('financial_account_id')<div class="mf-error">{{ $message }}</div>@enderror</div>
    <div><label class="mf-label">Amount</label><input class="mf-input" inputmode="decimal" name="amount" value="{{ old('amount',$editing?$recurringExpense->amount:null) }}" required>@error('amount')<div class="mf-error">{{ $message }}</div>@enderror</div>
    <div class="md:col-span-2"><label class="mf-label">Description</label><input class="mf-input" name="description" value="{{ old('description',$editing?$recurringExpense->description:null) }}" required>@error('description')<div class="mf-error">{{ $message }}</div>@enderror</div>
    <div><label class="mf-label">Supplier</label><input class="mf-input" name="supplier" value="{{ old('supplier',$editing?$recurringExpense->supplier:null) }}"></div>
    <div><label class="mf-label">Frequency</label><select class="mf-select" name="recurrence" id="recurrence" required>@foreach(['weekly'=>'Weekly','monthly'=>'Monthly','quarterly'=>'Quarterly','yearly'=>'Yearly','custom_days'=>'Custom days'] as $value=>$label)<option value="{{ $value }}" @selected(old('recurrence',$editing?$recurringExpense->recurrence:'monthly')===$value)>{{ $label }}</option>@endforeach</select>@error('recurrence')<div class="mf-error">{{ $message }}</div>@enderror</div>
    <div id="custom-days-wrap"><label class="mf-label">Custom interval (days)</label><input class="mf-input" type="number" min="1" max="3650" name="interval_days" value="{{ old('interval_days',$editing?$recurringExpense->interval_days:null) }}">@error('interval_days')<div class="mf-error">{{ $message }}</div>@enderror</div>
    <div><label class="mf-label">Reminder days before</label><input class="mf-input" type="number" min="0" max="365" name="reminder_days_before" value="{{ old('reminder_days_before',$editing?$recurringExpense->reminder_days_before:3) }}" required>@error('reminder_days_before')<div class="mf-error">{{ $message }}</div>@enderror</div>
    @if($editing)
        <div><label class="mf-label">Next due date</label><input class="mf-input" type="date" name="next_due_date" value="{{ old('next_due_date',$recurringExpense->next_due_date->toDateString()) }}" required>@error('next_due_date')<div class="mf-error">{{ $message }}</div>@enderror</div>
    @else
        <div><label class="mf-label">First due date</label><input class="mf-input" type="date" name="start_date" value="{{ old('start_date',now()->toDateString()) }}" required>@error('start_date')<div class="mf-error">{{ $message }}</div>@enderror</div>
    @endif
    <div><label class="mf-label">End date</label><input class="mf-input" type="date" name="end_date" value="{{ old('end_date',$editing&&$recurringExpense->end_date?$recurringExpense->end_date->toDateString():null) }}">@error('end_date')<div class="mf-error">{{ $message }}</div>@enderror</div>
    <div><label class="mf-label">Status</label><select class="mf-select" name="status"><option value="active" @selected(old('status',$editing?$recurringExpense->status:'active')==='active')>Active</option><option value="inactive" @selected(old('status',$editing?$recurringExpense->status:'active')==='inactive')>Inactive</option></select></div>
    <div class="md:col-span-2"><label class="mf-label">Notes</label><textarea class="mf-textarea" name="notes" rows="4">{{ old('notes',$editing?$recurringExpense->notes:null) }}</textarea></div>
</div>
@push('scripts')
<script>
document.addEventListener('DOMContentLoaded',()=>{const branch=document.getElementById('recurring-branch'),category=document.getElementById('recurring-category'),account=document.getElementById('recurring-account'),recurrence=document.getElementById('recurrence'),custom=document.getElementById('custom-days-wrap');const filter=()=>{const selected=branch.options[branch.selectedIndex],business=selected?.dataset.business,branchId=branch.value;[...category.options].forEach((o,i)=>{if(!i)return;o.hidden=!!business&&o.dataset.business!==business;if(o.hidden&&o.selected)category.value='';});[...account.options].forEach((o,i)=>{if(!i)return;o.hidden=!!branchId&&o.dataset.branch!==branchId;if(o.hidden&&o.selected)account.value='';});};const frequency=()=>{custom.style.display=recurrence.value==='custom_days'?'block':'none';};branch.addEventListener('change',filter);recurrence.addEventListener('change',frequency);filter();frequency();});
</script>
@endpush