@extends('layouts.dashboard')

@section('title', 'Subscription Details')
@section('header', 'Subscription Details')

@section('sidebar')
@include('super-admin.partials.sidebar')
@endsection

@section('content')
<div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-6">
    <div class="bg-white rounded-lg shadow p-6">
        <h3 class="text-lg font-semibold mb-4">Company Information</h3>
        <dl class="space-y-2">
            <div>
                <dt class="text-sm text-gray-500">Company</dt>
                <dd class="text-sm font-medium">{{ $subscription->company->name }}</dd>
            </div>
            <div>
                <dt class="text-sm text-gray-500">Email</dt>
                <dd class="text-sm font-medium">{{ $subscription->company->email }}</dd>
            </div>
        </dl>
    </div>

    <div class="bg-white rounded-lg shadow p-6">
        <h3 class="text-lg font-semibold mb-4">Subscription Details</h3>
        <dl class="space-y-2">
            <div>
                <dt class="text-sm text-gray-500">Plan</dt>
                <dd class="text-sm font-medium">{{ $subscription->plan->name }}</dd>
            </div>
            <div>
                <dt class="text-sm text-gray-500">Price</dt>
                <dd class="text-sm font-medium">{{ number_format($subscription->plan->price, 0) }} {{ $subscription->plan->currency }}/{{ $subscription->plan->interval }}</dd>
            </div>
            <div>
                <dt class="text-sm text-gray-500">Status</dt>
                <dd>
                    <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full 
                        {{ $subscription->status === 'active' ? 'bg-green-100 text-green-800' : 
                           ($subscription->status === 'suspended' ? 'bg-yellow-100 text-yellow-800' : 'bg-red-100 text-red-800') }}">
                        {{ ucfirst($subscription->status) }}
                    </span>
                </dd>
            </div>
            <div>
                <dt class="text-sm text-gray-500">Start Date</dt>
                <dd class="text-sm font-medium">{{ \Carbon\Carbon::parse($subscription->starts_at)->format('M d, Y') }}</dd>
            </div>
            <div>
                <dt class="text-sm text-gray-500">End Date</dt>
                <dd class="text-sm font-medium">{{ \Carbon\Carbon::parse($subscription->ends_at)->format('M d, Y') }}</dd>
            </div>
        </dl>
    </div>
</div>

<!-- Actions -->
<div class="bg-white rounded-lg shadow p-6">
    <h3 class="text-lg font-semibold mb-4">Actions</h3>
    <div class="flex flex-wrap gap-2">
        @if($subscription->status === 'active')
        <form action="{{ route('super-admin.subscriptions.suspend', $subscription) }}" method="POST" class="inline">
            @csrf
            <button type="submit" class="bg-yellow-600 text-white px-4 py-2 rounded-md hover:bg-yellow-700">
                Suspend
            </button>
        </form>
        @else
        <form action="{{ route('super-admin.subscriptions.activate', $subscription) }}" method="POST" class="inline">
            @csrf
            <button type="submit" class="bg-green-600 text-white px-4 py-2 rounded-md hover:bg-green-700">
                Activate
            </button>
        </form>
        @endif
        <form action="{{ route('super-admin.subscriptions.renew', $subscription) }}" method="POST" class="inline">
            @csrf
            <button type="submit" class="bg-purple-600 text-white px-4 py-2 rounded-md hover:bg-purple-700">
                Renew
            </button>
        </form>
        <form action="{{ route('super-admin.subscriptions.cancel', $subscription) }}" method="POST" class="inline" onsubmit="return confirm('Are you sure you want to cancel this subscription?');">
            @csrf
            <button type="submit" class="bg-red-600 text-white px-4 py-2 rounded-md hover:bg-red-700">
                Cancel
            </button>
        </form>
    </div>
</div>

<div class="mt-6">
    <a href="{{ route('super-admin.subscriptions.index') }}" class="bg-gray-300 text-gray-700 px-4 py-2 rounded-md hover:bg-gray-400">
        Back to Subscriptions
    </a>
</div>
@endsection