@extends('layouts.messaging')
@section('title', $profileUser->name)

@section('content')
<div class="container py-4" style="max-width:520px">
  <div class="card shadow-sm text-center">
    <div class="card-body py-4">
      @if ($profileUser->avatarUrl())
        <img src="{{ $profileUser->avatarUrl() }}" alt="{{ $profileUser->name }}" style="width:96px;height:96px;border-radius:50%;object-fit:cover;">
      @else
        <div class="mx-auto" style="width:96px;height:96px;border-radius:50%;background:#6c757d;color:#fff;display:flex;align-items:center;justify-content:center;font-size:2.2rem;">
          {{ mb_substr($profileUser->name, 0, 1) }}
        </div>
      @endif
      <h5 class="mt-3 mb-1">{{ $profileUser->name }}</h5>
      @if ($profileUser->role)
        <div class="text-muted small">{{ $profileUser->role->name }}</div>
      @endif
      @if ($profileUser->id !== auth()->id())
        <a href="{{ route('messaging.index') }}" class="btn btn-primary btn-sm mt-3"><i class="bi bi-chat-dots me-1"></i>前往訊息</a>
      @endif
    </div>
  </div>
</div>
@endsection