@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 lg:grid-cols-3 gap-6">
    <div class="lg:col-span-2 space-y-5">

        <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>
        </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">price adjustment</div>
                </div>
                @endif
            </div>

            @if($variant->description)
            <p class="text-sm text-slate-400 mb-3">{{ $variant->description }}</p>
            @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 by {{ $variant->respondedBy?->name }} on {{ $variant->responded_at->format('d M Y') }}</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? This will also update the linked quote.')">
                        <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>
            <p class="text-xs text-slate-500 mt-1">Add a variant below to track quote options presented to the client.</p>
        </div>
        @endforelse
    </div>

    {{-- Sidebar: Add Variant --}}
    <div class="space-y-4">
        <div class="card p-5">
            <h3 class="mb-4"><i class="fas fa-plus-circle text-blue-400 mr-2"></i>Add Variant</h3>
            <form method="POST" action="{{ route('jobs.variants.store', $job) }}" class="space-y-3">
                @csrf
                <div>
                    <label>Variant Name *</label>
                    <input type="text" name="name" value="{{ old('name') }}" class="input" placeholder="e.g. Island Extension Option" required>
                </div>
                <div>
                    <label>Linked Quote</label>
                    <select name="quote_id" class="input">
                        <option value="">— No linked quote —</option>
                        @foreach($job->quotes as $q)
                        <option value="{{ $q->id }}" {{ old('quote_id')==$q->id ? 'selected' : '' }}>{{ $q->quote_number }} ({{ ucfirst($q->status) }})</option>
                        @endforeach
                    </select>
                </div>
                <div>
                    <label>Description</label>
                    <textarea name="description" rows="3" class="input" placeholder="Describe the variant option…">{{ old('description') }}</textarea>
                </div>
                <div>
                    <label>Price Adjustment $</label>
                    <input type="number" name="price_adjustment" value="{{ old('price_adjustment', 0) }}" step="0.01" class="input" placeholder="+500 or -200">
                </div>
                <div>
                    <label>Internal Notes</label>
                    <textarea name="internal_notes" rows="2" class="input" placeholder="Notes for the team…">{{ old('internal_notes') }}</textarea>
                </div>
                <button type="submit" class="btn btn-primary w-full justify-center">Add Variant</button>
            </form>
        </div>

        <div class="card p-4">
            <a href="{{ route('jobs.show', $job) }}" class="btn btn-secondary w-full justify-center">
                <i class="fas fa-arrow-left mr-2"></i>Back to Job
            </a>
        </div>
    </div>
</div>

@if($errors->any())
<div class="fixed bottom-4 right-4 card p-4 border-red-500 bg-red-900/20 max-w-sm">
    <ul class="text-red-400 text-sm space-y-1">@foreach($errors->all() as $e)<li>{{ $e }}</li>@endforeach</ul>
</div>
@endif
@endsection