@extends('layouts.user')
@section('title', 'Ticket ' . $ticket->ticket_no)

@section('content')
<div class="page-hdr">
  <h1 class="page-hdr__title">{{ $ticket->ticket_no }} - {{ $ticket->subject }}</h1>
</div>

<div class="card mb-4">
  <div class="card__body">
    <div style="display:flex;gap:10px;flex-wrap:wrap;">
      <span class="badge">{{ strtoupper($ticket->status) }}</span>
      <span class="badge">{{ strtoupper($ticket->priority) }}</span>
      @if($ticket->rating)
      <span class="badge">Rated: {{ $ticket->rating }}/5</span>
      @endif
    </div>
  </div>
</div>

<div class="card mb-4">
  <div class="card__head">
    <div>
      <div class="card__title">Conversation</div>
      <div class="card__sub">Replies from you and support team</div>
    </div>
  </div>
  <div class="card__body">
    <div style="display:grid;gap:12px;">
      @foreach($ticket->messages as $msg)
      <div style="padding:12px;border:1px solid var(--border);border-radius:10px;background:{{ $msg->is_admin ? '#eef6ff' : '#fff' }};">
        <div style="font-size:12px;color:var(--muted);margin-bottom:6px;">
          {{ $msg->is_admin ? 'Support Team' : 'You' }} • {{ $msg->created_at?->format('Y-m-d H:i:s') }}
        </div>
        <div style="white-space:pre-wrap;">{{ $msg->message }}</div>
        @if($msg->hasAttachment())
        <div style="margin-top:8px;">
          <a href="{{ route('dashboard.tickets.messages.attachment', $msg) }}" class="btn btn--sm btn--outline">Attachment: {{ $msg->attachment_name }}</a>
        </div>
        @endif
      </div>
      @endforeach
    </div>
  </div>
</div>

@if(!$ticket->isResolved())
<div class="card mb-4">
  <div class="card__head">
    <div><div class="card__title">Reply</div><div class="card__sub">Send follow-up message</div></div>
  </div>
  <div class="card__body">
    <form method="POST" action="{{ route('dashboard.tickets.reply', $ticket) }}" enctype="multipart/form-data" style="display:grid;gap:12px;">
      @csrf
      <textarea name="message" class="form-control" rows="4" placeholder="Type your reply"></textarea>
      <input type="file" name="attachment" class="form-control" accept=".jpg,.jpeg,.png,.gif,.webp,.pdf,.doc,.docx,.txt,.zip">
      <div><button class="btn btn--primary" type="submit">Send Reply</button></div>
    </form>
  </div>
</div>
@else
  @if(!$ticket->rating)
  <div class="card mb-4">
    <div class="card__head">
      <div><div class="card__title">Rate Support</div><div class="card__sub">Ticket is resolved. Rate this experience.</div></div>
    </div>
    <div class="card__body">
      <form method="POST" action="{{ route('dashboard.tickets.rate', $ticket) }}" style="display:grid;gap:12px;">
        @csrf
        <select class="form-control" name="rating" required>
          <option value="">Select rating</option>
          <option value="5">5 - Excellent</option>
          <option value="4">4 - Good</option>
          <option value="3">3 - Fair</option>
          <option value="2">2 - Poor</option>
          <option value="1">1 - Very Poor</option>
        </select>
        <textarea class="form-control" name="rating_comment" rows="3" placeholder="Optional feedback"></textarea>
        <div><button class="btn btn--primary" type="submit">Submit Rating</button></div>
      </form>
    </div>
  </div>
  @else
  <div class="card">
    <div class="card__body">This ticket is closed after rating. New reply will open a new ticket automatically.</div>
  </div>
  @endif
@endif
@endsection