@extends('layouts.admin')
@section('title', __('admin.plans'))

@section('admin_content')
<div class="mb-6 flex items-center justify-between">
    <h1 class="font-display text-2xl font-bold">{{ __('admin.plans') }}</h1>
    <a href="{{ route('admin.plans.create') }}" class="btn-primary">+ {{ __('admin.new_plan') }}</a>
</div>

<div class="overflow-x-auto rounded-lg border border-ink/10 bg-white">
    <table class="w-full text-sm">
        <thead class="bg-forest text-cream"><tr><th class="p-3 text-left">{{ __('admin.name') }}</th><th class="p-3 text-left">{{ __('admin.feature') }}</th><th class="p-3 text-left">{{ __('admin.cycle') }}</th><th class="p-3 text-left">{{ __('admin.price') }}</th><th class="p-3 text-left">{{ __('admin.free_now') }}?</th><th class="p-3 text-left">{{ __('admin.active') }}</th><th class="p-3 text-left"></th></tr></thead>
        <tbody class="divide-y divide-ink/10">
            @foreach ($plans as $plan)
                <tr>
                    <td class="p-3"><a href="{{ route('admin.plans.edit', $plan) }}" class="hover:text-forest">{{ $plan->name }}</a></td>
                    <td class="p-3 text-xs">{{ $plan->feature }}{{ $plan->role_slug ? " ({$plan->role_slug})" : '' }}</td>
                    <td class="p-3 text-xs">{{ $plan->billing_cycle }}</td>
                    <td class="p-3 font-mono">{{ number_format($plan->price, 0) }} {{ $plan->currency }}</td>
                    <td class="p-3">
                        <form action="{{ route('admin.plans.toggle-free', $plan) }}" method="POST">
                            @csrf
                            <button class="status-pill {{ $plan->is_free ? 'bg-gold/30 text-gold-dark' : 'bg-ink/10 text-ink/50' }}">{{ $plan->is_free ? __('admin.free_now') : __('admin.paid') }}</button>
                        </form>
                    </td>
                    <td class="p-3">
                        <form action="{{ route('admin.plans.toggle-active', $plan) }}" method="POST">
                            @csrf
                            <button class="status-pill {{ $plan->is_active ? 'bg-green-100 text-green-800' : 'bg-red-100 text-red-800' }}">{{ $plan->is_active ? __('admin.active') : __('admin.disabled') }}</button>
                        </form>
                    </td>
                    <td class="p-3"><a href="{{ route('admin.plans.edit', $plan) }}" class="text-forest hover:underline">{{ __('admin.edit') }}</a></td>
                </tr>
            @endforeach
        </tbody>
    </table>
</div>
@endsection