

<?php $__env->startSection('content'); ?>
<!-- Header -->
<div class="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-fluid mb-fluid">
    <div>
        <h2 class="text-fluid-xl font-bold text-gray-800 dark:text-gray-100">License Details</h2>
        <p class="text-gray-500 dark:text-gray-400 text-fluid-sm mt-1">Manage license and monitor devices</p>
    </div>
    <div class="flex items-center gap-2">
        <a href="<?php echo e(route('licenses.index')); ?>" class="px-4 py-2 border border-gray-200 dark:border-gray-600 text-gray-600 dark:text-gray-300 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors flex items-center gap-2 text-fluid-base">
            <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 19l-7-7m0 0l7-7m-7 7h18"></path>
            </svg>
            <span>Back</span>
        </a>
    </div>
</div>

<!-- License Key Card -->
<div class="bg-white dark:bg-gray-900 rounded-fluid shadow-sm border border-gray-100 dark:border-gray-700 p-fluid mb-fluid">
    <div class="flex flex-col lg:flex-row lg:items-center justify-between gap-fluid">
        <div>
            <label class="text-fluid-sm text-gray-500 dark:text-gray-400 block mb-fluid-sm">License Key</label>
            <code class="text-fluid-base sm:text-fluid-xl font-mono text-purple-600 dark:text-purple-400 bg-purple-50 dark:bg-purple-900 px-4 py-2 rounded-lg block w-fit break-all"><?php echo e($license->key); ?></code>
        </div>
        <div class="flex flex-wrap gap-2">
            <?php
                $statusColors = [
                    'active' => 'bg-green-100 text-green-700 border-green-200 dark:bg-green-900 dark:text-green-300 dark:border-green-700',
                    'expired' => 'bg-red-100 text-red-700 border-red-200 dark:bg-red-900 dark:text-red-300 dark:border-red-700',
                    'suspended' => 'bg-yellow-100 text-yellow-700 border-yellow-200 dark:bg-yellow-900 dark:text-yellow-300 dark:border-yellow-700',
                    'revoked' => 'bg-gray-100 text-gray-700 border-gray-200 dark:bg-gray-700 dark:text-gray-300 dark:border-gray-600',
                ];
            ?>
            <span class="px-4 py-2 text-fluid-sm font-medium rounded-lg border <?php echo e($statusColors[$license->status] ?? 'bg-gray-100 text-gray-700 dark:bg-gray-700 dark:text-gray-300'); ?>">
                <?php echo e(ucfirst($license->status)); ?>

            </span>
        </div>
    </div>
</div>

<!-- Stats and Info -->
<div class="grid grid-cols-1 lg:grid-cols-3 gap-fluid-lg mb-fluid">
    <!-- License Info -->
    <div class="bg-white dark:bg-gray-900 rounded-fluid shadow-sm border border-gray-100 dark:border-gray-700 p-fluid-lg">
        <h3 class="text-fluid-lg font-semibold text-gray-800 dark:text-gray-100 mb-fluid">License Information</h3>
        <div class="space-y-fluid">
            <div class="flex justify-between">
                <span class="text-gray-500 dark:text-gray-400 text-fluid-sm">Customer Name</span>
                <span class="text-gray-800 dark:text-gray-100 font-medium text-fluid-sm"><?php echo e($license->name ?? '-'); ?></span>
            </div>
            <div class="flex justify-between">
                <span class="text-gray-500 dark:text-gray-400 text-fluid-sm">Email</span>
                <span class="text-gray-800 dark:text-gray-100 text-fluid-sm"><?php echo e($license->email ?? '-'); ?></span>
            </div>
            <div class="flex justify-between">
                <span class="text-gray-500 dark:text-gray-400 text-fluid-sm">Activated</span>
                <span class="text-gray-800 dark:text-gray-100 text-fluid-sm"><?php echo e($license->activated_at?->format('M d, Y H:i') ?? '-'); ?></span>
            </div>
            <div class="flex justify-between">
                <span class="text-gray-500 dark:text-gray-400 text-fluid-sm">Expires</span>
                <span class="text-gray-800 dark:text-gray-100 text-fluid-sm <?php echo e($license->isExpired() ? 'text-red-600 dark:text-red-400' : ''); ?>">
                    <?php echo e($license->expires_at?->format('M d, Y') ?? 'Never'); ?>

                </span>
            </div>
            <div class="flex justify-between">
                <span class="text-gray-500 dark:text-gray-400 text-fluid-sm">Max Devices</span>
                <span class="text-gray-800 dark:text-gray-100 text-fluid-sm"><?php echo e($license->max_devices); ?></span>
            </div>
            <div class="flex justify-between">
                <span class="text-gray-500 dark:text-gray-400 text-fluid-sm">Current Devices</span>
                <span class="text-fluid-sm <?php echo e($license->current_devices >= $license->max_devices ? 'text-red-600 dark:text-red-400' : 'text-green-600 dark:text-green-400'); ?>">
                    <?php echo e($license->current_devices); ?> / <?php echo e($license->max_devices); ?>

                </span>
            </div>
        </div>
    </div>

    <!-- Device Stats -->
    <div class="bg-white dark:bg-gray-900 rounded-fluid shadow-sm border border-gray-100 dark:border-gray-700 p-fluid-lg">
        <h3 class="text-fluid-lg font-semibold text-gray-800 dark:text-gray-100 mb-fluid">Device Statistics</h3>
        <div class="space-y-fluid">
            <div class="flex items-center justify-between p-3 bg-green-50 dark:bg-green-900 rounded-lg">
                <div class="flex items-center gap-3">
                    <div class="w-10 h-10 bg-green-100 dark:bg-green-800 rounded-lg flex items-center justify-center">
                        <svg class="w-5 h-5 text-green-600 dark:text-green-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"></path>
                        </svg>
                    </div>
                    <span class="text-gray-600 dark:text-gray-300 text-fluid-sm">Active Devices</span>
                </div>
                <span class="text-fluid-2xl font-bold text-green-600 dark:text-green-400"><?php echo e($deviceStats['active']); ?></span>
            </div>
            <div class="flex items-center justify-between p-3 bg-gray-50 dark:bg-gray-700 rounded-lg">
                <div class="flex items-center gap-3">
                    <div class="w-10 h-10 bg-gray-100 dark:bg-gray-600 rounded-lg flex items-center justify-center">
                        <svg class="w-5 h-5 text-gray-600 dark:text-gray-300" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"></path>
                        </svg>
                    </div>
                    <span class="text-gray-600 dark:text-gray-300 text-fluid-sm">Inactive Devices</span>
                </div>
                <span class="text-fluid-2xl font-bold text-gray-600 dark:text-gray-300"><?php echo e($deviceStats['inactive']); ?></span>
            </div>
            <div class="flex items-center justify-between p-3 bg-purple-50 dark:bg-purple-900 rounded-lg">
                <div class="flex items-center gap-3">
                    <div class="w-10 h-10 bg-purple-100 dark:bg-purple-800 rounded-lg flex items-center justify-center">
                        <svg class="w-5 h-5 text-purple-600 dark:text-purple-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"></path>
                        </svg>
                    </div>
                    <span class="text-gray-600 dark:text-gray-300 text-fluid-sm">Total Sessions</span>
                </div>
                <span class="text-fluid-2xl font-bold text-purple-600 dark:text-purple-400"><?php echo e($deviceStats['total']); ?></span>
            </div>
        </div>
    </div>

    <!-- Actions -->
    <div class="bg-white dark:bg-gray-900 rounded-fluid shadow-sm border border-gray-100 dark:border-gray-700 p-fluid-lg">
        <h3 class="text-fluid-lg font-semibold text-gray-800 dark:text-gray-100 mb-fluid">Quick Actions</h3>
        <div class="space-y-fluid-sm">
            <button onclick="document.getElementById('renewModal').classList.remove('hidden')" class="w-full px-4 py-2 bg-purple-100 dark:bg-purple-900 text-purple-700 dark:text-purple-300 rounded-lg hover:bg-purple-200 dark:hover:bg-purple-800 transition-colors flex items-center justify-center gap-2 text-fluid-base">
                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"></path>
                </svg>
                <span>Renew License</span>
            </button>
            <button onclick="document.getElementById('statusModal').classList.remove('hidden')" class="w-full px-4 py-2 bg-gray-100 dark:bg-gray-700 text-gray-700 dark:text-gray-300 rounded-lg hover:bg-gray-200 dark:hover:bg-gray-600 transition-colors flex items-center justify-center gap-2 text-fluid-base">
                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6V4m0 2a2 2 0 100 4m0-4a2 2 0 110 4m-6 8a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4m6 6v10m6-2a2 2 0 100-4m0 4a2 2 0 110-4m0 4v2m0-6V4"></path>
                </svg>
                <span>Change Status</span>
            </button>
            <a href="<?php echo e(route('licenses.edit', $license->id)); ?>" class="w-full px-4 py-2 bg-blue-100 dark:bg-blue-900 text-blue-700 dark:text-blue-300 rounded-lg hover:bg-blue-200 dark:hover:bg-blue-800 transition-colors flex items-center justify-center gap-2 text-fluid-base">
                <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"></path>
                </svg>
                <span>Edit License</span>
            </a>
        </div>
    </div>
</div>

<!-- Devices Table -->
<div class="bg-white dark:bg-gray-900 rounded-fluid shadow-sm border border-gray-100 dark:border-gray-700 overflow-hidden">
    <div class="px-4 sm:px-6 py-4 border-b border-gray-100 dark:border-gray-700">
        <h3 class="text-fluid-lg font-semibold text-gray-800 dark:text-gray-100">Connected Devices</h3>
    </div>
    <div class="overflow-x-auto">
        <table class="table">
            <thead class="bg-gray-50 dark:bg-gray-700 border-b border-gray-200 dark:border-gray-600">
                <tr>
                    <th class="px-4 sm:px-6 py-3 text-left text-fluid-sm font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">Device</th>
                    <th class="px-4 sm:px-6 py-3 text-left text-fluid-sm font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider hidden md:table-cell">Type</th>
                    <th class="px-4 sm:px-6 py-3 text-left text-fluid-sm font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider hidden lg:table-cell">OS</th>
                    <th class="px-4 sm:px-6 py-3 text-left text-fluid-sm font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider hidden sm:table-cell">IP Address</th>
                    <th class="px-4 sm:px-6 py-3 text-left text-fluid-sm font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider hidden md:table-cell">Location</th>
                    <th class="px-4 sm:px-6 py-3 text-left text-fluid-sm font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">Status</th>
                    <th class="px-4 sm:px-6 py-3 text-left text-fluid-sm font-medium text-gray-500 uppercase tracking-wider hidden sm:table-cell">Last Seen</th>
                </tr>
            </thead>
            <tbody class="divide-y divide-gray-100 dark:divide-gray-700">
                <?php $__empty_1 = true; $__currentLoopData = $license->deviceLogs()->orderBy('last_seen', 'desc')->get(); $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $device): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); $__empty_1 = false; ?>
                <tr class="hover:bg-gray-50 dark:hover:bg-gray-700 transition-colors">
                    <td class="px-4 sm:px-6 py-4">
                        <div class="flex items-center gap-3">
                            <div class="w-10 h-10 bg-purple-100 dark:bg-purple-900 rounded-lg flex items-center justify-center">
                                <?php if($device->device_type === 'mobile'): ?>
                                    <svg class="w-5 h-5 text-purple-600 dark:text-purple-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 18h.01M8 21h8a2 2 0 002-2V5a2 2 0 00-2-2H8a2 2 0 00-2 2v14a2 2 0 002 2z"></path>
                                    </svg>
                                <?php elseif($device->device_type === 'tablet'): ?>
                                    <svg class="w-5 h-5 text-purple-600 dark:text-purple-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 18h.01M7 21h10a2 2 0 002-2V5a2 2 0 00-2-2H7a2 2 0 00-2 2v14a2 2 0 002 2z"></path>
                                    </svg>
                                <?php else: ?>
                                    <svg class="w-5 h-5 text-purple-600 dark:text-purple-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"></path>
                                    </svg>
                                <?php endif; ?>
                            </div>
                            <div>
                                <div class="text-fluid-sm font-medium text-gray-800 dark:text-gray-100"><?php echo e($device->device_name); ?></div>
                                <div class="text-fluid-xs text-gray-500 dark:text-gray-400"><?php echo e($device->browser); ?></div>
                            </div>
                        </div>
                    </td>
                    <td class="px-4 sm:px-6 py-4 hidden md:table-cell">
                        <span class="text-fluid-sm text-gray-600 dark:text-gray-400 capitalize"><?php echo e($device->device_type); ?></span>
                    </td>
                    <td class="px-4 sm:px-6 py-4 hidden lg:table-cell">
                        <span class="text-fluid-sm text-gray-600 dark:text-gray-400"><?php echo e($device->os); ?></span>
                    </td>
                    <td class="px-4 sm:px-6 py-4 hidden sm:table-cell">
                        <code class="text-fluid-xs text-gray-600 dark:text-gray-300 bg-gray-100 dark:bg-gray-800 px-2 py-1 rounded"><?php echo e($device->ip_address); ?></code>
                    </td>
                    <td class="px-4 sm:px-6 py-4 hidden md:table-cell">
                        <span class="text-fluid-sm text-gray-600 dark:text-gray-400">
                            <?php echo e($device->city ? $device->city . ', ' : ''); ?><?php echo e($device->country); ?>

                        </span>
                    </td>
                    <td class="px-4 sm:px-6 py-4">
                        <?php if($device->is_active): ?>
                            <span class="px-2 py-1 text-fluid-xs font-medium rounded-full bg-green-100 text-green-700 dark:bg-green-900 dark:text-green-300">Active</span>
                        <?php else: ?>
                            <span class="px-2 py-1 text-fluid-xs font-medium rounded-full bg-gray-100 text-gray-600 dark:bg-gray-700 dark:text-gray-300">Inactive</span>
                        <?php endif; ?>
                    </td>
                    <td class="px-4 sm:px-6 py-4 hidden sm:table-cell">
                        <span class="text-fluid-sm text-gray-500 dark:text-gray-400"><?php echo e($device->last_seen?->diffForHumans() ?? '-'); ?></span>
                    </td>
                </tr>
                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); if ($__empty_1): ?>
                <tr>
                    <td colspan="7" class="px-4 sm:px-6 py-12 text-center text-gray-500 dark:text-gray-400">
                        <svg class="w-12 h-12 mx-auto text-gray-300 dark:text-gray-600 mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"></path>
                        </svg>
                        <p>No devices connected yet</p>
                    </td>
                </tr>
                <?php endif; ?>
            </tbody>
        </table>
    </div>
</div>

<!-- Renew Modal -->
<div id="renewModal" class="hidden fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-4">
    <div class="bg-white dark:bg-gray-800 rounded-fluid shadow-xl max-w-md w-full p-fluid border border-transparent dark:border-gray-700">
        <h3 class="text-fluid-lg font-semibold text-gray-800 dark:text-gray-100 mb-fluid">Renew License</h3>
        <form method="POST" action="<?php echo e(route('licenses.renew', $license->id)); ?>">
            <?php echo csrf_field(); ?>
            <div class="mb-fluid">
                <label for="new_expiry" class="block text-fluid-sm font-medium text-gray-700 dark:text-gray-300 mb-fluid-sm">New Expiration Date</label>
                <input type="date" name="new_expiry" id="new_expiry" required
                    min="<?php echo e(date('Y-m-d', strtotime('+1 day'))); ?>"
                    class="w-full px-4 py-2 border border-gray-200 dark:border-gray-600 dark:bg-gray-700 dark:text-white rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent text-fluid-base">
            </div>
            <div class="flex justify-end gap-fluid-sm">
                <button type="button" onclick="document.getElementById('renewModal').classList.add('hidden')"
                    class="px-4 py-2 border border-gray-200 dark:border-gray-600 text-gray-600 dark:text-gray-300 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-700 text-fluid-base">
                    Cancel
                </button>
                <button type="submit" class="px-4 py-2 gradient-bg text-white rounded-lg hover:opacity-90 text-fluid-base">
                    Renew
                </button>
            </div>
        </form>
    </div>
</div>

<!-- Status Modal -->
<div id="statusModal" class="hidden fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-4">
    <div class="bg-white dark:bg-gray-800 rounded-fluid shadow-xl max-w-md w-full p-fluid border border-transparent dark:border-gray-700">
        <h3 class="text-fluid-lg font-semibold text-gray-800 dark:text-gray-100 mb-fluid">Change Status</h3>
        <form method="POST" action="<?php echo e(route('licenses.updateStatus', $license->id)); ?>">
            <?php echo csrf_field(); ?>
            <div class="mb-fluid">
                <label for="status" class="block text-fluid-sm font-medium text-gray-700 dark:text-gray-300 mb-fluid-sm">Select Status</label>
                <select name="status" id="status" required
                    class="w-full px-4 py-2 border border-gray-200 dark:border-gray-600 dark:bg-gray-700 dark:text-white rounded-lg focus:ring-2 focus:ring-purple-500 focus:border-transparent text-fluid-base">
                    <option value="active" <?php echo e($license->status === 'active' ? 'selected' : ''); ?>>Active</option>
                    <option value="suspended" <?php echo e($license->status === 'suspended' ? 'selected' : ''); ?>>Suspended</option>
                    <option value="revoked" <?php echo e($license->status === 'revoked' ? 'selected' : ''); ?>>Revoked</option>
                    <option value="expired" <?php echo e($license->status === 'expired' ? 'selected' : ''); ?>>Expired</option>
                </select>
            </div>
            <div class="flex justify-end gap-fluid-sm">
                <button type="button" onclick="document.getElementById('statusModal').classList.add('hidden')"
                    class="px-4 py-2 border border-gray-200 dark:border-gray-600 text-gray-600 dark:text-gray-300 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-700 text-fluid-base">
                    Cancel
                </button>
                <button type="submit" class="px-4 py-2 gradient-bg text-white rounded-lg hover:opacity-90 text-fluid-base">
                    Update
                </button>
            </div>
        </form>
    </div>
</div>
<?php $__env->stopSection(); ?>

<?php echo $__env->make('layouts.app', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH C:\xampp\htdocs\license-panel\resources\views/licenses/show.blade.php ENDPATH**/ ?>