@extends('admin.layouts.app')
@section('title', 'Edit Poll')
@section('page-title', '📊 Edit Poll')

@section('content')
<div class="max-w-2xl space-y-6">

    {{-- ── POLL INFO ────────────────────────────────────────────── --}}
    <div class="bg-white rounded-2xl border border-gray-200 shadow-sm p-6">
        <h2 class="font-bold text-gray-800 mb-1 text-base">Poll Details</h2>
        <p class="text-sm text-gray-500 mb-5">Question and options cannot be changed after creation to preserve data integrity.</p>

        <div class="space-y-3">
            <div class="bg-gray-50 rounded-xl p-4">
                <p class="text-xs font-semibold text-gray-500 uppercase tracking-wider mb-1">Question</p>
                <p class="text-gray-800 font-semibold">{{ $poll->question }}</p>
            </div>

            <div class="bg-gray-50 rounded-xl p-4">
                <p class="text-xs font-semibold text-gray-500 uppercase tracking-wider mb-2">Options</p>
                <div class="space-y-1.5">
                    @foreach($poll->options as $i => $option)
                    <div class="flex items-center justify-between text-sm">
                        <span class="text-gray-700">{{ $i + 1 }}. {{ $option }}</span>
                        <span class="font-bold text-wc-green">{{ $mergedVotes[$i] ?? 0 }} votes</span>
                    </div>
                    @endforeach
                </div>
                <p class="text-xs text-gray-400 mt-3">
                    Total: {{ array_sum($mergedVotes) }} votes
                    (real + boosted)
                </p>
            </div>

            {{-- Status toggle --}}
            <form method="POST" action="{{ route('admin.polls.toggle', $poll->id) }}">
                @csrf @method('PATCH')
                <button type="submit"
                        class="w-full py-2.5 rounded-xl text-sm font-bold transition-colors
                               {{ $poll->is_active
                                   ? 'bg-gray-100 text-gray-700 hover:bg-gray-200'
                                   : 'bg-green-100 text-green-700 hover:bg-green-200' }}">
                    {{ $poll->is_active ? '⏸ Deactivate Poll' : '▶ Activate Poll' }}
                </button>
            </form>
        </div>
    </div>

    {{-- ── MANUAL VOTE BOOST ───────────────────────────────────── --}}
    <div class="bg-white rounded-2xl border border-wc-gold/30 shadow-sm p-6">
        <div class="flex items-start gap-3 mb-5">
            <span class="text-2xl">🚀</span>
            <div>
                <h2 class="font-bold text-gray-800 text-base">Boost Vote Counts</h2>
                <p class="text-sm text-gray-500 mt-0.5">
                    Set how many <strong>extra</strong> votes each option shows to users.
                    These are added on top of real votes — real data stays clean.
                </p>
            </div>
        </div>

        <form method="POST" action="{{ route('admin.polls.manual-votes', $poll->id) }}" class="space-y-4">
            @csrf

            @foreach($poll->options as $i => $option)
            <div class="flex items-center gap-4">
                <div class="flex-1">
                    <label class="block text-sm font-semibold text-gray-700 mb-1">
                        {{ $option }}
                    </label>
                    {{-- Progress bar showing current boosted % --}}
                    @php
                        $total   = array_sum($mergedVotes) ?: 1;
                        $pct     = round(($mergedVotes[$i] ?? 0) / $total * 100);
                    @endphp
                    <div class="w-full bg-gray-100 rounded-full h-1.5 mb-2">
                        <div class="bg-wc-green h-1.5 rounded-full transition-all"
                             style="width: {{ $pct }}%"></div>
                    </div>
                </div>
                <div class="w-32">
                    <input type="number" name="manual_votes[]"
                           value="{{ $poll->manual_votes[$i] ?? 0 }}"
                           min="0" max="999999"
                           class="w-full rounded-xl border border-gray-300 px-3 py-2 text-sm text-center font-bold
                                  focus:ring-2 focus:ring-wc-green focus:border-transparent">
                    <p class="text-xs text-center text-gray-400 mt-1">boost votes</p>
                </div>
            </div>
            @endforeach

            <button type="submit"
                    class="w-full bg-wc-gold hover:bg-yellow-500 text-white font-bold py-3 rounded-xl transition-colors text-sm">
                💾 Save Boost Votes
            </button>
        </form>
    </div>

    {{-- ── RESET REAL VOTES ────────────────────────────────────── --}}
    <div class="bg-white rounded-2xl border border-red-200 shadow-sm p-6">
        <div class="flex items-start gap-3 mb-4">
            <span class="text-2xl">🗑️</span>
            <div>
                <h2 class="font-bold text-red-700 text-base">Reset Real Votes</h2>
                <p class="text-sm text-gray-500 mt-0.5">
                    Permanently deletes all user votes from the database for this poll.
                    Your manual boost votes above are <strong>not</strong> affected.
                </p>
            </div>
        </div>

        <form method="POST" action="{{ route('admin.polls.reset-votes', $poll->id) }}"
              onsubmit="confirmDelete(event, this)">
            @csrf
            <button type="submit"
                    class="w-full bg-red-500 hover:bg-red-600 text-white font-bold py-3 rounded-xl transition-colors text-sm">
                🔄 Reset All Real Votes ({{ $poll->votes()->count() }} votes)
            </button>
        </form>
    </div>

    <a href="{{ route('admin.polls.index') }}"
       class="block text-center text-gray-500 hover:text-gray-700 text-sm font-semibold py-2">
        ← Back to Polls
    </a>
</div>
@endsection
