@extends('layouts.app')

@section('content')
<div class="container">
    <div class="card p-2 shadow-sm border-0 mb-3" style="border-radius: 15px;">
        <h5 class="mb-3 text-success">Jawapan Responden</h5>
        
        <div class="row">
            <div class="col-md-4">
                <small class="text-muted d-block">Nama</small>
                <strong>{{ $response->respondent_name ?? '-' }}</strong>
            </div>

            <div class="col-md-4 border-start border-end">
                <small class="text-muted d-block">No. Pekerja</small>
                <strong>{{ $response->respondent_no_pekerja ?? '-' }}</strong>
            </div>

            <div class="col-md-4">
                <small class="text-muted d-block">Jabatan</small>
                <strong>{{ $response->respondent_jabatan ?? '-' }}</strong>
            </div>
        </div>
    </div>

    <div class="mt-2 px-2">
        <p class="mb-0">
            <span class="fw-bold text-primary">{{ $response->survey->title }}</span>
        </p>
    </div>

    <hr>

    @foreach($response->answers as $answer)
        <div class="mb-3">
            <strong>{{ $answer->question->question_text }}</strong>
            <p>{{ $answer->answer_text }}</p>
        </div>
    @endforeach
</div>
@endsection