{% extends "ui/templates/base/layout.html" %}
{% block content %}<div class="max-w-3xl space-y-6"><h1 class="text-2xl font-semibold">New Platform Subscription</h1><form method="post" class="space-y-4 rounded-2xl border bg-white p-5 shadow-soft"><input type="hidden" name="csrf_token" value="{{ csrf_token }}" /><div class="grid gap-4 md:grid-cols-2"><label class="text-sm">Account<select name="account_id" required class="mt-1 w-full rounded-xl border px-3 py-2">{% for a in accounts %}<option value="{{ a.id }}">{{ a.display_name }} ({{ a.account_type }})</option>{% endfor %}</select></label><label class="text-sm">Plan<select name="plan_id" required class="mt-1 w-full rounded-xl border px-3 py-2">{% for p in plans %}<option value="{{ p.id }}">{{ p.name }}</option>{% endfor %}</select></label><label class="text-sm">Subscription Code<input name="subscription_code" required class="mt-1 w-full rounded-xl border px-3 py-2" /></label><label class="text-sm">Billing Cycle<select name="billing_cycle" class="mt-1 w-full rounded-xl border px-3 py-2">{% for x in billing_cycles %}<option value="{{ x }}">{{ x }}</option>{% endfor %}</select></label><label class="text-sm">Start Date<input type="date" name="start_date" required class="mt-1 w-full rounded-xl border px-3 py-2" /></label><label class="text-sm">End Date<input type="date" name="end_date" class="mt-1 w-full rounded-xl border px-3 py-2" /></label><label class="text-sm">Amount<input name="amount" value="0" class="mt-1 w-full rounded-xl border px-3 py-2" /></label><label class="text-sm">GST Rate<input name="gst_rate" value="18" class="mt-1 w-full rounded-xl border px-3 py-2" /></label></div><label class="inline-flex items-center gap-2 text-sm"><input type="checkbox" name="auto_generate_invoice" checked /> Auto generate invoice later</label><label class="block text-sm">Notes<textarea name="notes" class="mt-1 w-full rounded-xl border px-3 py-2"></textarea></label><button class="rounded-xl bg-brand-600 px-4 py-2 text-sm font-semibold text-white">Save Subscription</button></form></div>{% endblock %}