@extends('layouts.app')

@section('title', 'Detail Kontrak - TUNJUK-i')

@section('content')
<div class="mb-6">
    <div class="flex items-center justify-between">
        <div>
            <h1 class="text-2xl font-bold text-[#0b2b4a] flex items-center gap-2">
                <i class="fas fa-file-signature text-[#c9a84c]"></i>
                Detail Kontrak
            </h1>
            <p class="text-gray-500 text-sm mt-1">{{ $contract->contract_number }}</p>
        </div>
        <div class="flex items-center gap-3">
            <a href="{{ route('ppk.contracts.edit', $contract) }}" class="bg-yellow-500 text-white px-4 py-2 rounded-lg hover:bg-yellow-600 transition">
                <i class="fas fa-edit"></i> Edit
            </a>
            <a href="{{ route('ppk.contracts.index') }}" class="text-gray-600 hover:text-gray-800 transition">
                <i class="fas fa-arrow-left"></i> Kembali
            </a>
        </div>
    </div>
</div>

<div class="grid grid-cols-1 md:grid-cols-3 gap-6">
    <!-- Main Info -->
    <div class="md:col-span-2 bg-white rounded-2xl shadow-sm border border-gray-100 p-6">
        <h3 class="text-sm font-semibold text-gray-700 mb-4">Informasi Kontrak</h3>
        <div class="grid grid-cols-2 gap-4">
            <div>
                <label class="text-xs text-gray-500">No. Kontrak</label>
                <p class="text-sm font-medium text-gray-800">{{ $contract->contract_number }}</p>
            </div>
            <div>
                <label class="text-xs text-gray-500">Status</label>
                <p>
                    <span class="px-2 py-1 text-xs rounded-full 
                        {{ $contract->status === 'completed' ? 'bg-green-100 text-green-700' : 
                           ($contract->status === 'signed' ? 'bg-blue-100 text-blue-700' : 
                           ($contract->status === 'execution' ? 'bg-purple-100 text-purple-700' : 
                           ($contract->status === 'draft' ? 'bg-gray-100 text-gray-700' : 
                           'bg-red-100 text-red-700'))) }}">
                        {{ ucfirst($contract->status) }}
                    </span>
                </p>
            </div>
            <div>
                <label class="text-xs text-gray-500">Nilai Kontrak</label>
                <p class="text-sm font-medium text-gray-800">Rp {{ number_format($contract->value, 0, ',', '.') }}</p>
            </div>
            <div>
                <label class="text-xs text-gray-500">Paket</label>
                <p class="text-sm text-gray-800">{{ $contract->jobPackage->name ?? '-' }}</p>
            </div>
            <div>
                <label class="text-xs text-gray-500">Kontraktor</label>
                <p class="text-sm text-gray-800">{{ $contract->contractor->business_name ?? '-' }}</p>
            </div>
            <div>
                <label class="text-xs text-gray-500">Tanggal Mulai</label>
                <p class="text-sm text-gray-800">{{ $contract->start_date->format('d/m/Y') }}</p>
            </div>
            <div>
                <label class="text-xs text-gray-500">Tanggal Selesai</label>
                <p class="text-sm text-gray-800">{{ $contract->end_date->format('d/m/Y') }}</p>
            </div>
            <div>
                <label class="text-xs text-gray-500">Durasi</label>
                <p class="text-sm text-gray-800">{{ $contract->start_date->diffInDays($contract->end_date) }} hari</p>
            </div>
        </div>
    </div>

    <!-- Side Info -->
    <div class="bg-white rounded-2xl shadow-sm border border-gray-100 p-6">
        <h3 class="text-sm font-semibold text-gray-700 mb-4">Tanda Tangan</h3>
        <div class="space-y-4">
            <div>
                <label class="text-xs text-gray-500">PPK</label>
                @if($contract->ppk_signed_at)
                    <p class="text-sm text-green-600"><i class="fas fa-check-circle mr-1"></i> Sudah ditandatangani</p>
                    <p class="text-xs text-gray-400">{{ $contract->ppk_signed_at->format('d/m/Y H:i') }}</p>
                @else
                    <p class="text-sm text-yellow-600"><i class="fas fa-clock mr-1"></i> Belum ditandatangani</p>
                @endif
            </div>
            <div>
                <label class="text-xs text-gray-500">Kontraktor</label>
                @if($contract->contractor_signed_at)
                    <p class="text-sm text-green-600"><i class="fas fa-check-circle mr-1"></i> Sudah ditandatangani</p>
                    <p class="text-xs text-gray-400">{{ $contract->contractor_signed_at->format('d/m/Y H:i') }}</p>
                @else
                    <p class="text-sm text-yellow-600"><i class="fas fa-clock mr-1"></i> Belum ditandatangani</p>
                @endif
            </div>
        </div>
    </div>
</div>

<!-- Draft File -->
@if($contract->draft_file_url)
    <div class="mt-6 bg-white rounded-2xl shadow-sm border border-gray-100 p-6">
        <h3 class="text-sm font-semibold text-gray-700 mb-4">Draft Kontrak</h3>
        <a href="{{ asset('storage/' . $contract->draft_file_url) }}" target="_blank" class="text-blue-600 hover:text-blue-800">
            <i class="fas fa-file-pdf mr-2"></i> Lihat Draft
        </a>
    </div>
@endif
@endsection