<div>
    <div class="row mb-4 align-items-center">
        <div class="col-md-8">
            <h2 class="fw-bold mb-0">
                <i class="bi bi-shield-lock text-primary me-2"></i>
                Subject Access Request
                <span class="badge bg-primary-subtle text-primary badge-status me-2">{{ ucwords($dsar->status) }}</span>
            </h2>
            <p class="text-muted mt-1">
                Submitted to: <span class="fw-semibold text-dark">{{ $institution->display_name }}</span>
            </p>
        </div>
        <div class="col-md-4 text-md-end d-flex align-items-center justify-content-end gap-2">
            @can('dsars.batch.send')
                <select class="form-select form-select-sm w-auto"
                        wire:change="updateStatus($event.target.value)">
                    @foreach(\App\Enum\Dsar\DsarStatus::manuallySelectable() as $s)
                        <option value="{{ $s }}" @selected($dsar->status === $s)>{{ \App\Enum\Dsar\DsarStatus::label($s) }}</option>
                    @endforeach
                </select>
            @else
                <span class="badge bg-primary-subtle text-primary badge-status">{{ ucwords($dsar->status) }}</span>
            @endcan

            @can('delete', $dsar)
                <button class="btn btn-outline-danger btn-sm"
                        wire:click="deleteDsar"
                        wire:confirm="Permanently delete this DSAR? This cannot be undone.">
                    <i class="bi bi-trash"></i>
                </button>
            @endcan
        </div>
    </div>

    <div class="row">
        <!-- Left Sidebar: Client Details & History -->
        <div class="col-lg-3">
            <x-client.client-card :client="$dsar->claim->client"/>
            <livewire:history :owner="$dsar"/>
        </div>

        <!-- Middle Column: Request Details & Documents -->
        <div class="col-lg-6">
            <div class="card">
                <div class="card-body">
                    <h4 class="fw-bold">Request Details</h4>
                    <div class="row g-3">
                        <div class="col-sm-6">
                            <span class="label-upper">Date Sent</span>
                            <p class="mb-0 fw-medium">{{ $dsar->created_at->format('d M Y') }}</p>
                        </div>
                        <div class="col-sm-6">
                            <span class="label-upper">Response Deadline</span>
                            <p class="mb-0 fw-medium {{ $dsar->created_at->addDays(30)->isPast() && $dsar->status !== 'completed' ? 'text-danger fw-bold' : '' }}">
                                {{ $dsar->created_at->addDays(30)->format('d M Y') }}
                            </p>
                        </div>

                        <div class="col-sm-6">
                            <span class="label-upper">Due Date</span>
                            @can('dsars.batch.send')
                                <input type="date"
                                       class="form-control form-control-sm"
                                       value="{{ $dsar->expected_at?->format('Y-m-d') }}"
                                       wire:change="updateDueDate($event.target.value)">
                            @else
                                <p class="mb-0 fw-medium">{{ $dsar->expected_at?->format('d M Y') ?? '—' }}</p>
                            @endcan
                        </div>

                        @if($dsar->reference)
                        <div class="col-sm-6">
                            <span class="label-upper">Our Reference</span>
                            <p class="mb-0 fw-medium font-monospace">{{ $dsar->reference }}</p>
                        </div>
                        @endif
                        @if($dsar->receiver_reference)
                        <div class="col-sm-6">
                            <span class="label-upper">Their Reference</span>
                            <p class="mb-0 fw-medium font-monospace">{{ $dsar->receiver_reference }}</p>
                        </div>
                        @endif

                        {{-- Posted date --}}
                        @if($dsar->posted_at)
                            <div class="col-sm-6">
                                <span class="label-upper">Posted On</span>
                                <p class="mb-0 fw-medium">{{ $dsar->posted_at->format('d M Y') }}</p>
                            </div>
                        @endif

                        {{-- Sent To --}}
                        @if($emailSend)
                            @php
                                $sentToName  = $emailSend->recipient_name ?? null;
                                $sentToEmail = $emailSend->recipient_email ?? null;
                            @endphp
                            <div class="col-12">
                                <span class="label-upper">Sent To</span>
                                <p class="mb-0">
                                    @if($sentToName)
                                        <span class="fw-medium">{{ $sentToName }}</span>
                                        <span class="text-muted small ms-1">&lt;{{ $sentToEmail }}&gt;</span>
                                    @else
                                        <span class="fw-medium">{{ $sentToEmail }}</span>
                                    @endif
                                    <span class="badge bg-info-subtle text-info ms-2 small">Email</span>
                                </p>
                            </div>
                        @elseif(in_array($dsar->status, ['sent', 'needs posting', 'completed']))
                            <div class="col-12">
                                <span class="label-upper">Delivery Method</span>
                                <p class="mb-0">
                                    <span class="badge bg-secondary-subtle text-secondary">
                                        <i class="bi bi-envelope-paper me-1"></i>Posted
                                    </span>
                                </p>
                            </div>
                        @endif

                        <div class="col-12">
                            <span class="label-upper">Letter Content</span>
                            <div class="small bg-light p-2 rounded">{!! $dsar->content !!}</div>
                        </div>

                        @if($dsar->email_content)
                        <div class="col-12">
                            <span class="label-upper">Email Content</span>
                            <div class="small bg-light p-2 rounded">{!! $dsar->email_content !!}</div>
                        </div>
                        @endif
                    </div>
                </div>
            </div>

            <livewire:document-manager :owner="$dsar"/>

            <div class="card mt-3">
                <div class="card-body">
                    <livewire:contact.communication-timeline :model="$dsar" :include-inbound="true"/>
                </div>
            </div>
        </div>

        <div class="col-lg-3">
            <livewire:dsar.chase-logger :dsar="$dsar"/>
            <livewire:note-manager :owner="$dsar"/>
        </div>
    </div>
</div>
