@extends('layouts.app')
@section('title',$project->name)
@section('page-title',$project->name)
@section('content')
<div class="d-flex justify-content-between mb-3">
  <a href="{{ route('projects.index') }}" class="btn btn-sm btn-outline-secondary"><i class="bi bi-arrow-left"></i> Projects</a>
  <a href="{{ route('projects.edit',$project) }}" class="btn btn-sm btn-outline-primary"><i class="bi bi-pencil"></i> Edit</a>
</div>
<div class="row g-3 mb-3">
  <div class="col-md-3"><div class="card stat-card p-3 text-center"><div class="text-muted small">Budget</div><div class="fs-5 fw-bold">GH₵ {{ number_format($project->budget,2) }}</div></div></div>
  <div class="col-md-3"><div class="card stat-card p-3 text-center"><div class="text-muted small">Total Spent</div><div class="fs-5 fw-bold text-danger">GH₵ {{ number_format($project->total_spent,2) }}</div></div></div>
  <div class="col-md-3"><div class="card stat-card p-3 text-center"><div class="text-muted small">Remaining</div><div class="fs-5 fw-bold text-success">GH₵ {{ number_format($project->budget_remaining,2) }}</div></div></div>
  <div class="col-md-3"><div class="card stat-card p-3 text-center"><div class="text-muted small">Budget Used</div><div class="fs-5 fw-bold">{{ $project->budget_percent }}%</div><div class="progress mt-2" style="height:6px"><div class="progress-bar {{ $project->budget_percent>90?'bg-danger':($project->budget_percent>70?'bg-warning':'bg-success') }}" style="width:{{ min($project->budget_percent,100) }}%"></div></div></div></div>
</div>
<div class="row g-3">
  <div class="col-md-8">
    <div class="card stat-card">
      <div class="card-header bg-white border-0 fw-semibold d-flex justify-content-between pt-3 px-3">
        <span>Expenditure by Category</span>
        <a href="{{ route('expenditures.create') }}?project_id={{ $project->id }}" class="btn btn-sm btn-primary"><i class="bi bi-plus-lg"></i> Add Expenditure</a>
      </div>
      <div class="table-responsive"><table class="table mb-0"><thead><tr><th>Category</th><th class="text-end">Amount Spent</th><th class="text-end">Budget</th><th>Usage</th></tr></thead>
      <tbody>
        @foreach($spendByCategory as $cat)
        @php $bc = $project->budgetCategories->firstWhere('category_id',$cat->category_id); $alloc=$bc?$bc->allocated_amount:0; $pct=$alloc>0?round(($cat->total/$alloc)*100,1):0; @endphp
        <tr><td><span class="badge" style="background:{{ $cat->category->color??'#6c757d' }}">{{ $cat->category->code??'-' }}</span> {{ $cat->category->name??'Unknown' }}</td>
        <td class="text-end fw-semibold">GH₵ {{ number_format($cat->total,2) }}</td>
        <td class="text-end text-muted">{{ $alloc>0?'GH₵ '.number_format($alloc,2):'-' }}</td>
        <td style="min-width:80px">@if($alloc>0)<div class="progress" style="height:6px"><div class="progress-bar {{ $pct>90?'bg-danger':'bg-primary' }}" style="width:{{ min($pct,100) }}%"></div></div><small class="text-muted">{{ $pct }}%</small>@endif</td></tr>
        @endforeach
      </tbody></table></div>
    </div>
  </div>
  <div class="col-md-4">
    <div class="card stat-card p-3 mb-3">
      <div class="fw-semibold mb-2">Project Details</div>
      <dl class="row mb-0 small">
        <dt class="col-5 text-muted">Location</dt><dd class="col-7">{{ $project->location }}</dd>
        <dt class="col-5 text-muted">Status</dt><dd class="col-7"><span class="badge bg-{{ $project->status==='active'?'success':'secondary' }}">{{ $project->status }}</span></dd>
        <dt class="col-5 text-muted">Supervisor</dt><dd class="col-7">{{ $project->site_supervisor ?? '-' }}</dd>
        <dt class="col-5 text-muted">Start Date</dt><dd class="col-7">{{ $project->start_date?->format('d M Y') ?? '-' }}</dd>
        <dt class="col-5 text-muted">Expected End</dt><dd class="col-7">{{ $project->expected_end_date?->format('d M Y') ?? '-' }}</dd>
        <dt class="col-5 text-muted">Staff</dt><dd class="col-7">{{ $project->staff->count() }}</dd>
        <dt class="col-5 text-muted">Subcontractors</dt><dd class="col-7">{{ $project->subcontractors->count() }}</dd>
      </dl>
    </div>
    <div class="card stat-card p-3">
      <div class="fw-semibold mb-2">Quick Actions</div>
      <div class="d-grid gap-2">
        <a href="{{ route('expenditures.index') }}?project_id={{ $project->id }}" class="btn btn-sm btn-outline-primary"><i class="bi bi-cash-coin me-1"></i>View Expenditures</a>
        <a href="{{ route('daily-reports.create') }}" class="btn btn-sm btn-outline-secondary"><i class="bi bi-clipboard-plus me-1"></i>Add Daily Report</a>
        <a href="{{ route('attendance.index') }}?project_id={{ $project->id }}" class="btn btn-sm btn-outline-secondary"><i class="bi bi-person-check me-1"></i>View Attendance</a>
        <a href="{{ route('reports.expenditure') }}?project_id={{ $project->id }}" class="btn btn-sm btn-outline-success"><i class="bi bi-bar-chart me-1"></i>Expenditure Report</a>
      </div>
    </div>
  </div>
</div>
@endsection