@props([
    'progress',          // App\Support\Witness\WitnessProgress
    'compact' => false,
])

@php
    $overall = $progress->overallPercent();
    $ready = $progress->isReadyToGenerate();
    $barClass = $ready ? 'bg-success' : ($overall > 60 ? 'bg-primary' : 'bg-warning');
@endphp

<div {{ $attributes->merge(['class' => 'witness-progress']) }}>
    <div class="d-flex justify-content-between align-items-center mb-1">
        <span class="fw-semibold small text-uppercase text-muted">Completion</span>
        <span class="fw-bold">{{ $overall }}%</span>
    </div>

    <div class="progress" role="progressbar" aria-label="Overall completion"
         aria-valuenow="{{ $overall }}" aria-valuemin="0" aria-valuemax="100" style="height: .55rem;">
        <div class="progress-bar {{ $barClass }}" style="width: {{ $overall }}%"></div>
    </div>

    @unless($compact)
        <div class="d-flex flex-wrap gap-2 mt-3">
            <span class="badge rounded-pill bg-light text-dark border">
                <span class="mdi mdi-clipboard-check-outline" aria-hidden="true"></span>
                {{ $progress->answeredQuestions }}/{{ $progress->totalQuestions }} answered
            </span>
            <span class="badge rounded-pill {{ $progress->requiredUnanswered ? 'bg-danger-subtle text-danger-emphasis' : 'bg-success-subtle text-success-emphasis' }}">
                <span class="mdi mdi-asterisk" aria-hidden="true"></span>
                {{ $progress->requiredAnswered }}/{{ $progress->requiredTotal }} required
            </span>
            @if($progress->awaitingReview)
                <span class="badge rounded-pill bg-warning-subtle text-warning-emphasis">
                    <span class="mdi mdi-lightbulb-on-outline" aria-hidden="true"></span>
                    {{ $progress->awaitingReview }} to review
                </span>
            @endif
            <span class="badge rounded-pill bg-light text-dark border">
                <span class="mdi mdi-paperclip" aria-hidden="true"></span>
                {{ $progress->exhibitCount }} exhibits
            </span>
        </div>

        <div class="mt-3">
            @if($ready)
                <div class="alert alert-success py-2 px-3 mb-0 small d-flex align-items-center gap-2">
                    <span class="mdi mdi-check-circle" aria-hidden="true"></span>
                    Ready to generate the witness statement.
                </div>
            @else
                <ul class="list-unstyled mb-0 small">
                    @foreach($progress->blockers() as $blocker)
                        <li class="d-flex align-items-center gap-2 text-danger-emphasis">
                            <span class="mdi mdi-alert-circle-outline" aria-hidden="true"></span>
                            {{ $blocker['message'] }}
                        </li>
                    @endforeach
                </ul>
            @endif
        </div>
    @endunless
</div>