@php
    switch ($poll->poll_style) {
        case $poll->poll_style == 'primary':
            $themePoll = 'bg-primary-500';
            break;
        case $poll->poll_style == 'lime':
            $themePoll = 'bg-gradient-to-r from-lime-500 to-lime-600';
            break;
        case $poll->poll_style == 'purple':
            $themePoll = 'bg-gradient-to-br from-purple-600 to-blue-500';
            break;
    }
@endphp
<div class="rounded-lg border border-secondary-100 bg-secondary-50 p-2 dark:border-slate-950 dark:bg-slate-900">
    <div class="mb-2 text-lg font-bold sm:text-xl">{{ $poll->question }}</div>
    @auth
        @if (!auth()->user()->hasPollVoted($poll->id) && $poll->poll_ends >= now())
            @foreach ($choices as $choice)
                <div class="mb-2">
                    <x-button full primary shadowless wire:click="castVote({{ $choice->id }})" outline>
                        {{ $choice->text }}
                    </x-button>
                </div>
            @endforeach
        @else
            @foreach ($choices as $choice)
                <div class="mb-3">
                    @if ($poll->votes->count())
                        <div class="mb-1 flex justify-between">
                            <span class="flex items-center gap-2 text-base font-medium text-slate-900 dark:text-white">
                                <span>{{ $choice->text }}</span>
                                @if (auth()->user()->isChosenByUser(getCurrentUser()->id, $choice->id))
                                    <x-icons.check class="text-bold h-4 shrink-0 text-primary-500" />
                                @endif
                            </span>
                            <span
                                class="text-sm font-medium text-slate-900 dark:text-white">{{ round(($choice->votes->count() / $poll->votes->count()) * 100, 2) . '%' }}</span>
                        </div>
                        <div class="h-2.5 w-full rounded-full bg-gray-200 dark:bg-gray-700">
                            <div class="{{ $themePoll }} h-2.5 rounded-full"
                                style="width: {{ round(($choice->votes->count() / $poll->votes->count()) * 100, 2) }}%;">
                            </div>
                        </div>
                    @endif
                </div>
            @endforeach
        @endif
    @else
        @if ($poll->poll_ends < \Carbon\Carbon::now())
            @foreach ($choices as $choice)
                <div class="mb-3">
                    @if ($poll->votes->count())
                        <div class="mb-1 flex justify-between">
                            <span class="flex items-center text-base font-medium text-slate-900 dark:text-white">
                                {{ $choice->text }}
                            </span>
                            <span
                                class="text-sm font-medium text-slate-900 dark:text-white">{{ round(($choice->votes->count() / $poll->votes->count()) * 100, 2) . '%' }}</span>
                        </div>
                        <div class="h-2.5 w-full rounded-full bg-gray-200 dark:bg-gray-700">
                            <div class="{{ $themePoll }} h-2.5 rounded-full"
                                style="width: {{ round(($choice->votes->count() / $poll->votes->count()) * 100, 2) }}%;">
                            </div>
                        </div>
                    @endif
                </div>
            @endforeach
        @else
            @foreach ($choices as $choice)
                <div class="mb-2">
                    <x-button full primary shadowless href="{{ route('login') }}" outline>{{ $choice->text }}</x-button>
                </div>
            @endforeach
        @endif

    @endauth

    <div class="flex flex-col gap-1 text-sm text-gray-500 dark:text-slate-400">
        @if ($poll->votes->count() > 0)
            <div class="flex items-center gap-1">
                <span>{{ __('Total votes') }}</span>
                <span>{{ $poll->votes()->count() }}</span>
            </div>
        @endif
        <div class="flex items-center">
            {{ $poll->displayHumanTimeLeft() }}
        </div>
    </div>
</div>