@if ($activeConversation)
    @php
        $listing = $activeConversation->listing;
    @endphp
    <div class="messages-inbox__thread">
        <div class="messages-inbox__thread-header">
            <a href="{{ route('user.messages.index') }}" class="messages-inbox__back d-lg-none" aria-label="{{ __('translate.Back to messages') }}">
                <i class="fas fa-arrow-left" aria-hidden="true"></i>
            </a>
            @if ($listing)
                <div class="messages-inbox__thread-header-main">
                    @include('usermessaging::user.partials.inbox-listing-card', ['listing' => $listing])
                </div>
            @endif
        </div>

        <div class="messages-inbox__thread-messages" id="messages_thread_scroll">
            @foreach ($messages as $message)
                @php $isMine = (int) $message->sender_id === (int) $currentUserId; @endphp
                <div class="messages-inbox__bubble-row {{ $isMine ? 'messages-inbox__bubble-row--mine' : 'messages-inbox__bubble-row--theirs' }}">
                    <div class="messages-inbox__bubble">
                        <p class="messages-inbox__bubble-text">{!! conversation_message_display($message->body) !!}</p>
                        <time class="messages-inbox__bubble-time" datetime="{{ $message->created_at->toIso8601String() }}">
                            {{ $message->created_at->format('d.m.Y H:i') }}
                        </time>
                    </div>
                </div>
            @endforeach
        </div>

        <div class="messages-inbox__composer">
            <form action="{{ route('user.messages.reply', $activeConversation->id) }}" method="POST" class="messages-inbox__composer-form">
                @csrf
                <textarea
                    name="message"
                    class="messages-inbox__composer-input form-control"
                    rows="2"
                    placeholder="{{ __('translate.Type Message') }}"
                    required>{{ old('message') }}</textarea>
                <button type="submit" class="messages-inbox__composer-send main-btn" title="{{ __('translate.Send Message') }}">
                    <i class="fas fa-paper-plane" aria-hidden="true"></i>
                </button>
            </form>
        </div>
    </div>
@else
    <div class="messages-inbox__placeholder">
        <div class="messages-inbox__placeholder-inner">
            <i class="fas fa-comments messages-inbox__placeholder-icon" aria-hidden="true"></i>
            <h3>{{ __('translate.Select a conversation') }}</h3>
            <p>{{ __('translate.Select a conversation hint') }}</p>
        </div>
    </div>
@endif