<?php $__env->startSection('title', 'Memberships'); ?>

<?php $__env->startSection('content'); ?>
<div x-data="{ add: false, addPlan: false, editPlan: null }">
    <div class="mb-5 flex flex-wrap items-center justify-between gap-3">
        <div>
            <h1 class="text-xl font-extrabold text-slate-900 lg:text-2xl">Hospitality memberships</h1>
            <p class="text-sm text-slate-500"><?php echo e($summary['active']); ?> active · <?php echo e($summary['expiring']); ?> expiring soon · <?php echo e($CUR ?? '₦') . number_format((float) ($summary['revenue']), 2); ?> lifetime revenue</p>
        </div>
        <div class="flex gap-2">
            <a href="<?php echo e(route('epelcon.referrals.index')); ?>" class="rounded-xl bg-white px-4 py-2.5 text-sm font-bold text-slate-700 shadow-sm ring-1 ring-slate-200 hover:bg-slate-50">🎁 Referrals & rewards</a>
            <button @click="addPlan = true" class="rounded-xl bg-white px-4 py-2.5 text-sm font-bold text-slate-700 shadow-sm ring-1 ring-slate-200 hover:bg-slate-50">+ Plan</button>
            <button @click="add = true" class="rounded-xl bg-indigo-600 px-4 py-2.5 text-sm font-bold text-white shadow-lg shadow-indigo-600/25 hover:bg-indigo-700">+ Enrol member</button>
        </div>
    </div>

    
    <div class="mb-6 grid gap-4 sm:grid-cols-3">
        <?php $__currentLoopData = $plans; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $plan): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
            <div class="relative overflow-hidden rounded-2xl bg-white p-5 shadow-sm ring-1 ring-slate-200">
                <div class="absolute inset-x-0 top-0 h-1.5" style="background: <?php echo e($plan->color); ?>"></div>
                <div class="flex items-start justify-between">
                    <h3 class="font-extrabold text-slate-900"><?php echo e($plan->name); ?></h3>
                    <span class="rounded-full bg-slate-100 px-2 py-0.5 text-[10px] font-bold text-slate-500"><?php echo e($plan->memberships_count); ?> members</span>
                </div>
                <p class="mt-1 text-xl font-extrabold" style="color: <?php echo e($plan->color); ?>"><?php echo e($CUR ?? '₦') . number_format((float) ($plan->price), 2); ?><span class="text-xs font-medium text-slate-400">/<?php echo e($plan->duration_days >= 365 ? 'yr' : $plan->duration_days . 'd'); ?></span></p>
                <ul class="mt-2 space-y-1 text-xs text-slate-500">
                    <?php $__currentLoopData = array_slice($plan->perks ?? [], 0, 3); $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $perk): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?><li>✓ <?php echo e($perk); ?></li><?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                </ul>
                <p class="mt-2 text-xs font-semibold text-slate-600"><?php echo e($plan->discount_percent + 0); ?>% discount · <?php echo e($plan->points_multiplier + 0); ?>× points</p>
                <button @click='editPlan = <?php echo e(json_encode($plan->only(['id','name','description','price','duration_days','perks','discount_percent','points_multiplier','color','status']))); ?>'
                        class="mt-3 rounded-lg bg-indigo-50 px-3 py-1.5 text-xs font-bold text-indigo-600 hover:bg-indigo-100">Edit plan</button>
            </div>
        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
    </div>

    
    <h2 class="mb-3 font-extrabold text-slate-900">Members</h2>
    <div class="space-y-3">
        <?php $__empty_1 = true; $__currentLoopData = $memberships; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $membership): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); $__empty_1 = false; ?>
            <div class="rounded-2xl bg-white p-4 shadow-sm ring-1 ring-slate-200">
                <div class="flex flex-wrap items-center gap-3">
                    <div class="flex h-10 w-10 items-center justify-center rounded-full text-xs font-bold text-white" style="background: <?php echo e($membership->plan->color); ?>"><?php echo e(strtoupper(substr($membership->customer->name, 0, 2))); ?></div>
                    <div class="min-w-0 flex-1">
                        <p class="font-bold text-slate-900"><?php echo e($membership->customer->name); ?> <span class="ml-1 font-mono text-xs font-semibold text-slate-400"><?php echo e($membership->code); ?></span></p>
                        <p class="text-xs text-slate-500"><?php echo e($membership->plan->name); ?> · <?php echo e($membership->starts_at->format('j M Y')); ?> → <?php echo e($membership->expires_at->format('j M Y')); ?></p>
                    </div>
                    <?php $days = (int) now()->diffInDays($membership->expires_at, false); ?>
                    <?php if($membership->status === 'active' && $days <= 30 && $days >= 0): ?>
                        <span class="rounded-full bg-amber-100 px-2.5 py-1 text-[10px] font-bold text-amber-700">Expires in <?php echo e($days); ?>d</span>
                    <?php endif; ?>
                    <span class="rounded-full px-2.5 py-1 text-[10px] font-bold uppercase <?php echo e($membership->status === 'active' ? 'bg-emerald-100 text-emerald-700' : 'bg-slate-100 text-slate-500'); ?>"><?php echo e($membership->status); ?></span>
                </div>
            </div>
        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); if ($__empty_1): ?>
            <div class="rounded-2xl bg-white p-10 text-center text-slate-400 shadow-sm ring-1 ring-slate-200">No memberships yet.</div>
        <?php endif; ?>
    </div>
    <div class="mt-4"><?php echo e($memberships->links()); ?></div>

    
    <div x-cloak x-show="add" class="fixed inset-0 z-50 flex items-end justify-center sm:items-center">
        <div class="absolute inset-0 bg-slate-900/50 backdrop-blur-sm" @click="add = false"></div>
        <div x-show="add" x-transition class="relative w-full max-w-md rounded-t-3xl bg-white p-6 shadow-2xl sm:rounded-3xl">
            <h2 class="mb-4 text-lg font-extrabold">Enrol member</h2>
            <form method="POST" action="<?php echo e(route('epelcon.memberships.store')); ?>" class="space-y-4"><?php echo csrf_field(); ?>
                <label class="block"><span class="mb-1 block text-xs font-bold uppercase text-slate-500">Customer</span>
                    <select name="customer_id" required class="w-full rounded-xl border-slate-200 text-sm">
                        <?php $__currentLoopData = $customers; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $customer): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?><option value="<?php echo e($customer->id); ?>"><?php echo e($customer->name); ?></option><?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                    </select></label>
                <label class="block"><span class="mb-1 block text-xs font-bold uppercase text-slate-500">Plan</span>
                    <select name="membership_plan_id" required class="w-full rounded-xl border-slate-200 text-sm">
                        <?php $__currentLoopData = $plans; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $plan): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?><option value="<?php echo e($plan->id); ?>"><?php echo e($plan->name); ?> — <?php echo e($CUR ?? '₦') . number_format((float) ($plan->price), 2); ?></option><?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                    </select></label>
                <label class="block"><span class="mb-1 block text-xs font-bold uppercase text-slate-500">Start date</span>
                    <input type="date" name="starts_at" value="<?php echo e(today()->toDateString()); ?>" required class="w-full rounded-xl border-slate-200 text-sm"></label>
                <label class="flex items-center gap-2 text-sm font-semibold text-slate-600"><input type="checkbox" name="paid" value="1" checked class="rounded text-indigo-600"> Payment received now</label>
                <label class="block"><span class="mb-1 block text-xs font-bold uppercase text-slate-500">Payment method</span>
                    <select name="method" class="w-full rounded-xl border-slate-200 text-sm">
                        <?php $__currentLoopData = ['cash', 'card', 'pos', 'transfer']; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $m): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?><option value="<?php echo e($m); ?>"><?php echo e(ucfirst($m)); ?></option><?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                    </select></label>
                <div class="flex justify-end gap-2">
                    <button type="button" @click="add = false" class="rounded-xl px-4 py-2.5 text-sm font-bold text-slate-500">Cancel</button>
                    <button class="rounded-xl bg-indigo-600 px-5 py-2.5 text-sm font-bold text-white">Enrol</button>
                </div>
            </form>
        </div>
    </div>

    
    <template x-for="mode in ['add', 'edit']" :key="mode">
        <div x-cloak x-show="(mode === 'add' && addPlan) || (mode === 'edit' && editPlan)" class="fixed inset-0 z-50 flex items-end justify-center sm:items-center">
            <div class="absolute inset-0 bg-slate-900/50 backdrop-blur-sm" @click="addPlan = false; editPlan = null"></div>
            <div x-transition class="relative max-h-[92vh] w-full max-w-lg overflow-y-auto rounded-t-3xl bg-white p-6 shadow-2xl sm:rounded-3xl">
                <h2 class="mb-4 text-lg font-extrabold" x-text="mode === 'add' ? 'New membership plan' : 'Edit plan'"></h2>
                <form method="POST" :action="mode === 'add' ? '<?php echo e(route('epelcon.memberships.plans.store')); ?>' : '<?php echo e(url('epelcon/memberships/plans')); ?>/' + editPlan?.id + '/update'" class="grid grid-cols-2 gap-4"><?php echo csrf_field(); ?>
                    <label><span class="mb-1 block text-xs font-bold uppercase text-slate-500">Name</span>
                        <input name="name" required :value="mode === 'edit' ? editPlan?.name : ''" class="w-full rounded-xl border-slate-200 text-sm"></label>
                    <label><span class="mb-1 block text-xs font-bold uppercase text-slate-500">Colour</span>
                        <input type="color" name="color" :value="mode === 'edit' ? editPlan?.color : '#6366f1'" class="h-10 w-full rounded-xl border-slate-200"></label>
                    <label><span class="mb-1 block text-xs font-bold uppercase text-slate-500">Price (<?php echo e($CUR); ?>)</span>
                        <input type="number" step="0.01" name="price" required :value="mode === 'edit' ? editPlan?.price : ''" class="w-full rounded-xl border-slate-200 text-sm"></label>
                    <label><span class="mb-1 block text-xs font-bold uppercase text-slate-500">Duration (days)</span>
                        <input type="number" name="duration_days" required :value="mode === 'edit' ? editPlan?.duration_days : 365" class="w-full rounded-xl border-slate-200 text-sm"></label>
                    <label><span class="mb-1 block text-xs font-bold uppercase text-slate-500">Discount %</span>
                        <input type="number" step="0.1" name="discount_percent" :value="mode === 'edit' ? editPlan?.discount_percent : 5" class="w-full rounded-xl border-slate-200 text-sm"></label>
                    <label><span class="mb-1 block text-xs font-bold uppercase text-slate-500">Points multiplier</span>
                        <input type="number" step="0.1" name="points_multiplier" :value="mode === 'edit' ? editPlan?.points_multiplier : 1" class="w-full rounded-xl border-slate-200 text-sm"></label>
                    <label class="col-span-2"><span class="mb-1 block text-xs font-bold uppercase text-slate-500">Perks (one per line)</span>
                        <textarea name="perks" rows="3" class="w-full rounded-xl border-slate-200 text-sm" x-init="mode === 'edit' && editPlan && ($el.value = (editPlan.perks || []).join('\n'))"></textarea></label>
                    <label class="col-span-2"><span class="mb-1 block text-xs font-bold uppercase text-slate-500">Description</span>
                        <textarea name="description" rows="2" class="w-full rounded-xl border-slate-200 text-sm" x-init="mode === 'edit' && editPlan && ($el.value = editPlan.description ?? '')"></textarea></label>
                    <div class="col-span-2 flex justify-end gap-2">
                        <button type="button" @click="addPlan = false; editPlan = null" class="rounded-xl px-4 py-2.5 text-sm font-bold text-slate-500">Cancel</button>
                        <button class="rounded-xl bg-indigo-600 px-5 py-2.5 text-sm font-bold text-white">Save plan</button>
                    </div>
                </form>
            </div>
        </div>
    </template>
</div>
<?php $__env->stopSection(); ?>

<?php echo $__env->make('layouts.epelcon', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH C:\wamp64\www\hms\resources\views/epelcon/memberships/index.blade.php ENDPATH**/ ?>