<div x-data="{ activeTab: 'setups' }">
    
    <div class="w-full flex items-center mb-8">
        <a href="<?php echo e(route('products.index')); ?>"
            class="flex rounded-lg bg-white border border-gray-200 px-4 py-2 text-gray-700 hover:bg-gray-100 font-bold">
            <img src="<?php echo e(asset('vendor/blade-untitledui-icons/arrow-narrow-left.svg')); ?>" alt="Volver" class="w-6 h-6">
            <span class="ml-2">Volver</span>
        </a>
    </div>

    
    <div
        class="w-full flex flex-wrap items-center justify-between rounded-lg bg-white border border-gray-200 px-8 py-4 mb-6">
        <div class="w-full flex items-center justify-between">
            <div class="flex items-center gap-4">
                
                <div class="flex items-center justify-center w-16 h-16 rounded-lg bg-white border border-gray-200 p-2">
                    <img src="<?php echo e($product->image_url ?? asset('images/placeholder.png')); ?>" alt="<?php echo e($product->name); ?>"
                        class="w-full h-full object-contain">
                </div>
                <div>
                    <h1 class="text-4xl font-bold"><?php echo e($product->name); ?></h1>
                </div>
            </div>
        </div>

        <div class="w-full flex flex-wrap items-start mt-6">
            <div class="w-1/2 mt-4 flex flex-wrap">
                
                <div class="flex items-center gap-2 w-1/2">
                    <div class="w-10 h-10 border rounded flex items-center justify-center">

                    <img src="<?php echo e(asset('vendor/blade-untitledui-icons/message-text-square.svg')); ?>" alt="Slug"
                        class="w-5 h-5">
                    </div>
                    <div class="flex flex-col">
                        <span class="text-sm font-bold">Slug</span>
                        <span class="text-sm "><?php echo e($product->slug); ?></span>
                    </div>
                </div>

                
                <div class="flex items-center gap-2 w-1/2">
                    <div class="w-10 h-10 border rounded flex items-center justify-center">
                    <img src="<?php echo e(asset('vendor/blade-untitledui-icons/layout-alt.svg')); ?>" alt="Tecnología"
                        class="w-5 h-5">
                    </div>
                    <div class="flex flex-col">
                        <span class="text-sm font-bold">Tecnología</span>
                        <span class="text-sm "><?php echo e($product->tech); ?></span>
                    </div>
                </div>

                
                <div class="flex items-center gap-2 w-1/2 mt-4">
                    <div class="w-10 h-10 border rounded flex items-center justify-center">
                    <img src="<?php echo e(asset('vendor/blade-untitledui-icons/code.svg')); ?>" alt="Tipo"
                        class="w-5 h-5">
                    </div>
                    <div class="flex flex-col">
                        <span class="text-sm font-bold">Tipo</span>
                        <span class="text-sm "><?php echo e($product->type); ?></span>
                    </div>
                </div>

                
                <div class="flex items-center gap-2 w-1/2 mt-4">
                    <div class="w-10 h-10 border rounded flex items-center justify-center">
                    <img src="<?php echo e(asset('vendor/blade-untitledui-icons/activity-heart.svg')); ?>" alt="Estado"
                        class="w-5 h-5">
                    </div>
                    <div class="flex flex-col">
                        <span class="text-sm font-bold">Estado</span>
                        <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($product->actived): ?>
                        <span class="text-sm">Activo</span>
                        <?php else: ?>
                        <span class="text-sm">Inactivo</span>
                        <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                    </div>
                </div>
            </div>
            
            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($product->metadata): ?>
                <div class="w-1/2 mt-4">
                    <span class="text-xs text-gray-500 mb-2 block">Metadata</span>
                    <pre class="bg-gray-100 p-3 rounded text-xs font-mono overflow-x-auto"><?php echo e(json_encode($product->metadata, JSON_PRETTY_PRINT)); ?></pre>
                </div>
            <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
        </div>

    </div>

    
    <div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-6">
        
        <div class="rounded-lg bg-white border border-gray-200 px-6 py-4">
            <h3 class="font-semibold text-lg mb-4">Tokens vinculados</h3>

            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($product->tokens->isEmpty()): ?>
                <p class="text-gray-500 text-sm">No hay tokens vinculados.</p>
            <?php else: ?>
                <ul class="space-y-3">
                    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $product->tokens; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $token): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                        <?php
                            $status = $token->getStatus();
                            // Ofuscar el token: mantener guiones y guiones bajos, reemplazar el resto con asteriscos
                            $maskedToken = preg_replace('/[^-_]/', '*', $token->token);
                        ?>
                        <li class="flex items-center py-2 border-b border-gray-200 last:border-0">
                            <div class="flex flex-col">
                                <div class="flex items-center gap-2 mb-1">
                                    <span class="font-mono text-sm font-bold text-gray-700"><?php echo e($maskedToken); ?></span>
                                </div>
                                <div class="text-sm text-gray-900 mb-1"><?php echo e($token->client->name); ?></div>
                            </div>
                            <div class="flex items-center gap-2 justify-start ml-4">
                                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($status === 'activo'): ?>
                                    <span
                                        class="inline-flex items-center gap-1 text-green-600 font-semibold bg-green-100 border border-green-200 rounded px-2 py-0.5 text-xs">
                                        <img src="<?php echo e(asset('vendor/blade-untitledui-icons/check-circle.svg')); ?>"
                                            alt="Activo" class="w-3 h-3 svg-fill-green">
                                        <span>Activa</span>
                                    </span>
                                <?php elseif($status === 'vencen_pronto'): ?>
                                    <span
                                        class="inline-flex items-center gap-1 text-orange-600 font-semibold bg-orange-100 border border-orange-200 rounded px-2 py-0.5 text-xs">
                                        <img src="<?php echo e(asset('vendor/blade-untitledui-icons/alert-triangle.svg')); ?>"
                                            alt="Vence pronto" class="w-3 h-3 svg-fill-orange">
                                        <span>A Vence pronto</span>
                                    </span>
                                <?php elseif($status === 'vencida'): ?>
                                    <span
                                        class="inline-flex items-center gap-1 text-red-600 font-semibold bg-red-100 border border-red-200 rounded px-2 py-0.5 text-xs">
                                        <img src="<?php echo e(asset('vendor/blade-untitledui-icons/alert-circle.svg')); ?>"
                                            alt="Vencida" class="w-3 h-3 svg-fill-red">
                                        <span>Vencida</span>
                                    </span>
                                <?php else: ?>
                                    <span
                                        class="inline-flex items-center gap-1 text-gray-400 font-semibold bg-gray-100 border border-gray-200 rounded px-2 py-0.5 text-xs">
                                        <img src="<?php echo e(asset('vendor/blade-untitledui-icons/x-circle.svg')); ?>"
                                            alt="Desactivada" class="w-3 h-3 svg-fill-gray">
                                        <span>Desactivada</span>
                                    </span>
                                <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                            </div>
                            <div class="flex items-center gap-2 ml-auto">
                                <button x-data="{ copied: false }"
                                    @click="navigator.clipboard.writeText('<?php echo e($token->token); ?>').then(() => { copied = true; setTimeout(() => copied = false, 2000); })"
                                    class="p-1 hover:bg-gray-100 rounded transition-colors" title="Copiar token">
                                    <img x-show="!copied" src="<?php echo e(asset('vendor/blade-untitledui-icons/copy.svg')); ?>"
                                        alt="Copiar" class="w-5 h-5 svg-fill-gray hover:svg-fill-orange">
                                    <img x-show="copied"
                                        src="<?php echo e(asset('vendor/blade-untitledui-icons/check-circle.svg')); ?>"
                                        alt="Copiado" class="w-5 h-5 svg-fill-green">
                                </button>
                                <a href="<?php echo e(route('license_tokens.show', $token)); ?>"
                                    class="p-1 hover:bg-gray-100 rounded transition-colors" title="Ir a token">
                                    <img src="<?php echo e(asset('vendor/blade-untitledui-icons/arrow-narrow-right.svg')); ?>"
                                        alt="Ir" class="w-5 h-5 svg-fill-gray hover:svg-fill-orange">
                                </a>
                            </div>
                        </li>
                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                </ul>
            <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
        </div>

        
        <div class="rounded-lg bg-white border border-gray-200 px-6 py-4">
            <h3 class="font-semibold text-lg mb-4">Entornos donde está instalado</h3>

            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($product->environments->isEmpty()): ?>
                <p class="text-gray-500 text-sm">Este producto no está vinculado a ningún entorno.</p>
            <?php else: ?>
                <ul class="space-y-3">
                    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $product->environments; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $environment): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                        <li class="flex items-start gap-3 py-2 border-b border-gray-200 last:border-0">
                            <div
                                class="flex items-center justify-center w-10 h-10 rounded-full border border-gray-200 flex-shrink-0">
                                <img src="<?php echo e($environment->type->image_url ?? asset('images/placeholder.png')); ?>"
                                    alt="<?php echo e($environment->type->name ?? 'Environment'); ?>"
                                    class="w-8 h-8 rounded-full object-contain">
                            </div>
                            <div class="flex-1 min-w-0">
                                <div class="font-bold text-sm mb-1"><?php echo e($environment->name); ?></div>
                                <div class="flex items-center gap-2 mb-1">
                                    <?php
                                        $envStatus = $environment->env ?? 'pro';
                                        $envLabels = [
                                            'pro' => 'Producción',
                                            'pre' => 'PreProducción',
                                            'develop' => 'Desarrollo',
                                            'local' => 'Local',
                                        ];
                                        $envLabel = $envLabels[$envStatus] ?? 'Producción';
                                        $isProduction = $envStatus === 'pro';
                                    ?>
                                    <span
                                        class="inline-flex items-center gap-1 <?php echo e($isProduction ? 'text-green-600 font-semibold bg-green-100 border border-green-200' : 'text-gray-500 font-semibold bg-gray-100 border border-gray-200'); ?> rounded px-2 py-0.5 text-xs">
                                        <span><?php echo e($envLabel); ?></span>
                                    </span>
                                </div>
                                <div class="text-xs text-gray-600 mb-1">
                                    <?php echo e($environment->version ?? 'N/A'); ?> Servidor interno
                                </div>
                                <a href="<?php echo e($environment->domain); ?>" target="_blank"
                                    class="text-xs text-blue-600 hover:text-blue-800 flex items-center gap-1 mt-1">
                                    <img src="<?php echo e(asset('vendor/blade-untitledui-icons/globe.svg')); ?>" alt="URL"
                                        class="w-3 h-3">
                                    <span class="truncate"><?php echo e($environment->domain); ?></span>
                                </a>
                            </div>
                        </li>
                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                </ul>
            <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
        </div>
    </div>

    
    <div class="w-full border-b border-gray-200 mb-6">
        <div class="flex items-center justify-start gap-8">
            <button @click="activeTab = 'setups'"
                class="relative pb-2 transition-colors duration-200 <?php echo e($this->setups->isEmpty() ? '' : ''); ?>"
                :class="activeTab === 'setups' ? 'text-gray-800 font-semibold' :
                    'text-gray-500 font-normal hover:text-gray-700'">
                <span>Setups de configuración</span>
                <div x-show="activeTab === 'setups'" class="absolute bottom-0 left-0 right-0 h-1 bg-orange-600"></div>
            </button>
            <button @click="activeTab = 'scss'" class="relative pb-2 transition-colors duration-200"
                :class="activeTab === 'scss' ? 'text-gray-800 font-semibold' :
                    'text-gray-500 font-normal hover:text-gray-700'">
                <span>Archivos SCSS</span>
                <div x-show="activeTab === 'scss'" class="absolute bottom-0 left-0 right-0 h-1 bg-orange-600"></div>
            </button>
            <button @click="activeTab = 'js'" class="relative pb-2 transition-colors duration-200"
                :class="activeTab === 'js' ? 'text-gray-800 font-semibold' :
                    'text-gray-500 font-normal hover:text-gray-700'">
                <span>Archivos JS</span>
                <div x-show="activeTab === 'js'" class="absolute bottom-0 left-0 right-0 h-1 bg-orange-600"></div>
            </button>
            <button @click="activeTab = 'scss-cdn'" class="relative pb-2 transition-colors duration-200"
                :class="activeTab === 'scss-cdn' ? 'text-gray-800 font-semibold' :
                    'text-gray-500 font-normal hover:text-gray-700'">
                <span>Bundless SCSS CDN</span>
                <div x-show="activeTab === 'scss-cdn'" class="absolute bottom-0 left-0 right-0 h-1 bg-orange-600"></div>
            </button>
            <button @click="activeTab = 'features'" class="relative pb-2 transition-colors duration-200"
                :class="activeTab === 'features' ? 'text-gray-800 font-semibold' :
                    'text-gray-500 font-normal hover:text-gray-700'">
                <span>Features</span>
                <div x-show="activeTab === 'features'" class="absolute bottom-0 left-0 right-0 h-1 bg-orange-600"></div>
            </button>
            <button @click="activeTab = 'recursos'" class="relative pb-2 transition-colors duration-200"
                :class="activeTab === 'recursos' ? 'text-gray-800 font-semibold' :
                    'text-gray-500 font-normal hover:text-gray-700'">
                <span>Recursos</span>
                <div x-show="activeTab === 'recursos'" class="absolute bottom-0 left-0 right-0 h-1 bg-orange-600"></div>
            </button>
            <button @click="activeTab = 'tutoriales'" class="relative pb-2 transition-colors duration-200"
                :class="activeTab === 'tutoriales' ? 'text-gray-800 font-semibold' :
                    'text-gray-500 font-normal hover:text-gray-700'">
                <span>Tutoriales</span>
                <div x-show="activeTab === 'tutoriales'" class="absolute bottom-0 left-0 right-0 h-1 bg-orange-600"></div>
            </button>
        </div>
    </div>

    
    <div class="w-full">
        
        <div x-show="activeTab === 'setups'" x-cloak>
            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($this->setups->isEmpty()): ?>
                <div
                    class="flex flex-col items-center justify-center py-12 px-4 bg-white border border-gray-200 rounded-lg">
                    <div class="w-24 h-24 mb-4 flex items-center justify-center">
                        <div class="w-16 h-16 bg-gray-100 rounded-lg flex items-center justify-center">
                            <img src="<?php echo e(asset('vendor/blade-untitledui-icons/monitor.svg')); ?>" alt="Monitor"
                                class="w-10 h-10 svg-fill-gray">
                        </div>
                    </div>
                    <p class="text-gray-500 text-sm mb-4">No hay setup configurado para este producto.</p>
                    <?php if (app(\Illuminate\Contracts\Auth\Access\Gate::class)->check('admin.setups.create')): ?>
                    <a href="<?php echo e(route('products.setups.create', $product)); ?>"
                        class="rounded bg-orange-600 px-4 py-2 text-sm text-white hover:bg-red-700 font-semibold">
                        Crear setup
                    </a>
                    <?php endif; ?>
                </div>
            <?php else: ?>
                <div class="bg-white border border-gray-200 rounded-lg overflow-hidden">
                    <div class="overflow-x-auto">
                        <table class="min-w-full text-sm">
                            <thead class="bg-gray-100 text-xs uppercase text-gray-600">
                                <tr>
                                    <th class="px-3 py-2 text-left">Versión</th>
                                    <th class="px-3 py-2 text-left">Estado</th>
                                    <th class="px-3 py-2 text-left">Creado por</th>
                                    <th class="px-3 py-2 text-left">Fecha</th>
                                    <th class="px-3 py-2 text-right">Acciones</th>
                                </tr>
                            </thead>
                            <tbody class="divide-y">
                                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $this->setups; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $setup): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                    <tr class="hover:bg-gray-50">
                                        <td class="px-3 py-2 font-mono"><?php echo e($setup->version); ?></td>
                                        <td class="px-3 py-2">
                                            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($setup->status === 'active'): ?>
                                                <span class="text-green-600 font-bold text-xs">Activo</span>
                                            <?php else: ?>
                                                <span class="text-gray-500 text-xs">Deprecado</span>
                                            <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                                        </td>
                                        <td class="px-3 py-2"><?php echo e($setup->creator?->name ?? 'N/A'); ?></td>
                                        <td class="px-3 py-2"><?php echo e($setup->created_at->format('Y-m-d')); ?></td>
                                        <td class="px-3 py-2 text-right">
                                            <a href="<?php echo e(route('products.setups.index', $product)); ?>"
                                                class="text-indigo-600 text-xs hover:text-indigo-800">
                                                Ver todos →
                                            </a>
                                        </td>
                                    </tr>
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                            </tbody>
                        </table>
                    </div>
                </div>
            <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
        </div>

        
        <div x-show="activeTab === 'scss'" x-cloak>
            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($this->scssVersions->isEmpty()): ?>
                <div
                    class="flex flex-col items-center justify-center py-12 px-4 bg-white border border-gray-200 rounded-lg">
                    <p class="text-gray-500 text-sm mb-4">No hay archivos SCSS configurados para este producto.</p>
                    <a href="<?php echo e(route('products.scss.index', $product)); ?>"
                        class="rounded bg-orange-600 px-4 py-2 text-sm text-white hover:bg-orange-700 font-semibold">
                        Gestionar SCSS
                    </a>
                </div>
            <?php else: ?>
                <div class="bg-white border border-gray-200 rounded-lg overflow-hidden">
                    <div class="overflow-x-auto">
                        <table class="min-w-full text-sm">
                            <thead class="bg-gray-100 text-xs uppercase text-gray-600">
                                <tr>
                                    <th class="px-3 py-2 text-left">Versión</th>
                                    <th class="px-3 py-2 text-left">Archivos</th>
                                    <th class="px-3 py-2 text-left">Creado por</th>
                                    <th class="px-3 py-2 text-left">Fecha</th>
                                    <th class="px-3 py-2 text-right">Acciones</th>
                                </tr>
                            </thead>
                            <tbody class="divide-y">
                                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $this->scssVersions; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $scssVersion): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                    <tr class="hover:bg-gray-50">
                                        <td class="px-3 py-2 font-mono"><?php echo e($scssVersion->version); ?></td>
                                        <td class="px-3 py-2">
                                            <span class="px-2 py-1 bg-blue-100 text-blue-800 rounded text-xs">
                                                <?php echo e($scssVersion->files_count); ?> archivo(s)
                                            </span>
                                        </td>
                                        <td class="px-3 py-2"><?php echo e($scssVersion->creator?->name ?? 'N/A'); ?></td>
                                        <td class="px-3 py-2"><?php echo e($scssVersion->created_at->format('Y-m-d')); ?></td>
                                        <td class="px-3 py-2 text-right">
                                            <a href="<?php echo e(route('products.scss.index', $product)); ?>"
                                                class="text-indigo-600 text-xs hover:text-indigo-800">
                                                Gestionar SCSS →
                                            </a>
                                        </td>
                                    </tr>
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                            </tbody>
                        </table>
                    </div>
                </div>
            <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
        </div>

        
        <div x-show="activeTab === 'js'" x-cloak>
            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($this->jsVersions->isEmpty()): ?>
                <div
                    class="flex flex-col items-center justify-center py-12 px-4 bg-white border border-gray-200 rounded-lg">
                    <p class="text-gray-500 text-sm mb-4">No hay archivos JS configurados para este producto.</p>
                    <a href="<?php echo e(route('products.js.index', $product)); ?>"
                        class="rounded bg-orange-600 px-4 py-2 text-sm text-white hover:bg-orange-700 font-semibold">
                        Gestionar JS
                    </a>
                </div>
            <?php else: ?>
                <div class="bg-white border border-gray-200 rounded-lg overflow-hidden">
                    <div class="overflow-x-auto">
                        <table class="min-w-full text-sm">
                            <thead class="bg-gray-100 text-xs uppercase text-gray-600">
                                <tr>
                                    <th class="px-3 py-2 text-left">Versión</th>
                                    <th class="px-3 py-2 text-left">Archivos</th>
                                    <th class="px-3 py-2 text-left">Creado por</th>
                                    <th class="px-3 py-2 text-left">Fecha</th>
                                    <th class="px-3 py-2 text-right">Acciones</th>
                                </tr>
                            </thead>
                            <tbody class="divide-y">
                                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $this->jsVersions; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $jsVersion): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                    <tr class="hover:bg-gray-50">
                                        <td class="px-3 py-2 font-mono"><?php echo e($jsVersion->version); ?></td>
                                        <td class="px-3 py-2">
                                            <span class="px-2 py-1 bg-blue-100 text-blue-800 rounded text-xs">
                                                <?php echo e($jsVersion->files_count); ?> archivo(s)
                                            </span>
                                        </td>
                                        <td class="px-3 py-2"><?php echo e($jsVersion->creator?->name ?? 'N/A'); ?></td>
                                        <td class="px-3 py-2"><?php echo e($jsVersion->created_at->format('Y-m-d')); ?></td>
                                        <td class="px-3 py-2 text-right">
                                            <a href="<?php echo e(route('products.js.index', $product)); ?>"
                                                class="text-indigo-600 text-xs hover:text-indigo-800">
                                                Gestionar JS →
                                            </a>
                                        </td>
                                    </tr>
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                            </tbody>
                        </table>
                    </div>
                </div>
            <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
        </div>

        
        <div x-show="activeTab === 'scss-cdn'" x-cloak>
            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($this->scssCdnBundles->isEmpty()): ?>
                <div
                    class="flex flex-col items-center justify-center py-12 px-4 bg-white border border-gray-200 rounded-lg">
                    <p class="text-gray-500 text-sm mb-4">No hay bundles SCSS CDN configurados para este producto.</p>
                    <a href="<?php echo e(route('products.scss-cdn.index', $product)); ?>"
                        class="rounded bg-orange-600 px-4 py-2 text-sm text-white hover:bg-orange-700 font-semibold">
                        Gestionar SCSS CDN
                    </a>
                </div>
            <?php else: ?>
                <div class="bg-white border border-gray-200 rounded-lg overflow-hidden">
                    <div class="overflow-x-auto">
                        <table class="min-w-full text-sm">
                            <thead class="bg-gray-100 text-xs uppercase text-gray-600">
                                <tr>
                                    <th class="px-3 py-2 text-left">Versión</th>
                                    <th class="px-3 py-2 text-left">Archivos</th>
                                    <th class="px-3 py-2 text-left">Creado por</th>
                                    <th class="px-3 py-2 text-left">Fecha</th>
                                    <th class="px-3 py-2 text-right">Acciones</th>
                                </tr>
                            </thead>
                            <tbody class="divide-y">
                                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $this->scssCdnBundles; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $bundle): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                    <tr class="hover:bg-gray-50">
                                        <td class="px-3 py-2 font-mono"><?php echo e($bundle->version); ?></td>
                                        <td class="px-3 py-2">
                                            <span class="px-2 py-1 bg-purple-100 text-purple-800 rounded text-xs">
                                                <?php echo e($bundle->files_count); ?> archivo(s)
                                            </span>
                                        </td>
                                        <td class="px-3 py-2"><?php echo e($bundle->creator?->name ?? 'N/A'); ?></td>
                                        <td class="px-3 py-2"><?php echo e($bundle->created_at->format('Y-m-d')); ?></td>
                                        <td class="px-3 py-2 text-right">
                                            <a href="<?php echo e(route('products.scss-cdn.index', $product)); ?>"
                                                class="text-indigo-600 text-xs hover:text-indigo-800">
                                                Gestionar SCSS CDN →
                                            </a>
                                        </td>
                                    </tr>
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                            </tbody>
                        </table>
                    </div>
                </div>
            <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
        </div>

        
        <div x-show="activeTab === 'features'" x-cloak>
            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($this->featureVersions->isEmpty()): ?>
                <div
                    class="flex flex-col items-center justify-center py-12 px-4 bg-white border border-gray-200 rounded-lg">
                    <p class="text-gray-500 text-sm mb-4">No hay versiones de features configuradas para este producto.
                    </p>
                    <a href="<?php echo e(route('products.features.version.create', $product)); ?>"
                        class="rounded bg-orange-600 px-4 py-2 text-sm text-white hover:bg-orange-700 font-semibold">
                        Crear la primera versión
                    </a>
                </div>
            <?php else: ?>
                <div class="bg-white border border-gray-200 rounded-lg overflow-hidden">
                    <div class="overflow-x-auto">
                        <table class="min-w-full text-sm">
                            <thead class="bg-gray-100 text-xs uppercase text-gray-600">
                                <tr>
                                    <th class="px-3 py-2 text-left">Versión</th>
                                    <th class="px-3 py-2 text-left">Features</th>
                                    <th class="px-3 py-2 text-left">Descripción</th>
                                    <th class="px-3 py-2 text-left">Creado por</th>
                                    <th class="px-3 py-2 text-left">Fecha</th>
                                    <th class="px-3 py-2 text-right">Acciones</th>
                                </tr>
                            </thead>
                            <tbody class="divide-y">
                                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $this->featureVersions; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $featureVersion): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                    <tr class="hover:bg-gray-50">
                                        <td class="px-3 py-2 font-mono"><?php echo e($featureVersion->version); ?></td>
                                        <td class="px-3 py-2">
                                            <span class="px-2 py-1 bg-blue-100 text-blue-800 rounded text-xs">
                                                <?php echo e($featureVersion->features_count); ?> feature(s)
                                            </span>
                                        </td>
                                        <td class="px-3 py-2">
                                            <?php echo e($featureVersion->description ? Str::limit($featureVersion->description, 50) : '—'); ?>

                                        </td>
                                        <td class="px-3 py-2"><?php echo e($featureVersion->creator?->name ?? 'N/A'); ?></td>
                                        <td class="px-3 py-2"><?php echo e($featureVersion->created_at->format('Y-m-d')); ?></td>
                                        <td class="px-3 py-2 text-right">
                                            <a href="<?php echo e(route('products.features.version.show', [$product, $featureVersion])); ?>"
                                                class="text-indigo-600 text-xs hover:text-indigo-800">
                                                Ver versión →
                                            </a>
                                        </td>
                                    </tr>
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                            </tbody>
                        </table>
                    </div>
                </div>
            <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
        </div>

        
        <div x-show="activeTab === 'recursos'" x-cloak>
            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($this->resourceVersions->isEmpty()): ?>
                <div
                    class="flex flex-col items-center justify-center py-12 px-4 bg-white border border-gray-200 rounded-lg">
                    <p class="text-gray-500 text-sm mb-4">No hay versiones de recursos configuradas para este producto.
                    </p>
                    <a href="<?php echo e(route('products.resources.version.create', $product)); ?>"
                        class="rounded bg-orange-600 px-4 py-2 text-sm text-white hover:bg-orange-700 font-semibold">
                        Crear la primera versión
                    </a>
                </div>
            <?php else: ?>
                <div class="bg-white border border-gray-200 rounded-lg overflow-hidden">
                    <div class="overflow-x-auto">
                        <table class="min-w-full text-sm">
                            <thead class="bg-gray-100 text-xs uppercase text-gray-600">
                                <tr>
                                    <th class="px-3 py-2 text-left">Versión</th>
                                    <th class="px-3 py-2 text-left">Recursos</th>
                                    <th class="px-3 py-2 text-left">Descripción</th>
                                    <th class="px-3 py-2 text-left">Creado por</th>
                                    <th class="px-3 py-2 text-left">Fecha</th>
                                    <th class="px-3 py-2 text-right">Acciones</th>
                                </tr>
                            </thead>
                            <tbody class="divide-y">
                                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $this->resourceVersions; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $resourceVersion): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                    <tr class="hover:bg-gray-50">
                                        <td class="px-3 py-2 font-mono"><?php echo e($resourceVersion->version); ?></td>
                                        <td class="px-3 py-2">
                                            <span class="px-2 py-1 bg-blue-100 text-blue-800 rounded text-xs">
                                                <?php echo e($resourceVersion->resources_count); ?> recurso(s)
                                            </span>
                                        </td>
                                        <td class="px-3 py-2">
                                            <?php echo e($resourceVersion->description ? Str::limit($resourceVersion->description, 50) : '—'); ?>

                                        </td>
                                        <td class="px-3 py-2"><?php echo e($resourceVersion->creator?->name ?? 'N/A'); ?></td>
                                        <td class="px-3 py-2"><?php echo e($resourceVersion->created_at->format('Y-m-d')); ?></td>
                                        <td class="px-3 py-2 text-right">
                                            <a href="<?php echo e(route('products.resources.version.show', [$product, $resourceVersion])); ?>"
                                                class="text-indigo-600 text-xs hover:text-indigo-800">
                                                Ver versión →
                                            </a>
                                        </td>
                                    </tr>
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                            </tbody>
                        </table>
                    </div>
                </div>
            <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
        </div>

        
        <div x-show="activeTab === 'tutoriales'" x-cloak>
            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($this->tutorialVersions->isEmpty()): ?>
                <div
                    class="flex flex-col items-center justify-center py-12 px-4 bg-white border border-gray-200 rounded-lg">
                    <p class="text-gray-500 text-sm mb-4">No hay versiones de tutoriales configuradas para este producto.
                    </p>
                    <a href="<?php echo e(route('products.tutorials.version.create', $product)); ?>"
                        class="rounded bg-orange-600 px-4 py-2 text-sm text-white hover:bg-orange-700 font-semibold">
                        Crear la primera versión
                    </a>
                </div>
            <?php else: ?>
                <div class="bg-white border border-gray-200 rounded-lg overflow-hidden">
                    <div class="overflow-x-auto">
                        <table class="min-w-full text-sm">
                            <thead class="bg-gray-100 text-xs uppercase text-gray-600">
                                <tr>
                                    <th class="px-3 py-2 text-left">Versión</th>
                                    <th class="px-3 py-2 text-left">Tutoriales</th>
                                    <th class="px-3 py-2 text-left">Descripción</th>
                                    <th class="px-3 py-2 text-left">Creado por</th>
                                    <th class="px-3 py-2 text-left">Fecha</th>
                                    <th class="px-3 py-2 text-right">Acciones</th>
                                </tr>
                            </thead>
                            <tbody class="divide-y">
                                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php $__currentLoopData = $this->tutorialVersions; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $tutorialVersion): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                    <tr class="hover:bg-gray-50">
                                        <td class="px-3 py-2 font-mono"><?php echo e($tutorialVersion->version); ?></td>
                                        <td class="px-3 py-2">
                                            <span class="px-2 py-1 bg-blue-100 text-blue-800 rounded text-xs">
                                                <?php echo e($tutorialVersion->tutorials_count); ?> tutorial(es)
                                            </span>
                                        </td>
                                        <td class="px-3 py-2">
                                            <?php echo e($tutorialVersion->description ? Str::limit($tutorialVersion->description, 50) : '—'); ?>

                                        </td>
                                        <td class="px-3 py-2"><?php echo e($tutorialVersion->creator?->name ?? 'N/A'); ?></td>
                                        <td class="px-3 py-2"><?php echo e($tutorialVersion->created_at->format('Y-m-d')); ?></td>
                                        <td class="px-3 py-2 text-right">
                                            <a href="<?php echo e(route('products.tutorials.version.show', [$product, $tutorialVersion])); ?>"
                                                class="text-indigo-600 text-xs hover:text-indigo-800">
                                                Ver versión →
                                            </a>
                                        </td>
                                    </tr>
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                            </tbody>
                        </table>
                    </div>
                </div>
            <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
        </div>
    </div>
</div><?php /**PATH /var/www/html/resources/views/livewire/products/show.blade.php ENDPATH**/ ?>