@extends('layouts.app')
@section('title', $survey->title)
@section('content')
<div class="page-header">
    <div>
        <h1 class="page-title">{{ $survey->title }}</h1>
        <p class="page-subtitle">{{ $survey->responses->count() }} استجابة</p>
    </div>
    <div class="page-actions">
        @if($survey->status === 'active')
        <a href="{{ route('surveys.respond', $survey) }}" class="btn btn-primary"><i class="fa-solid fa-pen"></i> المشاركة</a>
        @endif
    </div>
</div>

<div class="stats-grid cols-3">
    <div class="stat-card">
        <div class="stat-icon" style="background:var(--primary-light);color:var(--primary)"><i class="fa-solid fa-users"></i></div>
        <div class="stat-value">{{ $survey->responses->count() }}</div>
        <div class="stat-label">عدد الاستجابات</div>
    </div>
    <div class="stat-card">
        <div class="stat-icon" style="background:#e8f5e9;color:#388e3c"><i class="fa-solid fa-list-check"></i></div>
        <div class="stat-value">{{ $survey->questions->count() }}</div>
        <div class="stat-label">عدد الأسئلة</div>
    </div>
    <div class="stat-card">
        <div class="stat-icon" style="background:#fff3e0;color:#f57c00"><i class="fa-solid fa-star"></i></div>
        <div class="stat-value">
            @php
            $allRatings = $survey->questions->filter(fn($q) => in_array($q->question_type, ['rating','scale']))->flatMap(fn($q) => $q->answers->pluck('answer_rating'))->filter();
            @endphp
            {{ number_format($allRatings->avg() ?? 0, 1) }}
        </div>
        <div class="stat-label">متوسط التقييم العام</div>
    </div>
</div>

@foreach($survey->questions as $q)
<div class="card">
    <div class="card-header">
        <h3>{{ $q->sort_order }}. {{ $q->question_text }}</h3>
        <span class="status-badge status-draft">
            @php $ql = ['rating'=>'تقييم','scale'=>'مقياس','text'=>'نص','yes_no'=>'نعم/لا','multiple_choice'=>'اختيار متعدد']; @endphp
            {{ $ql[$q->question_type] ?? $q->question_type }}
        </span>
    </div>
    <div class="card-body">
        @if(in_array($q->question_type, ['rating','scale']))
            @php $qStats = $stats[$q->id] ?? ['avg'=>0,'count'=>0,'distribution'=>[]]; @endphp
            <div style="display:flex;align-items:center;gap:20px;margin-bottom:15px">
                <div style="font-size:36px;font-weight:700;color:var(--primary)">{{ number_format($qStats['avg'], 1) }}</div>
                <div style="color:var(--text-muted)">من {{ $q->question_type === 'rating' ? '5' : '10' }} — {{ $qStats['count'] }} إجابة</div>
            </div>
            <div style="display:flex;gap:8px;align-items:flex-end;height:100px">
                @php $max = max($qStats['distribution'] ?: [1]); @endphp
                @for($r = 1; $r <= ($q->question_type === 'rating' ? 5 : 10); $r++)
                @php $cnt = $qStats['distribution'][$r] ?? 0; $pct = $max > 0 ? ($cnt / $max * 100) : 0; @endphp
                <div style="flex:1;text-align:center">
                    <div style="background:var(--primary);border-radius:4px 4px 0 0;height:{{ max($pct, 5) }}px;margin-bottom:4px"></div>
                    <div style="font-size:12px;font-weight:600">{{ $r }}</div>
                    <div style="font-size:11px;color:var(--text-muted)">{{ $cnt }}</div>
                </div>
                @endfor
            </div>
        @elseif($q->question_type === 'yes_no')
            @php $qs = $stats[$q->id] ?? ['yes'=>0,'no'=>0]; $total = $qs['yes'] + $qs['no']; @endphp
            <div style="display:flex;gap:20px">
                <div style="flex:1;text-align:center;padding:15px;background:#e8f5e9;border-radius:var(--radius)">
                    <div style="font-size:28px;font-weight:700;color:#388e3c">{{ $qs['yes'] }}</div>
                    <div>نعم ({{ $total > 0 ? round($qs['yes']/$total*100) : 0 }}%)</div>
                </div>
                <div style="flex:1;text-align:center;padding:15px;background:#fce4ec;border-radius:var(--radius)">
                    <div style="font-size:28px;font-weight:700;color:#d32f2f">{{ $qs['no'] }}</div>
                    <div>لا ({{ $total > 0 ? round($qs['no']/$total*100) : 0 }}%)</div>
                </div>
            </div>
        @elseif($q->question_type === 'text')
            @foreach($q->answers->take(10) as $ans)
            @if($ans->answer_text)
            <div style="padding:10px 15px;background:var(--bg);border-radius:var(--radius);margin-bottom:8px;border-right:3px solid var(--primary)">
                {{ $ans->answer_text }}
            </div>
            @endif
            @endforeach
        @endif
    </div>
</div>
@endforeach
@endsection