@php
    use App\Enums\IdentityStatusEnum;use App\Enums\PermissionEnum;use App\Enums\UserAppRoleEnum;
    use App\Enums\WalletTypeEnum;
@endphp
@extends('layouts.master')
@section('title', trans('admin.show_app_user'))

@section('vendor-style')
    <link rel="stylesheet" href="{{ asset('admin_assets/vendor/libs/datatables-bs5/datatables.bootstrap5.css') }}"/>
    <link rel="stylesheet"
          href="{{ asset('admin_assets/vendor/libs/datatables-responsive-bs5/responsive.bootstrap5.css') }}"/>
    <link rel="stylesheet" href="{{ asset('admin_assets/vendor/libs/select2/select2.css') }}"/>
    <link rel="stylesheet" href="{{ asset('admin_assets/vendor/libs/sweetalert2/sweetalert2.css') }}"/>
@endsection

@section('content')
    @include('layouts._breadcrumb', [
        'list' => [
            ['data' => trans('admin.dashboard'), 'url' => route('admin.landing')],
            ['data' => $user->role->value == 'client' ? trans('admin.clients_list') : trans('admin.providers_list'), 'url' => route('admin.app_user.index', ['role' => $user->role->value])],
            ['data' => trans('admin.show_app_user'), 'url' => null],
        ],
    ])

    <div class="row">
        <!-- User Sidebar -->
        <div class="col-xl-4 col-lg-5 col-md-5 order-1 order-md-0">
            <!-- User Card -->
            <div class="card mb-4">
                <div class="card-body">
                    <div class="user-avatar-section">
                        <div class="d-flex align-items-center flex-column">
                            <img class="img-fluid rounded mb-3 pt-1 mt-4"
                                 src="{{ $user->image ? asset('storage/' . $user->image) : asset('admin_assets/img/avatars/avatar.webp') }}"
                                 height="100" width="100" alt="User avatar"/>
                            <div class="user-info text-center">
                                <h4 class="mb-2">{{ $user->name }}</h4>
                                <span class="badge bg-label-secondary mt-1">{{ strtoupper($user->role->value) }}</span>
                            </div>
                        </div>
                    </div>
                    @if(\App\Services\UserPermissionService::can(PermissionEnum::NOTIFICATION_SEND))
                        <div class="d-grid gap-2 mt-4">
                            <button type="button" class="btn btn-label-primary"
                                    data-bs-toggle="modal" data-bs-target="#sendNotificationModal">
                                <i class="ti ti-bell me-1 ti-sm"></i>{{ trans('admin.send_notification') }}
                            </button>
                        </div>
                    @endif
                    <div class="d-flex justify-content-around flex-wrap my-4 py-3">
                        <div class="d-flex align-items-start me-4 mt-3 gap-3">
                            <span class="badge bg-label-primary p-2 rounded"><i class="ti ti-checkbox ti-sm"></i></span>
                            <div>
                                <h5 class="mb-0">{{ $orders->count() }}</h5>
                                <span>{{ trans('admin.orders') }}</span>
                            </div>
                        </div>
                        <div class="d-flex align-items-start mt-3 gap-3">
                            <span class="badge bg-label-primary p-2 rounded"><i class="ti ti-wallet ti-sm"></i></span>
                            <div>
                                <h5 class="mb-0"
                                    id="wallet-balance-display">{{ number_format($user->wallet->balance ?? 0, 2) }}</h5>
                                <span>{{ trans('admin.balance') }}</span>
                                @php
                                    $walletAdjustPermission = $user->role->value === 'client'
                                        ? PermissionEnum::CLIENT_WALLET_ADJUST
                                        : PermissionEnum::PROVIDER_WALLET_ADJUST;
                                @endphp
                                @if(\App\Services\UserPermissionService::can($walletAdjustPermission))
                                    <button type="button" class="btn btn-xs btn-label-primary mt-1"
                                            data-bs-toggle="modal" data-bs-target="#adjustWalletModal">
                                        <i class="ti ti-edit ti-xs me-1"></i>{{ trans('admin.edit') }}
                                    </button>
                                @endif
                            </div>
                        </div>
                    </div>
                    <p class="mt-4 small text-uppercase text-muted">{{ trans('admin.details') }}</p>
                    <div class="info-container">
                        <ul class="list-unstyled">
                            <li class="mb-2">
                                <span class="fw-medium me-1">{{ trans('admin.phone') }}:</span>
                                <span>{{ $user->phone }}</span>
                            </li>
                            <li class="mb-2">
                                <span class="fw-medium me-1">{{ trans('admin.email') }}:</span>
                                <span>{{ $user->email ?? trans('admin.na') }}</span>
                            </li>
                            <li class="mb-2">
                                <span class="fw-medium me-1">{{ trans('admin.notification_count') }}:</span>
                                <span class="badge bg-label-info">{{ $user->getPushNotificationCount() }}</span>
                            </li>
                            <li class="mb-2">
                                <span class="fw-medium me-1">{{ trans('admin.status') }}:</span>
                                <span class="badge bg-label-{{ $user->is_active ? 'success' : 'danger' }}">
                                    {{ $user->is_active ? trans('admin.active') : trans('admin.not_active') }}
                                </span>
                            </li>
                            <li class="mb-2">
                                <span class="fw-medium me-1">{{ trans('admin.iban') }}:</span>
                                <span>{{ $user->iban ?? trans('admin.na') }}</span>
                            </li>
                            <li class="mb-2">
                                <span class="fw-medium me-1">{{ trans('admin.identity_number') }}:</span>
                                <span>{{ $user->identity_number ?? trans('admin.na') }}</span>
                            </li>
                            <li class="mb-2">
                                <span class="fw-medium me-1">{{ trans('admin.address') }}:</span>
                                <span>{{ $user->address ?? trans('admin.na') }}</span>
                            </li>
                            <li class="mb-2">
                                <span class="fw-medium me-1">{{ trans('admin.identity_image_front') }}:</span>
                                @if($user->identity_image_front)
                                    <a href="{{ asset('storage/' . $user->identity_image_front) }}" target="_blank"
                                       class="badge bg-label-info">
                                        <i class="ti ti-eye me-1"></i>{{ trans('admin.show') }}
                                    </a>
                                @else
                                    <span>{{ trans('admin.na') }}</span>
                                @endif
                            </li>
                            <li class="mb-2">
                                <span class="fw-medium me-1">{{ trans('admin.identity_image_back') }}:</span>
                                @if($user->identity_image_back)
                                    <a href="{{ asset('storage/' . $user->identity_image_back) }}" target="_blank"
                                       class="badge bg-label-info">
                                        <i class="ti ti-eye me-1"></i>{{ trans('admin.show') }}
                                    </a>
                                @else
                                    <span>{{ trans('admin.na') }}</span>
                                @endif
                            </li>
                            <li class="mb-2">
                                <span class="fw-medium me-1">{{ trans('admin.sponsor_approval_letter') }}:</span>
                                @if($user->sponsor_approval_letter)
                                    <a href="{{ asset('storage/' . $user->sponsor_approval_letter) }}" target="_blank"
                                       class="badge bg-label-info">
                                        <i class="ti ti-eye me-1"></i>{{ trans('admin.show') }}
                                    </a>
                                @else
                                    <span>{{ trans('admin.na') }}</span>
                                @endif
                            </li>
                            <li class="mb-2">
                                <span class="fw-medium me-1">{{ trans('admin.bank_iban_certificate') }}:</span>
                                @if($user->bank_iban_certificate)
                                    <a href="{{ asset('storage/' . $user->bank_iban_certificate) }}" target="_blank"
                                       class="badge bg-label-info">
                                        <i class="ti ti-eye me-1"></i>{{ trans('admin.show') }}
                                    </a>
                                @else
                                    <span>{{ trans('admin.na') }}</span>
                                @endif
                            </li>
                            <li class="mb-2">
                                <span class="fw-medium me-1">{{ trans('admin.birth_date') }}:</span>
                                <span>{{ $user->birth_date?->format('Y-m-d') ?? trans('admin.na') }}</span>
                            </li>
                            <li class="mb-2">
                                <span class="fw-medium me-1">{{ trans('admin.gender') }}:</span>
                                <span>{{ $user->gender ? trans('admin.' . $user->gender) : trans('admin.na') }}</span>
                            </li>
                            <li class="mb-2 border-top pt-2">
                                <span class="fw-medium me-1">{{ trans('admin.nationality') }}:</span>
                                <span>{{ $user->nationality ? $user->nationality->name() : trans('admin.na') }}</span>
                            </li>
                            <li class="mb-2 border-top pt-2">
                                <span class="fw-medium me-1">{{ trans('admin.identity_status') }}:</span>
                                <span class="badge bg-label-{{ $user->identity_status?->color() ?? 'secondary' }}">
                                    {{ $user->identity_status?->name() ?? trans('admin.na') }}
                                </span>
                            </li>
                            @if($user->identity_status === IdentityStatusEnum::PENDING)
                                <li class="mt-3">
                                    <div class="d-flex gap-2">
                                        <form action="{{ route('admin.app_user.verify_identity', $user->id) }}"
                                              method="POST" class="flex-grow-1">
                                            @csrf
                                            <input type="hidden" name="status" value="approved">
                                            <button type="submit" class="btn btn-sm btn-success w-100">
                                                <i class="ti ti-check me-1"></i>{{ trans('admin.approve') }}
                                            </button>
                                        </form>
                                        <button type="button" class="btn btn-sm btn-danger w-100" onclick="rejectIdentity()">
                                            <i class="ti ti-x me-1"></i>{{ trans('admin.reject') }}
                                        </button>
                                    </div>
                                </li>
                            @endif
                        </ul>
                    </div>
                </div>
            </div>
            <!-- /User Card -->
        </div>
        <!--/ User Sidebar -->

        <!-- User Content -->
        <div class="col-xl-8 col-lg-7 col-md-7 order-0 order-md-1">
            <!-- User Tabs -->
            <ul class="nav nav-pills flex-column flex-md-row mb-4">
                <li class="nav-item">
                    <a class="nav-link active" href="javascript:void(0);" id="orders-tab" data-bs-toggle="pill"
                       data-bs-target="#orders-content">
                        <i class="ti ti-shopping-cart me-1 ti-xs"></i>{{ trans('admin.orders') }}
                    </a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="javascript:void(0);" id="wallet-tab" data-bs-toggle="pill"
                       data-bs-target="#wallet-content">
                        <i class="ti ti-wallet me-1 ti-xs"></i>{{ trans('admin.wallet') }}
                    </a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="javascript:void(0);" id="reviews-tab" data-bs-toggle="pill"
                       data-bs-target="#reviews-content">
                        <i class="ti ti-star me-1 ti-xs"></i>{{ trans('admin.reviews') }}
                    </a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="javascript:void(0);" id="rewards-tab" data-bs-toggle="pill"
                       data-bs-target="#rewards-content">
                        <i class="ti ti-gift me-1 ti-xs"></i>{{ trans('admin.rewards') }}
                    </a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="javascript:void(0);" id="notifications-tab" data-bs-toggle="pill"
                       data-bs-target="#notifications-content">
                        <i class="ti ti-bell me-1 ti-xs"></i>{{ trans('admin.notifications') }}
                        @if($userNotifications->count() > 0)
                            <span class="badge bg-danger ms-1">{{ $userNotifications->count() }}</span>
                        @endif
                    </a>
                </li>
                @if ($user->role === UserAppRoleEnum::PROVIDER)
                    <li class="nav-item">
                        <a class="nav-link" href="javascript:void(0);" id="subscriptions-tab" data-bs-toggle="pill"
                           data-bs-target="#subscriptions-content">
                            <i class="ti ti-credit-card me-1 ti-xs"></i>{{ trans('admin.subscriptions') }}
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="javascript:void(0);" id="sub-payments-tab" data-bs-toggle="pill"
                           data-bs-target="#sub-payments-content">
                            <i class="ti ti-receipt me-1 ti-xs"></i>{{ trans('admin.subscription_payments') }}
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="javascript:void(0);" id="withdrawals-tab" data-bs-toggle="pill"
                           data-bs-target="#withdrawals-content">
                            <i class="ti ti-cash me-1 ti-xs"></i>{{ trans('admin.withdrawals') }}
                        </a>
                    </li>
                @endif
            </ul>
            <!--/ User Tabs -->

            <div class="tab-content">
                <!-- Orders Content -->
                <div class="tab-pane fade show active" id="orders-content" role="tabpanel">
                    <div class="card mb-4">
                        <h5 class="card-header">{{ trans('admin.orders') }}</h5>
                        <div class="table-responsive">
                            <table class="table border-top datatable-basic" id="orders-table">
                                <thead>
                                <tr>
                                    <th>{{ trans('admin.id') }}</th>
                                    <th>{{ trans('admin.date') }}</th>
                                    <th>{{ trans('admin.service') }}</th>
                                    <th>{{ trans('admin.order_type') }}</th>
                                    <th>{{ $user->role === UserAppRoleEnum::CLIENT ? trans('admin.provider') : trans('admin.client') }}</th>
                                    <th>{{ trans('admin.total') }}</th>
                                    <th>{{ trans('admin.status') }}</th>
                                    <th>{{ trans('admin.action') }}</th>
                                </tr>
                                </thead>
                                <tbody>
                                @foreach($orders as $order)
                                    <tr>
                                        <td>#{{ $order->id }}</td>
                                        <td>{{ $order->created_at->format('Y-m-d H:i') }}</td>
                                        <td>{{ $order->service->name ?? $order->custom_service_name ?? trans('admin.na') }}</td>
                                        <td>
                                            @php
                                                $isSystem = $order->service_id !== null;
                                                $type = $isSystem ? 'system' : 'custom';
                                                $color = $isSystem ? 'primary' : 'info';
                                            @endphp
                                            <span class="badge bg-label-{{ $color }}">{{ trans('admin.order_type_' . $type) }}</span>
                                        </td>
                                        <td>
                                            @if($user->role === UserAppRoleEnum::CLIENT)
                                                {{ $order->provider->name ?? trans('admin.na') }}
                                            @else
                                                {{ $order->client->name ?? trans('admin.na') }}
                                            @endif
                                        </td>
                                        <td>{{ number_format($order->price, 2) }}</td>
                                        <td>
                                            <span
                                                class="badge bg-label-{{ $order->status->color() }}">{{ $order->status->name() }}</span>
                                        </td>
                                        <td>
                                            <a href="{{ route('admin.order.show', $order->id) }}"
                                               class="btn btn-sm btn-icon"><i class="ti ti-eye"></i></a>
                                        </td>
                                    </tr>
                                @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>

                <!-- Wallet Content -->
                <div class="tab-pane fade" id="wallet-content" role="tabpanel">
                    <div class="card mb-4">
                        <h5 class="card-header">{{ trans('admin.transactions') }}</h5>
                        <div class="table-responsive">
                            <table class="table border-top datatable-basic" id="transactions-table">
                                <thead>
                                <tr>
                                    <th>{{ trans('admin.id') }}</th>
                                    <th>{{ trans('admin.date') }}</th>
                                    <th>{{ trans('admin.type') }}</th>
                                    <th>{{ trans('admin.amount') }}</th>
                                    <th>{{ trans('admin.description') }}</th>
                                </tr>
                                </thead>
                                <tbody>
                                @foreach($user->wallet->transactions ?? [] as $transaction)
                                    <tr>
                                        <td>#{{ $transaction->id }}</td>
                                        <td>{{ $transaction->created_at->format('Y-m-d H:i') }}</td>
                                        <td>
                                                <span
                                                    class="badge bg-label-{{ $transaction->type === WalletTypeEnum::CREDIT ? 'success' : 'danger' }}">
                                                    {{ $transaction->type->name() }}
                                                </span>
                                        </td>
                                        <td>{{ number_format($transaction->amount, 2) }}</td>
                                        <td>{{ $transaction->description }}</td>
                                    </tr>
                                @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>

                    <!-- Reviews Content -->
                    <div class="tab-pane fade" id="reviews-content" role="tabpanel">
                        <div class="card mb-4">
                            <h5 class="card-header">{{ trans('admin.reviews') }}</h5>
                            <div class="table-responsive">
                                <table class="table border-top datatable-basic" id="reviews-table">
                                    <thead>
                                    <tr>
                                        <th>{{ $user->role === UserAppRoleEnum::PROVIDER ? trans('admin.client') : trans('admin.provider') }}</th>
                                        <th>{{ trans('admin.rate') }}</th>
                                        <th>{{ trans('admin.comment') }}</th>
                                        <th>{{ trans('admin.date') }}</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    @php
                                        $reviews = $user->role === UserAppRoleEnum::PROVIDER ? $user->reviewsReceivedAsProvider : $user->reviewsReceivedAsClient;
                                    @endphp
                                    @foreach($reviews as $review)
                                        <tr>
                                            <td>{{ $user->role === UserAppRoleEnum::PROVIDER ? $review->client->name : $review->provider->name }}</td>
                                            <td>
                                                @for($i=1; $i<=5; $i++)
                                                    <i class="ti ti-star{{ $i <= $review->rating ? '-filled' : '' }} text-warning"></i>
                                                @endfor
                                            </td>
                                            <td>{{ $review->comment }}</td>
                                            <td>{{ $review->created_at->format('Y-m-d') }}</td>
                                        </tr>
                                    @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>

                    <!-- Rewards Content -->
                    <div class="tab-pane fade" id="rewards-content" role="tabpanel">
                        <div class="card mb-4">
                            <h5 class="card-header">{{ trans('admin.rewards') }}</h5>
                            <div class="table-responsive">
                                <table class="table border-top datatable-basic" id="rewards-table">
                                    <thead>
                                    <tr>
                                        <th>{{ trans('admin.id') }}</th>
                                        <th>{{ trans('admin.reward_name') }}</th>
                                        <th>{{ trans('admin.qr_token') }}</th>
                                        <th>{{ trans('admin.status') }}</th>
                                        <th>{{ trans('admin.date') }}</th>
                                        <th>{{ trans('admin.action') }}</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    @foreach($user->userRewards as $userReward)
                                        <tr>
                                            <td>#{{ $userReward->id }}</td>
                                            <td>{{ $userReward->reward->name }}</td>
                                            <td><code>{{ $userReward->qr_token }}</code></td>
                                            <td>
                                                <span class="badge bg-label-{{ $userReward->status === 'unused' ? 'success' : ($userReward->status === 'used' ? 'info' : 'danger') }}">
                                                    {{ trans('admin.' . $userReward->status) }}
                                                </span>
                                            </td>
                                            <td>{{ $userReward->created_at->format('Y-m-d') }}</td>
                                            <td>
                                                <button type="button" class="btn btn-sm btn-primary waves-effect waves-light show-qr-btn" data-token="{{ $userReward->qr_token }}">
                                                    <i class="ti ti-qrcode me-1"></i> {{ trans('admin.show_qr') }}
                                                </button>
                                            </td>
                                        </tr>
                                    @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>

                <!-- Notifications Content -->
                <div class="tab-pane fade" id="notifications-content" role="tabpanel">
                    <div class="card mb-4">
                        <h5 class="card-header">{{ trans('admin.notifications') }}</h5>
                        <div class="table-responsive">
                            <table class="table border-top datatable-basic" id="notifications-table">
                                <thead>
                                <tr>
                                    <th>{{ trans('admin.id') }}</th>
                                    <th>{{ trans('admin.title') }}</th>
                                    <th>{{ trans('admin.message') }}</th>
                                    <th>{{ trans('admin.status') }}</th>
                                    <th>{{ trans('admin.date') }}</th>
                                </tr>
                                </thead>
                                <tbody>
                                @foreach($userNotifications as $notification)
                                    <tr>
                                        <td>#{{ $notification->id }}</td>
                                        <td>{{ $notification->title }}</td>
                                        <td>{{ Str::limit($notification->message, 80) }}</td>
                                        <td>
                                            <span class="badge bg-label-{{ $notification->is_read ? 'secondary' : 'success' }}">
                                                {{ $notification->is_read ? trans('admin.read') : trans('admin.unread') }}
                                            </span>
                                        </td>
                                        <td>{{ $notification->created_at->format('Y-m-d H:i') }}</td>
                                    </tr>
                                @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>

                @if ($user->role === UserAppRoleEnum::PROVIDER)
                    <!-- Subscriptions Content -->
                    <div class="tab-pane fade" id="subscriptions-content" role="tabpanel">
                        <!-- Current Subscription -->
                        <div class="card mb-4">
                            <div class="card-header d-flex justify-content-between align-items-center">
                                <h5 class="mb-0">{{ trans('admin.current_subscription') }}</h5>
                                @if(\App\Services\UserPermissionService::can(PermissionEnum::SUBSCRIPTION_CHANGE))
                                    <button type="button" class="btn btn-primary" data-bs-toggle="modal"
                                            data-bs-target="#assignSubscriptionModal">
                                        <i class="ti ti-rotate me-1"></i>{{ trans('admin.change_subscription') }}
                                    </button>
                                @endif
                            </div>
                            <div class="card-body">
                                @if($user->activeSubscription)
                                    <div class="row align-items-center">
                                        <div class="col-md-6 border-end">
                                            <div class="d-flex align-items-center mb-3">
                                                <h4 class="mb-0 me-3 text-primary">{{ $user->activeSubscription->subscription->name }}</h4>
                                                <span
                                                    class="badge bg-label-{{ $user->activeSubscription->status->color() }}">
                                                    {{ $user->activeSubscription->status->name() }}
                                                </span>
                                            </div>
                                            <ul class="list-unstyled mb-0">
                                                <li class="mb-2">
                                                    <span class="fw-medium me-1">{{ trans('admin.start_at') }}:</span>
                                                    <span>{{ $user->activeSubscription->start_at->format('Y-m-d') }}</span>
                                                </li>
                                                <li class="mb-2">
                                                    <span class="fw-medium me-1">{{ trans('admin.end_at') }}:</span>
                                                    <span>{{ $user->activeSubscription->end_at->format('Y-m-d') }}</span>
                                                </li>
                                                <li>
                                                    <span class="fw-medium me-1">{{ trans('admin.price') }}:</span>
                                                    <span>{{ number_format($user->activeSubscription->subscription->price, 2) }} {{ trans('admin.sar') }}</span>
                                                </li>
                                            </ul>
                                        </div>
                                        <div class="col-md-6 text-center">
                                            @php
                                                $daysLeft = (int) now()->diffInDays($user->activeSubscription->end_at, false);
                                                $totalDays = (int) $user->activeSubscription->start_at->diffInDays($user->activeSubscription->end_at);
                                                $percent = $totalDays > 0 ? max(0, min(100, ceil(($daysLeft / $totalDays) * 100))) : 0;
                                            @endphp
                                            <div class="d-flex flex-column align-items-center">
                                                <div class="mb-2">
                                                    <span class="h1 mb-0">{{ max(0, $daysLeft) }}</span>
                                                    <span
                                                        class="text-muted">{{ trans('admin.days') }} {{ trans('admin.remaining') }}</span>
                                                </div>
                                                <div class="progress w-75" style="height: 10px;">
                                                    <div class="progress-bar" role="progressbar"
                                                         style="width: {{ $percent }}%" aria-valuenow="{{ $percent }}"
                                                         aria-valuemin="0" aria-valuemax="100"></div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                @else
                                    <div class="alert alert-warning mb-0">
                                        {{ trans('admin.no_active_subscription') }}
                                    </div>
                                @endif
                            </div>
                        </div>

                        <!-- Old Subscriptions -->
                        <div class="card">
                            <h5 class="card-header">{{ trans('admin.old_subscriptions') }}</h5>
                            <div class="table-responsive">
                                <table class="table border-top datatable-basic" id="subscriptions-history-table">
                                    <thead>
                                    <tr>
                                        <th>{{ trans('admin.subscription') }}</th>
                                        <th>{{ trans('admin.start_at') }}</th>
                                        <th>{{ trans('admin.end_at') }}</th>
                                        <th>{{ trans('admin.status') }}</th>
                                        <th>{{ trans('admin.price') }}</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    @foreach($user->subscriptions->where('status', '!=', \App\Enums\SubscriptionStatusEnum::ACTIVE) as $sub)
                                        <tr>
                                            <td>{{ $sub->subscription->name }}</td>
                                            <td>{{ $sub->start_at->format('Y-m-d') }}</td>
                                            <td>{{ $sub->end_at->format('Y-m-d') }}</td>
                                            <td>
                                                    <span class="badge bg-label-{{ $sub->status->color() }}">
                                                        {{ $sub->status->name() }}
                                                    </span>
                                            </td>
                                            <td>{{ number_format($sub->subscription->price, 2) }} {{ trans('admin.sar') }}</td>
                                        </tr>
                                    @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>

                    <!-- Subscription Payments Content -->
                    <div class="tab-pane fade" id="sub-payments-content" role="tabpanel">
                        <div class="card">
                            <h5 class="card-header">{{ trans('admin.subscription_payments') }}</h5>
                            <div class="table-responsive">
                                <table class="table border-top datatable-basic" id="sub-payments-table">
                                    <thead>
                                    <tr>
                                        <th>{{ trans('admin.id') }}</th>
                                        <th>{{ trans('admin.date') }}</th>
                                        <th>{{ trans('admin.subscription') }}</th>
                                        <th>{{ trans('admin.amount') }}</th>
                                        <th>{{ trans('admin.method') }}</th>
                                        <th>{{ trans('admin.status') }}</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    @foreach($user->subscriptionPayments as $payment)
                                        <tr>
                                            <td>#{{ $payment->id }}</td>
                                            <td>{{ $payment->created_at->format('Y-m-d H:i') }}</td>
                                            <td>{{ $payment->subscription->name ?? trans('admin.na') }}</td>
                                            <td>{{ number_format($payment->amount, 2) }} {{ trans('admin.sar') }}</td>
                                            <td>{{ $payment->method->name() }}</td>
                                            <td>
                                                    <span class="badge bg-label-{{ $payment->status->color() }}">
                                                        {{ $payment->status->name() }}
                                                    </span>
                                            </td>
                                        </tr>
                                    @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                @endif

                @if($user->role === UserAppRoleEnum::PROVIDER)
                    <!-- Withdrawals Content -->
                    <div class="tab-pane fade" id="withdrawals-content" role="tabpanel">
                        <div class="card">
                            <h5 class="card-header">{{ trans('admin.withdrawals') }}</h5>
                            <div class="table-responsive">
                                <table class="table border-top datatable-basic" id="withdrawals-table">
                                    <thead>
                                    <tr>
                                        <th>{{ trans('admin.id') }}</th>
                                        <th>{{ trans('admin.iban') }}</th>
                                        <th>{{ trans('admin.amount') }}</th>
                                        <th>{{ trans('admin.status') }}</th>
                                        <th>{{ trans('admin.date') }}</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    @foreach($user->withdrawals as $withdrawal)
                                        <tr>
                                            <td>#{{ $withdrawal->id }}</td>
                                            <td>{{ $withdrawal->iban }}</td>
                                            <td>{{ number_format($withdrawal->amount, 2) }} {{ trans('admin.sar') }}</td>
                                            <td>
                                                    <span class="badge bg-label-{{ $withdrawal->status->color() }}">
                                                        {{ $withdrawal->status->name() }}
                                                    </span>
                                            </td>
                                            <td>{{ $withdrawal->created_at->format('Y-m-d H:i') }}</td>
                                        </tr>
                                    @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                @endif
            </div>
        </div>
        <!--/ User Content -->
    </div>

    @if($user->role === UserAppRoleEnum::PROVIDER && \App\Services\UserPermissionService::can(PermissionEnum::SUBSCRIPTION_CHANGE))
        <!-- Assign Subscription Modal -->
        <div class="modal fade" id="assignSubscriptionModal" tabindex="-1" aria-hidden="true">
            <div class="modal-dialog modal-dialog-centered">
                <div class="modal-content p-3 p-md-5">
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    <div class="modal-body">
                        <div class="text-center mb-4">
                            <h3 class="mb-2">{{ trans('admin.change_subscription') }}</h3>
                            <p class="text-muted">{{ $user->name }}</p>
                        </div>
                        <form id="assignSubscriptionForm" class="row g-3">
                            @csrf
                            <input type="hidden" name="provider_ids[]" value="{{ $user->id }}">
                            <div class="col-12">
                                <label class="form-label"
                                       for="subscription_id">{{ trans('admin.subscription') }}</label>
                                <select id="subscription_id" name="subscription_id" class="select2 form-select"
                                        data-placeholder="{{ trans('admin.select_all') }}" required>
                                </select>
                            </div>
                            <div class="col-12">
                                <label class="form-label"
                                       for="payment_method">{{ trans('admin.payment_method') }}</label>
                                <select id="payment_method" name="payment_method" class="form-select" required>
                                    <option value="bank">{{ trans('admin.bank') }}</option>
                                    <option value="card">{{ trans('admin.card') }}</option>
                                    <option value="wallet">{{ trans('admin.wallet') }}</option>
                                </select>
                            </div>
                            <div class="col-12 text-center mt-4">
                                <button type="submit"
                                        class="btn btn-primary me-sm-3 me-1">{{ trans('admin.save') }}</button>
                                <button type="reset" class="btn btn-label-secondary" data-bs-dismiss="modal"
                                        aria-label="Close">{{ trans('admin.cancel') }}</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    @endif

    <!-- Adjust Wallet Modal -->
    <div class="modal fade" id="adjustWalletModal" tabindex="-1" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered">
            <div class="modal-content p-3 p-md-5">
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                <div class="modal-body">
                    <div class="text-center mb-4">
                        <h3 class="mb-2">{{ trans('admin.adjust_wallet_balance') }}</h3>
                    </div>
                    <form id="adjustWalletForm" class="row g-3">
                        @csrf
                        <div class="col-12">
                            <label class="form-label" for="wallet-amount">{{ trans('admin.amount') }}</label>
                            <input type="number" id="wallet-amount" name="amount" class="form-control"
                                   placeholder="0.00" step="0.01" required/>
                        </div>
                        <div class="col-12">
                            <label class="form-label" for="wallet-type">{{ trans('admin.type') }}</label>
                            <select id="wallet-type" name="type" class="form-select" required>
                                <option value="credit">{{ trans('admin.add_balance') }}</option>
                                <option value="debit">{{ trans('admin.subtract_balance') }}</option>
                            </select>
                        </div>
                        <div class="col-12">
                            <label class="form-label" for="wallet-description">{{ trans('admin.description') }}</label>
                            <textarea id="wallet-description" name="description" class="form-control" rows="3"
                                      required></textarea>
                        </div>
                        <div class="col-12 text-center">
                            <button type="submit"
                                    class="btn btn-primary me-sm-3 me-1">{{ trans('admin.save') }}</button>
                            <button type="reset" class="btn btn-label-secondary" data-bs-dismiss="modal"
                                    aria-label="Close">{{ trans('admin.cancel') }}</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <!--/ Adjust Wallet Modal -->
    <!-- QR Modal -->
    <div class="modal fade" id="qrModal" tabindex="-1" aria-hidden="true">
        <div class="modal-dialog modal-sm modal-dialog-centered">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">{{ trans('admin.show_qr') }}</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body text-center">
                    <div id="qr-container">
                        <div class="spinner-border text-primary" role="status">
                            <span class="visually-hidden">Loading...</span>
                        </div>
                    </div>
                    <img id="qr-image" src="" alt="QR Code" class="img-fluid d-none" style="width: 100%;">
                </div>
                <div class="modal-footer text-center d-block">
                    <p class="mb-0 small text-muted">RW-TOKEN: <span id="qr-token-label"></span></p>
                </div>
            </div>
        </div>
    </div>
    <!-- Send Notification Modal -->
    <div class="modal fade" id="sendNotificationModal" tabindex="-1" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered">
            <div class="modal-content p-3 p-md-5">
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                <div class="modal-body">
                    <div class="text-center mb-4">
                        <h3 class="mb-2">{{ trans('admin.send_notification') }}</h3>
                        <p class="text-muted">{{ $user->name }}</p>
                    </div>
                    <form id="sendNotificationForm" class="row g-3">
                        @csrf
                        <div class="col-12">
                            <label class="form-label" for="notif-title">{{ trans('admin.title') }}</label>
                            <input type="text" id="notif-title" name="title" class="form-control"
                                   placeholder="{{ trans('admin.please_enter_title') }}" required/>
                        </div>
                        <div class="col-12">
                            <label class="form-label" for="notif-message">{{ trans('admin.message') }}</label>
                            <textarea id="notif-message" name="message" class="form-control" rows="4"
                                      placeholder="{{ trans('admin.please_enter_message') }}" required></textarea>
                        </div>
                        <div class="col-12 text-center mt-4">
                            <button type="submit"
                                    class="btn btn-primary me-sm-3 me-1">{{ trans('admin.send') }}</button>
                            <button type="reset" class="btn btn-label-secondary" data-bs-dismiss="modal"
                                    aria-label="Close">{{ trans('admin.cancel') }}</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <!--/ Send Notification Modal -->
@endsection

@section('vendor-script')
    <script src="{{ asset('admin_assets/vendor/libs/datatables-bs5/datatables-bootstrap5.js') }}"></script>
    <script src="{{ asset('admin_assets/vendor/libs/select2/select2.js') }}"></script>
    <script src="{{ asset('admin_assets/vendor/libs/sweetalert2/sweetalert2.js') }}"></script>
@endsection

@section('page-script')
    <script>
        $(document).ready(function () {
            $('.datatable-basic').DataTable({
                dom: '<"row"<"col-sm-12 col-md-6"l><"col-sm-12 col-md-6"f>>t<"row"<"col-sm-12 col-md-6"i><"col-sm-12 col-md-6"p>>',
                language: {
                    url: "{{ asset('admin_assets/json/locales/datatables/'.app()->getLocale().'.json') }}"
                },
                responsive: true
            });

            // Adjust columns when switching tabs
            $('a[data-bs-toggle="pill"]').on('shown.bs.tab', function (e) {
                $($.fn.dataTable.tables(true)).DataTable()
                    .columns.adjust()
                    .responsive.recalc();
            });

            // Wallet Adjustment AJAX
            $('#adjustWalletForm').on('submit', function (e) {
                e.preventDefault();
                const form = $(this);
                const submitBtn = form.find('button[type="submit"]');

                submitBtn.prop('disabled', true);

                $.ajax({
                    url: "{{ route('admin.app_user.adjust_wallet', $user->id) }}",
                    method: 'POST',
                    data: form.serialize(),
                    success: function (response) {
                        $('#adjustWalletModal').modal('hide');
                        form[0].reset();

                        Swal.fire({
                            icon: 'success',
                            title: "{{ trans('admin.updated_successfully') }}",
                            showConfirmButton: false,
                            timer: 1500
                        }).then(() => {
                            location.reload();
                        });

                        // Fallback in case Swal timer triggers before user input
                        setTimeout(() => {
                            location.reload();
                        }, 1600);
                    },
                    error: function (xhr) {
                        let message = "{{ trans('admin.error') }}";
                        if (xhr.responseJSON && xhr.responseJSON.message) {
                            message = xhr.responseJSON.message;
                        } else if (xhr.responseJSON && xhr.responseJSON.errors) {
                            message = Object.values(xhr.responseJSON.errors)[0][0];
                        }

                        Swal.fire({
                            icon: 'error',
                            title: 'Error',
                            text: message
                        });
                    },
                    complete: function () {
                        submitBtn.prop('disabled', false);
                    }
                });
            });
            // Assign Subscription Select2
            $('#subscription_id').select2({
                dropdownParent: $('#assignSubscriptionModal'),
                ajax: {
                    url: "{{ route('admin.subscriptions_list') }}",
                    dataType: 'json',
                    delay: 250,
                    data: function (params) {
                        return {
                            term: params.term,
                            active: 1,
                            exclude_provider_id: "{{ $user->id }}",
                            page: params.page || 1
                        };
                    },
                    processResults: function (data, params) {
                        params.page = params.page || 1;
                        return {
                            results: data.data,
                            pagination: {
                                more: (params.page * 10) < data.total
                            }
                        };
                    },
                    cache: true
                }
            });

            // Assign Subscription Form Submission
            $('#assignSubscriptionForm').on('submit', function (e) {
                e.preventDefault();
                const form = $(this);
                const submitBtn = form.find('button[type="submit"]');

                submitBtn.prop('disabled', true);

                $.ajax({
                    url: "{{ route('admin.subscription.assign_to_providers') }}",
                    method: 'POST',
                    data: form.serialize(),
                    success: function (response) {
                        $('#assignSubscriptionModal').modal('hide');

                        Swal.fire({
                            icon: 'success',
                            title: response.message,
                            showConfirmButton: true
                        }).then(() => {
                            location.reload();
                        });
                    },
                    error: function (xhr) {
                        let message = "{{ trans('admin.error') }}";
                        if (xhr.responseJSON && xhr.responseJSON.message) {
                            message = xhr.responseJSON.message;
                        }

                        Swal.fire({
                            icon: 'error',
                            title: 'Error',
                            text: message
                        });
                        submitBtn.prop('disabled', false);
                    }
                });
            });

            // Send Individual Notification AJAX
            $('#sendNotificationForm').on('submit', function (e) {
                e.preventDefault();
                const form = $(this);
                const submitBtn = form.find('button[type="submit"]');

                submitBtn.prop('disabled', true);

                $.ajax({
                    url: "{{ route('admin.app_user.send_notification', $user->id) }}",
                    method: 'POST',
                    data: form.serialize(),
                    success: function (response) {
                        $('#sendNotificationModal').modal('hide');
                        form[0].reset();

                        Swal.fire({
                            icon: 'success',
                            title: response.message || "{{ trans('admin.sent_successfully') }}",
                            showConfirmButton: false,
                            timer: 1500
                        });
                    },
                    error: function (xhr) {
                        let message = "{{ trans('admin.error') }}";
                        if (xhr.responseJSON && xhr.responseJSON.message) {
                            message = xhr.responseJSON.message;
                        }

                        Swal.fire({
                            icon: 'error',
                            title: 'Error',
                            text: message
                        });
                    },
                    complete: function () {
                        submitBtn.prop('disabled', false);
                    }
                });
            });
        });

        function rejectIdentity() {
            Swal.fire({
                title: "{{ trans('admin.reject_reason') }}",
                input: 'textarea',
                inputPlaceholder: "{{ trans('admin.please_enter_note') }}",
                showCancelButton: true,
                confirmButtonText: "{{ trans('admin.confirm') }}",
                cancelButtonText: "{{ trans('admin.cancel') }}",
                showLoaderOnConfirm: true,
                preConfirm: (reason) => {
                    if (!reason) {
                        Swal.showValidationMessage("{{ trans('admin.please_enter_note') }}");
                        return false;
                    }
                    return $.ajax({
                        url: "{{ route('admin.app_user.verify_identity', $user->id) }}",
                        method: 'POST',
                        data: {
                            _token: "{{ csrf_token() }}",
                            status: 'rejected',
                            reason: reason
                        }
                    }).catch(error => {
                        let message = "{{ trans('admin.error') }}";
                        if (error.responseJSON && error.responseJSON.message) {
                            message = error.responseJSON.message;
                        }
                        Swal.showValidationMessage(message);
                    });
                },
                allowOutsideClick: () => !Swal.isLoading()
            }).then((result) => {
                if (result.isConfirmed) {
                    Swal.fire({
                        icon: 'success',
                        title: "{{ trans('admin.updated_successfully') }}",
                        showConfirmButton: false,
                        timer: 1500
                    }).then(() => {
                        location.reload();
                    });
                }
            });
        }

        $(document).on('click', '.show-qr-btn', function() {
            const token = $(this).data('token');
            if (!token) return;

            const $qrModal = $('#qrModal');
            const $qrContainer = $('#qr-container');
            const $qrImage = $('#qr-image');
            const $qrTokenLabel = $('#qr-token-label');

            $qrImage.addClass('d-none');
            $qrContainer.removeClass('d-none');
            $qrTokenLabel.text(token);

            // Show modal (BS5 compatibility)
            if (typeof bootstrap !== 'undefined' && bootstrap.Modal) {
                let modal = bootstrap.Modal.getOrCreateInstance($qrModal[0]);
                modal.show();
            } else {
                $qrModal.modal('show');
            }

            // Fix URL replacement logic
            let url = "{{ route('admin.rewards.qr_image', ['token' => '___TOKEN___']) }}";
            url = url.replace('___TOKEN___', token);

            $.get(url, function(response) {
                if (response.success) {
                    $qrImage.attr('src', response.qr_base64).removeClass('d-none');
                    $qrContainer.addClass('d-none');
                } else {
                    Swal.fire('Error', 'Could not load QR code', 'error');
                }
            }).fail(function() {
                Swal.fire('Error', 'Communication error', 'error');
            });
        });
    </script>
@endsection