@extends('layouts.app')

@section('title', 'Approve request')
@section('heading', 'Approve offline request')

@section('content')
@php
    $input = 'mt-1 w-full rounded-xl border border-slate-200 bg-white px-3 py-2.5 text-sm text-slate-900 focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/20';
    $defaultLicence = $subscriptionRequest->is_upgrade && $subscriptionRequest->company?->licence_expire_on
        ? $subscriptionRequest->company->licence_expire_on->format('Y-m-d')
        : now()->addYear()->format('Y-m-d');
@endphp
<div class="mx-auto max-w-2xl">
    <x-superadmin.page-header
        eyebrow="Billing"
        title="Approve request"
        subtitle="Confirm licence date and record the offline payment."
    />

    <div class="mb-4 grid gap-3 sm:grid-cols-2">
        <div class="rounded-xl border border-slate-200 bg-slate-50/80 px-4 py-3">
            <p class="text-[11px] font-semibold uppercase tracking-wide text-slate-400">Company</p>
            <p class="mt-1 text-sm font-semibold text-slate-900">{{ $subscriptionRequest->company?->name }}</p>
        </div>
        <div class="rounded-xl border border-slate-200 bg-slate-50/80 px-4 py-3">
            <p class="text-[11px] font-semibold uppercase tracking-wide text-slate-400">Plan</p>
            <p class="mt-1 text-sm font-semibold text-slate-900">
                {{ $subscriptionRequest->subscriptionPlan?->name }}
                @if($subscriptionRequest->is_upgrade)
                    <span class="ml-1 text-xs font-bold uppercase text-primary">Upgrade</span>
                @endif
            </p>
        </div>
        <div class="rounded-xl border border-slate-200 bg-slate-50/80 px-4 py-3">
            <p class="text-[11px] font-semibold uppercase tracking-wide text-slate-400">Amount</p>
            <p class="mt-1 text-sm font-semibold text-slate-900">{{ config('app.currency_symbol', '₹') }}{{ number_format($subscriptionRequest->calculated_total ?: $subscriptionRequest->amount, 2) }}</p>
        </div>
        <div class="rounded-xl border border-slate-200 bg-slate-50/80 px-4 py-3">
            <p class="text-[11px] font-semibold uppercase tracking-wide text-slate-400">Details</p>
            <p class="mt-1 text-sm font-semibold text-slate-900">
                Yearly · {{ $subscriptionRequest->employee_count ?? 1 }} seats
                @if($subscriptionRequest->coupon_code)
                    · {{ $subscriptionRequest->coupon_code }}
                @endif
            </p>
        </div>
    </div>

    <div class="rounded-2xl border border-slate-200 bg-white p-5 shadow-sm sm:p-6">
        <form action="{{ route('superadmin.offline-requests.approve.store', $subscriptionRequest) }}" method="post" class="space-y-5">
            @csrf
            <div>
                <label for="licence_expire_on" class="block text-sm font-medium text-slate-700">Licence expire on</label>
                <input type="date" name="licence_expire_on" id="licence_expire_on" value="{{ old('licence_expire_on', $defaultLicence) }}" class="{{ $input }}">
                <p class="mt-1 text-xs text-slate-500">Keep current date for upgrades. Defaults to +1 year for renewals.</p>
                @error('licence_expire_on') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
            </div>
            <div>
                <label for="paid_at" class="block text-sm font-medium text-slate-700">Paid at</label>
                <input type="date" name="paid_at" id="paid_at" value="{{ old('paid_at', now()->format('Y-m-d')) }}" class="{{ $input }}">
                @error('paid_at') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
            </div>
            <div class="flex flex-wrap gap-3 pt-1">
                <button type="submit" class="inline-flex rounded-xl bg-primary px-4 py-2.5 text-sm font-semibold text-white shadow-sm hover:opacity-95">Approve &amp; record payment</button>
                <a href="{{ route('superadmin.offline-requests.index') }}" class="inline-flex rounded-xl border border-slate-200 px-4 py-2.5 text-sm font-semibold text-slate-700 hover:bg-slate-50">Cancel</a>
            </div>
        </form>
    </div>
</div>
@endsection