@extends('layouts.app')

@section('title', $letter->subject)
@section('heading', 'Generated Letter')

@section('content')
@include('documents.top-submenu')
    <x-card>
        <div class="mb-4 flex flex-wrap gap-3">
            <a href="{{ route('generated-letters.index') }}" class="text-sm text-primary hover:underline">&larr; All letters</a>
            <a href="{{ route('generated-letters.pdf', $letter) }}" class="text-sm font-medium text-slate-700 hover:underline">Download PDF</a>
            <a href="{{ route('generated-letters.edit', $letter) }}" class="btn-icon-action btn-icon-action--edit" title="Edit" aria-label="Edit"><i class="bi bi-pencil-square"></i></a>
            <button type="button" onclick="window.print()" class="text-sm font-medium text-slate-700 hover:underline">Print</button>
        </div>

        @if(session('success'))
            <div class="mb-4 rounded-lg border border-emerald-200 bg-emerald-50 px-3 py-2 text-sm text-emerald-800">{{ session('success') }}</div>
        @endif
        @if(session('error'))
            <div class="mb-4 rounded-lg border border-amber-200 bg-amber-50 px-3 py-2 text-sm text-amber-900">{{ session('error') }}</div>
        @endif

        <div class="mb-4 text-sm text-slate-600">
            <strong>{{ $letter->typeLabel() }}</strong> for {{ $letter->employee?->name }}
            @if($letter->generatedBy) · Generated by {{ $letter->generatedBy->name }} @endif
            · {{ $letter->created_at?->format('d M Y H:i') }}
        </div>

        <div class="mx-auto max-w-3xl rounded-lg border border-slate-200 bg-white p-8 shadow-sm print:border-0 print:shadow-none">
            @if($parts['header'])
                <div class="mb-6 border-b border-slate-200 pb-4 text-sm">{!! $parts['header'] !!}</div>
            @endif

            <h1 class="mb-4 text-lg font-semibold text-slate-900">{{ $letter->subject }}</h1>

            <div class="min-h-[240px] text-sm leading-relaxed text-slate-800">
                {!! $parts['body'] !!}
            </div>

            @if($parts['footer'])
                <div class="mt-8 border-t border-slate-200 pt-4 text-xs text-slate-500">{!! $parts['footer'] !!}</div>
            @endif
        </div>
    </x-card>
@endsection