{*
 * Amsterdam Web Communities System
 * Copyright (c) 2025-2026 Erbosoft Metaverse Design Solutions, All Rights Reserved
 * 
 * This Source Code Form is subject to the terms of the Mozilla Public
 * License, v. 2.0. If a copy of the MPL was not distributed with this
 * file, You can obtain one at https://mozilla.org/MPL/2.0/.
 *
 * SPDX-License-Identifier: MPL-2.0
 *}
<div class="p-4">
    <!-- Top Title -->
    <div class="mb-2">
        <h1 class="text-blue-800 text-4xl font-bold inline">{{ title }}:</h1>
        <span class="text-blue-800 text-xl font-bold ml-2">{{ subtitle | raw }}</span>
        <hr class="border-2 border-gray-400 w-4/5 mt-2 mb-2">
    </div>

    <!-- Invitation Form -->
    <div class="max-w-3xl">
        <form method="POST" action="/__invite_send">
            <input type="hidden" name="backlink" value="{{ backlink }}"/>
            {{ if isset(cid) }}
                <input type="hidden" name="cid" value="{{ cid }}"/>
            {{ end }}
            {{ if isset(confid) }}
                <input type="hidden" name="confid" value="{{ confid }}"/>
            {{ end }}
            {{ if isset(topicid) }}
                <input type="hidden" name="topicid" value="{{ topicid }}"/>
            {{ end }}
            <div class="bg-gray-50 p-6 rounded-lg space-y-4">
                <div>
                    <label for="addr" class="block text-black text-sm font-medium mb-2">Send to:</label>
                    <div class="flex items-center gap-4">
                        <input type="text" id="addr" name="addr" size="37" maxlength="255" value="" placeholder="Enter an E-mail address..."
                                class="flex-1 px-3 py-2 border border-gray-300 rounded font-mono focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
                    </div>
                </div>

                <!-- Message -->
                <div>
                    <div class="flex justify-between items-center mb-2">
                        <label for="msg" class="text-black text-sm font-medium">Personal message to be added to invitation:</label>
                    </div>
                    <textarea id="msg" name="msg" wrap="soft" rows="7" cols="51"
                                placeholder="Enter your message here..."
                                class="w-full px-3 py-2 border border-gray-300 rounded font-mono text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"></textarea>
                </div>

                <!-- Action Buttons -->
                <div class="flex justify-center gap-4 pt-4">
                    <button type="submit" name="send"
                            class="bg-green-600 hover:bg-green-700 text-white px-6 py-2 rounded font-medium transition-colors">
                        Send E-Mail
                    </button>
                    <button type="submit" name="cancel"
                            class="bg-red-600 hover:bg-red-700 text-white px-6 py-2 rounded font-medium transition-colors">
                        Cancel
                    </button>
                </div>
            </div>
        </form>
    </div>
</div>