@php
    /** @var \Illuminate\Pagination\LengthAwarePaginator $mensagens */
    /** @var int $unreadCount */
    $pageTitle = 'Caixa de Entrada — Fale Conosco';
    $searchTerm = request()->input('search', '');
    $unreadFilter = request()->input('unread', '');
@endphp

@extends('v2-cms::layouts.app', [
    'title'    => $pageTitle,
])

@section('page-breadcrumbs')
    @include('v2-cms::partials.breadcrumb', ['items' => [
        ['label' => 'Institucional'],
        ['label' => 'Fale Conosco'],
    ]])
@endsection

@section('content')

    <p class="text-muted mb-3">
        Gerencie as mensagens recebidas pelo Fale Conosco.
        Total: <strong>{{ $mensagens->total() }}</strong> registro(s).
        @if($unreadCount > 0)
            <span class="badge bg-warning text-dark ms-2">
                <i class="bi bi-envelope-open me-1" aria-hidden="true"></i>
                {{ $unreadCount }} não lida(s)
            </span>
        @endif
    </p>

    @component('v2-cms::partials.filter-card', [
        'searchPlaceholder' => 'Buscar por nome, email ou assunto...',
        'searchValue'       => $searchTerm,
        'action'            => route('v2.fale-conosco.cms.inbox'),
        'showDateRange'     => false,
    ])
        <div class="col-md-3 d-flex align-items-end">
            <div class="form-check">
                <input type="checkbox" id="unread" name="unread" class="form-check-input" value="1"
                       {{ $unreadFilter ? 'checked' : '' }}>
                <label class="form-check-label" for="unread">Apenas não lidas</label>
            </div>
        </div>
    @endcomponent

    @if($mensagens->count() > 0)
        <div class="table-responsive">
            <table class="table table-hover align-middle" aria-label="Mensagens">
                <thead class="table-light">
                    <tr>
                        <th scope="col" style="width: 40px;">Status</th>
                        <th scope="col">Nome / Email</th>
                        <th scope="col">Assunto</th>
                        <th scope="col">Data</th>
                        <th scope="col" style="width: 120px;">Ações</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($mensagens as $mensagem)
                        <tr class="{{ $mensagem->is_read ? '' : 'fw-bold' }}">
                            <td>
                                @if($mensagem->is_read)
                                    <span class="badge bg-secondary rounded-pill" title="Lida">
                                        <i class="bi bi-envelope-open" aria-hidden="true"></i>
                                    </span>
                                @else
                                    <span class="badge bg-primary rounded-pill" title="Não lida">
                                        <i class="bi bi-envelope" aria-hidden="true"></i>
                                    </span>
                                @endif
                            </td>
                            <td>
                                <div>{{ $mensagem->name }}</div>
                                <div class="small text-muted">{{ $mensagem->email }}</div>
                            </td>
                            <td>
                                <span class="text-truncate d-inline-block" style="max-width: 250px;">
                                    {{ $mensagem->subject }}
                                </span>
                            </td>
                            <td>
                                <span class="small text-nowrap">
                                    {{ $mensagem->created_at->format('d/m/Y H:i') }}
                                </span>
                            </td>
                            <td>
                                <div class="d-flex gap-1">
                                    <a href="{{ route('v2.fale-conosco.cms.show', ['id' => $mensagem->id]) }}"
                                       class="btn btn-sm btn-outline-primary" title="Visualizar">
                                        <i class="bi bi-eye" aria-hidden="true"></i>
                                    </a>
                                    <form action="{{ route('v2.fale-conosco.cms.archive', ['id' => $mensagem->id]) }}"
                                          method="POST" class="d-inline"
                                          onsubmit="return confirm('Arquivar esta mensagem?')">
                                        {{ csrf_field() }}
                                        <button type="submit" class="btn btn-sm btn-outline-secondary"
                                                title="Arquivar">
                                            <i class="bi bi-archive" aria-hidden="true"></i>
                                        </button>
                                    </form>
                                </div>
                            </td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>

        @if($mensagens->hasPages())
        <div class="d-flex justify-content-center mt-4">
            {{ $mensagens->appends(request()->except('page'))->links('v2-cms::partials.pagination') }}
        </div>
        @endif
    @else
        <div class="text-center py-5">
            <i class="bi bi-envelope-open" style="font-size: 3rem; color: var(--bs-secondary-color);" aria-hidden="true"></i>
            <h2 class="h5 mt-3 text-muted">Nenhuma mensagem encontrada</h2>
            <p class="text-muted">Nenhuma mensagem na caixa de entrada.</p>
        </div>
    @endif

@endsection