@extends('layouts.app')
@section('title', 'Job Variants — ' . $job->job_number)
@section('breadcrumb')<a href="{{ route('jobs.show', $job) }}" class="hover:text-white">{{ $job->job_number }}</a> <i class="fas fa-chevron-right text-xs mx-1 text-slate-600"></i> <span class="text-white">Variants</span>@endsection

@section('content')

@if(session('success'))
<div class="card p-4 mb-4 border-green-700 bg-green-900/20">
    <p class="text-green-400 text-sm"><i class="fas fa-check-circle mr-2"></i>{{ session('success') }}</p>
</div>
@endif

<div class="grid grid-cols-1 gap-6">
    <div class="flex items-center justify-between">
        <div>
            <h1 class="mb-1">Job Variants</h1>
            <p>{{ $job->job_number }} · {{ $job->contact?->full_name }}</p>
        </div>
        <a href="{{ route('jobs.show', $job) }}" class="btn btn-secondary">
            <i class="fas fa-arrow-left mr-2"></i>Back to Job
        </a>
    </div>

    @forelse($job->variants->sortByDesc('created_at') as $variant)
    <div class="card p-5">
        <div class="flex items-start justify-between mb-3">
            <div>
                <div class="flex items-center gap-2 mb-1">
                    <h3>{{ $variant->name }}</h3>
                    <span class="badge badge-{{ $variant->statusColor() }}">{{ ucfirst($variant->status) }}</span>
                </div>
                @if($variant->quote)
                <p class="text-xs text-slate-500">Linked quote: <a href="{{ route('quotes.show', $variant->quote) }}" class="text-blue-400 hover:text-blue-300">{{ $variant->quote->quote_number }}</a></p>
                @endif
            </div>
            @if($variant->price_adjustment != 0)
            <div class="text-right">
                <div class="text-sm font-semibold {{ $variant->price_adjustment > 0 ? 'text-green-400' : 'text-red-400' }}">
                    {{ $variant->price_adjustment > 0 ? '+' : '' }}${{ number_format(abs($variant->price_adjustment), 2) }}
                </div>
                <div class="text-xs text-slate-500">total retail (ex. GST)</div>
            </div>
            @endif
        </div>

        @if($variant->description)
        <p class="text-sm text-slate-400 mb-3">{{ $variant->description }}</p>
        @endif

        {{-- Items table --}}
        @if($variant->items->count())
        <div class="overflow-x-auto mb-3">
            <table class="w-full text-sm">
                <thead>
                    <tr class="text-xs text-slate-400 border-b border-slate-700">
                        <th class="px-3 py-2 text-left">Description</th>
                        <th class="px-3 py-2 text-left">Item Code</th>
                        <th class="px-3 py-2 text-center">Unit</th>
                        <th class="px-3 py-2 text-right">Qty</th>
                        <th class="px-3 py-2 text-right">Retail Price</th>
                        <th class="px-3 py-2 text-right">Total</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($variant->items as $item)
                    <tr class="border-b border-slate-800">
                        <td class="px-3 py-2 text-white">{{ $item->description }}</td>
                        <td class="px-3 py-2 text-slate-400 text-xs">{{ $item->item_code ?? '—' }}</td>
                        <td class="px-3 py-2 text-center text-slate-400">{{ $item->unit ?? 'Each' }}</td>
                        <td class="px-3 py-2 text-right text-slate-300">{{ number_format((float)$item->qty, 2) }}</td>
                        <td class="px-3 py-2 text-right text-slate-300">${{ number_format((float)$item->retail_price, 2) }}</td>
                        <td class="px-3 py-2 text-right text-green-400 font-medium">${{ number_format($item->retailTotal(), 2) }}</td>
                    </tr>
                    @endforeach
                </tbody>
                <tfoot>
                    <tr class="border-t-2 border-slate-600">
                        <td colspan="5" class="px-3 py-2 text-right text-slate-400">Subtotal (ex. GST)</td>
                        <td class="px-3 py-2 text-right text-green-400 font-semibold">${{ number_format($variant->totalRetail(), 2) }}</td>
                    </tr>
                </tfoot>
            </table>
        </div>
        @endif

        @if($variant->client_notes)
        <div class="bg-slate-800/50 rounded-lg p-3 mb-3">
            <p class="text-xs text-slate-500 mb-1">Client notes:</p>
            <p class="text-sm text-slate-300">{{ $variant->client_notes }}</p>
        </div>
        @endif

        @if($variant->internal_notes)
        <div class="bg-slate-800/50 rounded-lg p-3 mb-3">
            <p class="text-xs text-slate-500 mb-1">Internal notes:</p>
            <p class="text-sm text-slate-400">{{ $variant->internal_notes }}</p>
        </div>
        @endif

        @if($variant->responded_at)
        <p class="text-xs text-slate-500 mb-3">Responded {{ $variant->responded_at->format('d M Y') }}</p>
        @endif

        @if($variant->stripe_payment_status)
        <p class="text-xs text-slate-500 mb-2">Stripe: <span class="font-medium text-indigo-400">{{ ucfirst(str_replace('_', ' ', $variant->stripe_payment_status)) }}</span></p>
        @endif

        @if($variant->status === 'pending')
        <div class="flex gap-2 mt-3 pt-3 border-t border-slate-700">
            <form method="POST" action="{{ route('jobs.variants.accept', [$job, $variant]) }}" class="flex-1">
                @csrf
                <button type="submit" class="btn btn-success w-full justify-center text-sm" onclick="return confirm('Mark this variant as accepted?')">
                    <i class="fas fa-check mr-1"></i> Accept
                </button>
            </form>
            <form method="POST" action="{{ route('jobs.variants.reject', [$job, $variant]) }}" class="flex-1">
                @csrf
                <button type="submit" class="btn btn-danger w-full justify-center text-sm" onclick="return confirm('Mark this variant as rejected?')">
                    <i class="fas fa-times mr-1"></i> Reject
                </button>
            </form>
            <form method="POST" action="{{ route('jobs.variants.destroy', [$job, $variant]) }}" onsubmit="return confirm('Delete this variant?')">
                @csrf @method('DELETE')
                <button type="submit" class="btn btn-secondary text-sm text-red-400"><i class="fas fa-trash"></i></button>
            </form>
        </div>
        @endif
    </div>
    @empty
    <div class="card p-12 text-center">
        <i class="fas fa-code-branch text-slate-700 text-4xl mb-3 block"></i>
        <p class="text-slate-400">No variants yet for this job.</p>
    </div>
    @endforelse
</div>
@endsection