@if($characters->isNotEmpty())
    <x-moonshine::table>
        @slot('thead')
            <th>№</th>
            <th>{{ __('panel/auth/char-info.main.0') }}</th>
            <th>{{ __('panel/auth/char-info.main.1') }}</th>
            <th>{{ __('panel/auth/char-info.main.2') }}</th>
            <th>{{ __('panel/auth/char-info.main.3') }}</th>
            <th>{{ __('panel/auth/char-info.main.4') }}</th>
            <th>{{ __('panel/auth/char-info.main.5') }}</th>
            <th>{{ __('panel/auth/char-info.main.6') }}</th>
            <th>{{ __('panel/auth/char-info.main.7') }}</th>
            <th>{{ __('panel/auth/char-info.main.9') }}</th>
        @endslot
        @slot('tbody')
            @foreach($characters as $character)
                <tr class="account-table">
                    <td>1</td>
                    <td class="flex items-center gap-2">
                        <img class="rounded-full w-10 h-10"
                             src="{{ showCharacterSex($character['sex'],$character['class_id']) }}" alt="88">
                        <div class="flex items-center gap-1">
                            <div class="flex items-center">
                                {!! showCrest($character['alliance_crest']) !!}
                                {!! showCrest($character['clan_crest']) !!}
                            </div>
                            {{ $character['name'] }}
                        </div>
                    </td>
                    <td>{{ $character['level'] }}</td>
                    <td>
                        @if($character['clan'])
                            <div class="flex items-center gap-1">
                                <div class="flex items-center">
                                    {!! showCrest($character['alliance_crest']) !!}
                                    {!! showCrest($character['clan_crest']) !!}
                                </div>
                                <a href="{{ strlen($character['clan'] ?? 0) > 1 ? route('clan.info', $character['clan']) : '#'  }}">
                                    {{ $character['clan'] }}
                                </a>
                            </div>
                        @else
                            -
                        @endif
                    </td>
                    <td>{{ $character['class'] ? Str::after($character['class'],'_') : '-' }}</td>
                    <td>{{ $character['pvp'] }}</td>
                    <td>{{ $character['pk'] }}</td>
                    <td>{{ formatTimeDifference($character['onlinetime'],$currentLang) }}</td>
                    <td>
                        @php($online = $character['isOnline'])
                        <x-moonshine.badge color="{{ $online ? '#347c0687' : '#9f3535' }}"/>
                    </td>
                    <td>
                        <x-moonshine.modal id="f-acc-char_tp" async
                                            :asyncUrl="route('async-teleport-character', ['char_name' => $character['name'], 'isOnline' => $online])" auto
                                            title="{{ __('panel/auth/char-info.main.10', ['char_name' => $character['name']]) }}">

                            <x-slot name="outerHtml">
                                <div
                                    @click.prevent="toggleModal; document.body.classList.add('overflow-hidden')"
                                    class="btn-start cursor-pointer justify-center" style="max-width: 200px">
                                    <x-moonshine::icon icon="heroicons.rocket-launch"/>
                                    <span>{{ __('panel/auth/char-info.main.9') }}</span>
                                </div>
                            </x-slot>

                        </x-moonshine.modal>
                    </td>
                </tr>
            @endforeach
        @endslot
    </x-moonshine::table>

@else
    <x-moonshine.error text="{{ __('panel/auth/char-info.main.11', ['account' => $account]) }}"/>
@endif