@extends('layouts.app')

@section('title', $announcement->title)
@section('header', $announcement->title)
@section('subheader', 'Announcement')

@section('header-actions')
    <div class="d-flex gap-2">
        <a href="{{ route('announcements.index') }}" class="btn btn-outline-secondary"><i class="bi bi-list-ul me-1"></i>All</a>
        @can('update', $announcement)
            <a href="{{ route('announcements.edit', $announcement) }}" class="btn btn-outline-primary"><i class="bi bi-pencil me-1"></i>Edit</a>
        @endcan
    </div>
@endsection

@section('content')
    <div class="card table-wrapper">
        <div class="card-body">
            <div class="d-flex flex-wrap gap-2 mb-3">
                <span class="badge text-bg-primary"><i class="bi bi-people me-1"></i>{{ $announcement->audienceLabel() }}</span>
                <span class="badge text-bg-light">
                    <i class="bi bi-clock me-1"></i>{{ $announcement->published_at?->format('d M Y, H:i') ?? 'Draft' }}
                </span>
                @if ($announcement->creator)
                    <span class="badge text-bg-light"><i class="bi bi-person me-1"></i>{{ $announcement->creator->name }}</span>
                @endif
            </div>

            <div class="fs-6" style="white-space: pre-line;">{{ $announcement->body }}</div>
        </div>
    </div>
@endsection