@extends('layouts.app')
@section('title', $review->t('title').($review->shop? '｜'.__(':shop の口コミ', ['shop'=>$review->shop->t('name')]) : '').'｜'.config('app.name'))

@section('content')
<div class="crumb"><a href="{{ route('home') }}">{{ __('ホーム') }}</a> @if($review->shop)＞ <a href="{{ route('shops.show',$review->shop_id) }}">{{ $review->shop->t('name') }}</a> @endif{{ __('＞ 口コミ詳細') }}</div>
<div class="l-cols">
  <div class="l-main">
    <section class="sec">
      <div class="sec-hd"><h2 class="ic-star">{{ __('口コミ詳細') }}</h2></div>

      @if($review->shop)
      <a href="{{ route('shops.show',$review->shop_id) }}" class="card card-pad row" style="text-decoration:none;color:inherit;gap:12px;margin-bottom:14px;">
        <div style="flex:1;">
          <div style="font-weight:900;">{{ $review->shop->t('name') }}</div>
          <div class="small muted">{{ $review->shop->t('pref') }}・{{ $review->shop->t('city') }}</div>
        </div><div class="small">›</div>
      </a>
      @endif

      <div class="card card-pad">
        <div class="row" style="gap:10px;flex-wrap:wrap;">
          <span class="stars lg" style="--rate:{{ $review->rating }}"></span>
          <span class="score" style="font-size:20px;">{{ number_format($review->rating,1) }}</span>
        </div>
        <h1 style="margin:10px 0 4px;font-size:20px;">{{ $review->t('title') }}</h1>
        <div class="small muted">{{ __('投稿者:') }} {{ __(':name さん', ['name'=>$review->displayName()]) }}</div>
        <div class="hr"></div>
        <p style="white-space:pre-wrap;margin:0;">{{ $review->t('body') }}</p>
        @if($review->reply && $review->reply->status==='published')
        <div class="card card-pad" style="margin-top:12px;background:var(--brand-pale);">
          <div class="small" style="font-weight:800;">{{ __('店舗からの返信') }}</div>
          <div style="white-space:pre-wrap;">{{ $review->reply->body }}</div>
        </div>
        @endif
        <div class="hr"></div>
        <form method="post" action="{{ route('reviews.helpful',$review->id) }}" style="text-align:center;">@csrf
          <button class="helpful-btn" type="submit">
            <span>👍</span><span>{{ __('参考になった') }}</span>
            <span style="font-weight:900;color:var(--ink);">{{ $review->helpful_count }}</span>
          </button>
        </form>
      </div>

      @if($others->count())
      <div class="sec-hd" style="margin-top:24px;"><h2 class="ic-review">{{ __('この店舗の他の口コミ') }}</h2></div>
      <div class="grid-list">
        @foreach($others as $o)
        <a href="{{ route('reviews.show',$o->id) }}" class="review">
          <header><span class="who">{{ __(':name さん', ['name'=>$o->displayName()]) }}</span><span class="stars" style="--rate:{{ $o->rating }}"></span></header>
          <div class="ttl">{{ $o->t('title') }}</div>
          <div class="cmt small">{{ \Illuminate\Support\Str::limit($o->t('body'),60) }}</div>
          @if($o->reply && $o->reply->status==='published')
          <div class="small" style="margin-top:6px;color:var(--ink-2);"><b>{{ __('店舗からの返信') }}</b> {{ \Illuminate\Support\Str::limit($o->reply->body,50) }}</div>
          @endif
        </a>
        @endforeach
      </div>
      @endif
    </section>
  </div>
  <aside class="l-side">
    <div class="sw"><div class="sw__hd">{{ __('この店舗に口コミ') }}</div>
      <div class="sw__bd">
        <a href="{{ route('reviews.create',$review->shop_id) }}" class="btn primary block">{{ __('★ 口コミを投稿する') }}</a>
        <a href="{{ route('shops.show',$review->shop_id) }}" class="btn ghost block" style="margin-top:8px;">{{ __('店舗ページへ') }}</a>
      </div>
    </div>
  </aside>
</div>
@endsection