{*
 * 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">
    <!-- Confirmation Dialog -->
    <div class="max-w-2xl w-full">
        <div class="bg-white border-2 border-{{ tone }}-600 rounded-lg shadow-2xl overflow-hidden">
            <!-- Dialog Header -->
            <div class="bg-{{ tone }}-600 px-6 py-4">
                <h1 class="text-white text-2xl font-bold text-center flex items-center justify-center gap-3">
                    {{ if destructive }}<span class="text-3xl">⚠️</span>{{ end }}
                    {{ .FrameTitle() | raw }}
                    {{ if destructive }}<span class="text-3xl">⚠️</span>{{ end }}
                </h1>
            </div>

            <!-- Dialog Body -->
            <div class="px-8 py-8">
                <div class="text-center mb-8">
                    <p class="text-gray-800 text-lg leading-relaxed">
                        {{ message | raw }}
                    </p>
                    {{ if destructive }}
                        <p class="text-gray-800 text-lg font-bold mt-4">Are you sure you want to do this?</p>
                    {{ end }}
                </div>

                {{ if useWarning }}
                    <!-- Warning Box -->
                    <div class="bg-yellow-50 border-l-4 border-yellow-400 p-4 mb-8">
                        <div class="flex items-start">
                            <span class="text-2xl mr-3">{{ warningIcon }}</span>
                            <div class="text-sm text-yellow-800">
                                {{ range i, line := warningLines }}
                                    {{ if line.Bold }}
                                        <p class="font-bold mb-1">{{ line.Text }}</p>
                                    {{ else }}
                                        <p>{{ line.Text }}</p>
                                    {{ end }}
                                {{ end }}
                            </div>
                        </div>
                    </div>
                {{ end }}

                <!-- Action Buttons -->
                <div class="flex gap-4 justify-center">
                    {{ range i, bt := buttons }}
                        <a href="{{ buttonLinks[i] }}"
                            class="bg-{{ bt.Tone }}-600 hover:bg-{{ bt.Tone }}-700 text-white font-bold px-8 py-3 rounded-lg text-lg transition-colors shadow-lg hover:shadow-xl flex items-center gap-2">
                            <span class="text-xl">{{ bt.Icon }}</span>
                            {{ bt.Text }}
                        </a>
                    {{ end }}
                </div>
            </div>
        </div>
    </div>
</div>