@extends('layouts.admin')
@section('title', 'Planes de Licencia — Admin')

@section('content')
<div class="flex items-center justify-between mb-8">
    <h1 class="text-2xl font-bold">📦 Planes de Licencia</h1>
    <a href="{{ route('admin.plan.create') }}" class="px-4 py-2 bg-blue-600 hover:bg-blue-700 rounded-lg text-sm font-medium transition">
        <i class="fas fa-plus mr-1"></i> Nuevo Plan
    </a>
</div>

@if(session('success'))
<div class="bg-green-500/20 border border-green-500/30 rounded-lg p-4 text-green-400 text-sm mb-6">
    {{ session('success') }}
</div>
@endif

@if(session('error'))
<div class="bg-red-500/20 border border-red-500/30 rounded-lg p-4 text-red-400 text-sm mb-6">
    {{ session('error') }}
</div>
@endif

<!-- Plans Grid -->
<div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
    @forelse($plans as $plan)
    <div class="bg-gray-900 rounded-xl border border-gray-800 overflow-hidden {{ !$plan->is_active ? 'opacity-60' : '' }}">
        <!-- Header -->
        <div class="p-6 border-b border-gray-800">
            <div class="flex items-center justify-between mb-2">
                <h2 class="text-xl font-bold">{{ $plan->name }}</h2>
                @if(!$plan->is_active)
                <span class="px-2 py-0.5 rounded text-xs font-medium bg-yellow-500/20 text-yellow-400">Inactivo</span>
                @endif
            </div>
            <p class="text-gray-500 text-sm">{{ $plan->description }}</p>
            <div class="mt-4">
                <span class="text-3xl font-bold">${{ number_format($plan->price, 2) }}</span>
                <span class="text-gray-500 text-sm">{{ $plan->currency }} / {{ $plan->duration_days }} días</span>
            </div>
        </div>

        <!-- Limits -->
        <div class="px-6 py-4 border-b border-gray-800">
            <div class="flex items-center justify-between text-sm mb-2">
                <span class="text-gray-400">Dominios</span>
                <span class="font-medium">{{ $plan->max_domains === 0 ? '♾️ Ilimitados' : $plan->max_domains }}</span>
            </div>
            <div class="flex items-center justify-between text-sm mb-2">
                <span class="text-gray-400">Cambios de dominio</span>
                <span class="font-medium">{{ $plan->max_domain_changes }}</span>
            </div>
            <div class="flex items-center justify-between text-sm">
                <span class="text-gray-400">Licencias activas</span>
                <span class="font-medium text-blue-400">{{ $plan->licenses_count }}</span>
            </div>
        </div>

        <!-- Features -->
        <div class="px-6 py-4 border-b border-gray-800">
            <p class="text-xs text-gray-500 uppercase tracking-wider mb-3">Features incluidas</p>
            @php $availableFeatures = \App\Models\LicensePlan::AVAILABLE_FEATURES; @endphp
            @foreach($availableFeatures as $key => $label)
            <div class="flex items-center gap-2 text-sm mb-1.5">
                @if($plan->hasFeature($key))
                <i class="fas fa-check-circle text-green-500 text-xs"></i>
                <span class="text-gray-300">{{ $label }}</span>
                @else
                <i class="fas fa-times-circle text-gray-700 text-xs"></i>
                <span class="text-gray-600">{{ $label }}</span>
                @endif
            </div>
            @endforeach
        </div>

        <!-- Actions -->
        <div class="px-6 py-4 flex items-center gap-2">
            <a href="{{ route('admin.plan.edit', $plan->id) }}"
               class="flex-1 text-center px-3 py-2 bg-gray-800 hover:bg-gray-700 rounded-lg text-sm transition">
                <i class="fas fa-edit mr-1"></i> Editar
            </a>
            @if($plan->licenses_count === 0)
            <form method="POST" action="{{ route('admin.plan.destroy', $plan->id) }}" class="inline"
                  onsubmit="return confirm('¿Eliminar plan {{ $plan->name }}?')">
                @csrf @method('DELETE')
                <button class="px-3 py-2 bg-red-500/20 hover:bg-red-500/30 text-red-400 rounded-lg text-sm transition">
                    <i class="fas fa-trash"></i>
                </button>
            </form>
            @endif
        </div>
    </div>
    @empty
    <div class="col-span-3 bg-gray-900 rounded-xl border border-gray-800 p-12 text-center text-gray-600">
        <i class="fas fa-box-open text-4xl mb-3"></i>
        <p>No hay planes configurados</p>
        <a href="{{ route('admin.plan.create') }}" class="text-blue-400 hover:underline text-sm mt-2 inline-block">Crear primer plan</a>
    </div>
    @endforelse
</div>

<!-- Info -->
<div class="mt-8 bg-gray-900/50 rounded-xl border border-gray-800 p-6">
    <h3 class="font-semibold mb-2"><i class="fas fa-info-circle text-blue-400 mr-1"></i> Features gratuitas (sin licencia)</h3>
    <p class="text-sm text-gray-500">
        Login Monitor, Comment Guard, Security Headers, GZIP Compression, HTML Minification —
        estas funciones siempre están disponibles para todos los usuarios, independientemente del plan.
        Los features de la tabla solo aplican a funcionalidad premium.
    </p>
</div>
@endsection