@extends('layouts.merchant')

@section('title', 'Отзывы — кабинет продавца')

@section('content')
<div class="flex flex-wrap items-center justify-between gap-3">
    <h1 class="text-2xl font-extrabold tracking-tight text-[var(--color-ink)]">Отзывы</h1>
    <div class="flex items-center gap-2 text-sm">
        <span class="inline-flex items-center gap-1 rounded-[var(--radius-sm)] bg-[#FFF6E5] px-2.5 py-1 font-bold text-[#B7761A]">
            <i data-lucide="star" class="h-3.5 w-3.5"></i>{{ number_format($seller->rating_avg, 1) }}
        </span>
        <span class="text-[var(--color-muted)]">{{ $seller->reviews_count }} отзывов</span>
    </div>
</div>
<p class="mt-1 text-sm text-[var(--color-slate)]">Отвечайте на отзывы покупателей — ответ публикуется после автоматической проверки.</p>

@if ($reviews->isEmpty())
    <div class="mt-6 rounded-[var(--radius-lg)] border border-dashed border-[var(--color-line)] bg-white p-10 text-center text-[var(--color-muted)]">
        Пока нет отзывов о вашем магазине.
    </div>
@else
    <div class="mt-6 space-y-4">
        @foreach ($reviews as $review)
            <div class="rounded-[var(--radius-lg)] bg-white p-5 shadow-[var(--shadow-card)]">
                <div class="flex items-center justify-between">
                    <div class="flex items-center gap-1 text-[#B7761A]">
                        @for ($i = 1; $i <= 5; $i++)
                            <i data-lucide="star" class="h-4 w-4 {{ $i <= $review->rating ? 'fill-current' : 'text-[var(--color-line)]' }}"></i>
                        @endfor
                    </div>
                    <span class="text-xs text-[var(--color-muted)]">{{ $review->published_at?->format('d.m.Y') }}</span>
                </div>
                <div class="mt-1 text-sm font-bold text-[var(--color-ink)]">{{ $review->user?->displayName() ?? 'Покупатель' }}</div>
                @if ($review->text)
                    <p class="mt-1 text-[15px] leading-relaxed text-[var(--color-slate)]">{{ $review->text }}</p>
                @endif

                {{-- Published reply --}}
                @if ($review->seller_reply)
                    <div class="mt-4 rounded-[var(--radius-md)] border-l-[3px] border-[var(--color-primary)] bg-[var(--color-primary-soft)] p-3">
                        <div class="text-xs font-bold text-[var(--color-primary)]">Ваш ответ · опубликован</div>
                        <p class="mt-1 text-sm text-[var(--color-ink)]">{{ $review->seller_reply }}</p>
                    </div>
                @endif

                {{-- Moderation status of an edited/new reply --}}
                @if ($review->replyPending())
                    <div class="mt-3 flex items-center gap-2 rounded-[var(--radius-md)] bg-[#FFF6E5] px-3 py-2 text-sm font-semibold text-[#B7761A]">
                        <i data-lucide="clock" class="h-4 w-4"></i> Ответ на модерации — появится после проверки.
                    </div>
                @elseif ($review->replyRejected())
                    <div class="mt-3 flex items-center gap-2 rounded-[var(--radius-md)] bg-[#FDECEE] px-3 py-2 text-sm font-semibold text-[var(--color-sale)]">
                        <i data-lucide="alert-triangle" class="h-4 w-4"></i> Ответ отклонён модерацией (грубость/контакты/реклама). Измените текст и отправьте снова.
                    </div>
                @endif

                {{-- Reply editor --}}
                <form method="POST" action="{{ route('merchant.reviews.reply', $review) }}" class="mt-3">
                    @csrf
                    <textarea name="reply" rows="3" maxlength="2000"
                              placeholder="Напишите вежливый ответ покупателю…"
                              class="w-full rounded-[var(--radius-md)] border-[1.5px] border-[#E1E4EA] bg-white px-4 py-2.5 text-sm outline-none focus:border-[var(--color-primary)]">{{ $review->seller_reply_pending ?: $review->seller_reply }}</textarea>
                    <div class="mt-2 flex items-center gap-3">
                        <button class="rounded-[var(--radius-md)] bg-[var(--color-primary)] px-5 py-2.5 text-sm font-bold text-white hover:bg-[var(--color-primary-dark)]">
                            {{ $review->seller_reply || $review->seller_reply_pending ? 'Обновить ответ' : 'Ответить' }}
                        </button>
                        @if ($review->seller_reply || $review->seller_reply_pending)
                            <span class="text-xs text-[var(--color-muted)]">Очистите поле и сохраните, чтобы удалить ответ.</span>
                        @endif
                    </div>
                </form>
            </div>
        @endforeach
    </div>
    <div class="mt-6">{{ $reviews->links() }}</div>
@endif
@endsection