@extends('layouts.app')
@section('page-title', 'Awards & Achievements')

@section('content')
<div class="page-header">
    <h1><i class="fas fa-trophy" style="color:#0097c4"></i> Awards & Achievements</h1>
    <a href="{{ route('awards.create') }}" class="btn btn-primary">
        <i class="fas fa-plus"></i> Add Award
    </a>
</div>

<!-- Filters -->
<form method="GET">
    <div style="background:white;border:1px solid #e2e8f0;border-radius:10px;padding:16px;margin-bottom:20px;display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;">
        <div style="flex:2;min-width:200px;">
            <label style="font-size:0.8rem;font-weight:500;display:block;margin-bottom:5px;">Search</label>
            <input type="text" name="search" class="form-control" value="{{ request('search') }}" placeholder="Award title...">
        </div>
        <div style="flex:1;min-width:180px;">
            <label style="font-size:0.8rem;font-weight:500;display:block;margin-bottom:5px;">Employee</label>
            <select name="employee_id" class="form-control">
                <option value="">All Employees</option>
                @foreach($employees as $emp)
                    <option value="{{ $emp->id }}" {{ request('employee_id') == $emp->id ? 'selected':'' }}>{{ $emp->name }}</option>
                @endforeach
            </select>
        </div>
        <div class="flex gap-2" style="flex-shrink:0;">
            <button type="submit" class="btn btn-primary"><i class="fas fa-search"></i> Search</button>
            <a href="{{ route('awards.index') }}" class="btn btn-secondary"><i class="fas fa-times"></i></a>
        </div>
    </div>
</form>

<!-- Award Cards -->
<div style="display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px;">
    @forelse($awards as $award)
    <div style="background:white;border:1px solid #e2e8f0;border-radius:10px;padding:18px;
                display:flex;gap:14px;align-items:flex-start;">
        <div style="width:48px;height:48px;background:linear-gradient(135deg,#fbbf24,#f59e0b);
                    border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;">
            <i class="fas fa-trophy" style="color:white;font-size:1.2rem;"></i>
        </div>
        <div style="flex:1;min-width:0;">
            <h3 style="font-size:0.95rem;font-weight:700;color:#1e293b;margin-bottom:4px;">{{ $award->title }}</h3>
            <div style="font-size:0.82rem;color:#0097c4;font-weight:600;margin-bottom:4px;">
                <i class="fas fa-user"></i> {{ $award->employee->name }}
                <span style="color:#94a3b8;font-weight:400;"> ({{ $award->employee->rg_id }})</span>
            </div>
            @if($award->description)
            <p style="font-size:0.8rem;color:#64748b;margin-bottom:8px;line-height:1.4;">{{ \Str::limit($award->description, 80) }}</p>
            @endif
            <div style="display:flex;justify-content:space-between;align-items:center;">
                <span style="font-size:0.75rem;color:#94a3b8;">
                    <i class="fas fa-calendar"></i> {{ $award->awarded_date->format('d M Y') }}
                </span>
                <div class="flex gap-2">
                    <a href="{{ route('awards.edit', $award) }}" class="btn btn-primary btn-sm"><i class="fas fa-edit"></i></a>
                    <form method="POST" action="{{ route('awards.destroy', $award) }}" onsubmit="return confirm('Delete award?')">
                        @csrf @method('DELETE')
                        <button type="submit" class="btn btn-danger btn-sm"><i class="fas fa-trash"></i></button>
                    </form>
                </div>
            </div>
        </div>
    </div>
    @empty
    <div style="grid-column:1/-1;text-align:center;padding:40px;color:#94a3b8;background:white;border-radius:10px;border:1px solid #e2e8f0;">
        <i class="fas fa-trophy" style="font-size:2rem;display:block;margin-bottom:8px;"></i>
        No awards found.
    </div>
    @endforelse
</div>

@if($awards->hasPages())
    <div style="margin-top:20px;">{{ $awards->links() }}</div>
@endif
@endsection