@extends('layouts.finance')

@php
    $isEdit = $card->exists;
@endphp

@section('title', $isEdit ? 'Edit Credit Card' : 'Add Credit Card')
@section('subtitle', $isEdit ? 'Update card details' : 'Enter card details before adding it to liabilities')

@section('content')
<div class="card" style="max-width:760px;margin:0 auto">
    <div class="section-head">
        <div>
            <h3>{{ $isEdit ? 'Edit Credit Card' : 'Add Credit Card' }}</h3>
            <div class="text-xs muted mt-3">Card limits and payable balances feed total debt, utilization, and dashboard KPIs.</div>
        </div>
        <a class="btn" href="{{ route('finance.liabilities') }}">Back</a>
    </div>

    <form method="POST" action="{{ $isEdit ? route('finance.liabilities.cards.update', $card) : route('finance.liabilities.cards.store') }}" class="p-4">
        @csrf
        @if($isEdit)
            @method('PUT')
        @endif

        <div class="grid grid-cols-2 gap-3 mb-4">
            <div>
                <label class="label" for="issuer">Issuer</label>
                <input class="field" id="issuer" name="issuer" value="{{ old('issuer', $card->issuer) }}" required maxlength="255" placeholder="American Express">
            </div>
            <div>
                <label class="label" for="card_name">Card Name</label>
                <input class="field" id="card_name" name="card_name" value="{{ old('card_name', $card->card_name) }}" required maxlength="255" placeholder="Business Gold">
            </div>
        </div>

        <div class="grid grid-cols-2 gap-3 mb-4">
            <div>
                <label class="label" for="holder">Holder</label>
                <input class="field" id="holder" name="holder" value="{{ old('holder', $card->holder) }}" required maxlength="255" placeholder="Examism LLC">
            </div>
            <div>
                <label class="label" for="short_name">Short Code</label>
                <input class="field" id="short_name" name="short_name" value="{{ old('short_name', $card->short_name) }}" maxlength="20" placeholder="AMEX">
            </div>
        </div>

        <div class="grid grid-cols-3 gap-3 mb-4">
            <div>
                <label class="label" for="credit_limit">Credit Limit</label>
                <input class="field" id="credit_limit" type="number" step="0.01" min="0" name="credit_limit" value="{{ old('credit_limit', $card->credit_limit ?? 0) }}" required>
            </div>
            <div>
                <label class="label" for="opening_balance">Opening Balance</label>
                <input class="field" id="opening_balance" type="number" step="0.01" min="0" name="opening_balance" value="{{ old('opening_balance', $card->opening_balance ?? 0) }}" required>
            </div>
            <div>
                <label class="label" for="payable_balance">Current Payable</label>
                <input class="field" id="payable_balance" type="number" step="0.01" min="0" value="{{ old('payable_balance', $card->payable_balance ?? $card->opening_balance ?? 0) }}" disabled style="background:var(--bg-2)">
            </div>
        </div>

        <div class="grid grid-cols-2 gap-3 mb-4">
            <div>
                <label class="label" for="currency">Currency</label>
                <select class="field" id="currency" name="currency" required>
                    @foreach(['USD', 'PKR', 'AUD'] as $currency)
                        <option value="{{ $currency }}" @selected(old('currency', $card->currency) === $currency)>{{ $currency }}</option>
                    @endforeach
                </select>
            </div>
            <div>
                <label class="label" for="due_date">Due Date</label>
                <input class="field" id="due_date" type="date" name="due_date" value="{{ old('due_date', $card->due_date?->toDateString() ?? now()->toDateString()) }}">
            </div>
        </div>

        <div class="grid grid-cols-2 gap-3 mb-4">
            <div>
                <label class="label" for="color">Brand Color</label>
                <input class="field" id="color" type="color" name="color" value="{{ old('color', str_starts_with((string) $card->color, '#') ? $card->color : '#6366f1') }}" style="height:42px;padding:4px">
            </div>
            <div>
                <label class="label" for="notes">Notes</label>
                <input class="field" id="notes" name="notes" value="{{ old('notes', $card->notes) }}" maxlength="2000" placeholder="Optional">
            </div>
        </div>

        <label class="flag mb-4" style="width:max-content">
            <input type="checkbox" name="is_active" value="1" @checked(old('is_active', $card->is_active ?? true))>
            Active
        </label>

        <div class="flex items-center justify-end gap-2">
            <a class="btn" href="{{ route('finance.liabilities') }}">Cancel</a>
            <button class="btn btn-primary" type="submit">{{ $isEdit ? 'Update Card' : 'Save Card' }}</button>
        </div>
    </form>
</div>
@endsection