@php
    /** @var \V2\Modules\Institucional\FaleConosco\Models\MensagemContato $mensagem */
    $pageTitle = 'Mensagem: ' . $mensagem->subject;
@endphp

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

@section('page-breadcrumbs')
    <span class="current">Institucional</span>
    <span class="separator">›</span>
    <span class="current">Fale Conosco</span>
    <span class="separator">›</span>
    <span class="current">Detalhes</span>
@endsection

@section('content')

    <div class="d-flex justify-content-between align-items-center mb-3">
        <div></div>
        <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-outline-secondary">
                <i class="bi bi-archive me-1" aria-hidden="true"></i> Arquivar
            </button>
        </form>
    </div>

    <div class="card mb-4">
        <div class="card-header d-flex justify-content-between align-items-center">
            <h5 class="mb-0">
                <i class="bi bi-envelope me-2" aria-hidden="true"></i>
                {{ $mensagem->subject }}
            </h5>
            <span class="small text-muted">
                {{ $mensagem->created_at->format('d/m/Y H:i') }}
            </span>
        </div>
        <div class="card-body">
            <div class="row mb-4">
                <div class="col-md-6">
                    <strong>Nome:</strong>
                    <p class="mb-1">{{ $mensagem->name }}</p>
                </div>
                <div class="col-md-6">
                    <strong>Email:</strong>
                    <p class="mb-1">
                        <a href="mailto:{{ $mensagem->email }}">{{ $mensagem->email }}</a>
                    </p>
                </div>
                @if($mensagem->phone)
                <div class="col-md-6">
                    <strong>Telefone:</strong>
                    <p class="mb-1">{{ $mensagem->phone }}</p>
                </div>
                @endif
                @if($mensagem->ip_address)
                <div class="col-md-6">
                    <strong>IP:</strong>
                    <p class="mb-1 text-muted small">{{ $mensagem->ip_address }}</p>
                </div>
                @endif
            </div>

            <hr>

            <div class="mb-4">
                <strong>Mensagem:</strong>
                <div class="mt-2 p-3 bg-light rounded">
                    {{ nl2br(e($mensagem->message)) }}
                </div>
            </div>

            @if($mensagem->reply_body)
                <hr>
                <div class="mb-4">
                    <strong>Resposta enviada em:</strong>
                    <span class="text-muted small">
                        {{ $mensagem->replied_at ? $mensagem->replied_at->format('d/m/Y H:i') : '' }}
                    </span>
                    <div class="mt-2 p-3 bg-info bg-opacity-10 rounded border border-info">
                        {{ nl2br(e($mensagem->reply_body)) }}
                    </div>
                </div>
            @endif
        </div>
    </div>

    @if(empty($mensagem->reply_body))
        <div class="card">
            <div class="card-header">
                <h5 class="mb-0"><i class="bi bi-reply me-2" aria-hidden="true"></i>Responder</h5>
            </div>
            <div class="card-body">
                <form action="{{ route('v2.fale-conosco.cms.reply', ['id' => $mensagem->id]) }}" method="POST">
                    {{ csrf_field() }}
                    <div class="mb-3">
                        <label for="reply_body" class="form-label fw-semibold">Corpo da Resposta</label>
                        <textarea id="reply_body" name="reply_body"
                                  class="form-control" rows="8"
                                  placeholder="Digite sua resposta aqui..."
                                  required></textarea>
                        <div class="form-text">
                            A resposta será enviada por email para {{ $mensagem->email }}.
                        </div>
                    </div>
                    <button type="submit" class="btn btn-primary">
                        <i class="bi bi-send me-1" aria-hidden="true"></i> Enviar Resposta
                    </button>
                </form>
            </div>
        </div>
    @endif

@endsection