{{define "settings_comment"}}
{{template "header" .}}
<section class="max-w-4xl mx-auto px-4 py-12">
    <h2 class="text-3xl font-bold text-gray-900 mb-2">{{index .Tr "comment_settings_title"}}</h2>
    <p class="text-gray-500 mb-4">{{index .Tr "comment_settings_desc"}}</p>

    <div class="flex gap-2 mb-8">
        <a href="/admin/settings/site" class="px-4 py-2 rounded-lg text-sm font-medium bg-gray-200 text-gray-700 hover:bg-gray-300 transition-colors">{{index .Tr "settings_site_title"}}</a>
        <a href="/admin/settings/upload" class="px-4 py-2 rounded-lg text-sm font-medium bg-gray-200 text-gray-700 hover:bg-gray-300 transition-colors">{{index .Tr "settings_upload_title"}}</a>
        <a href="/admin/settings/download" class="px-4 py-2 rounded-lg text-sm font-medium bg-gray-200 text-gray-700 hover:bg-gray-300 transition-colors">{{index .Tr "settings_download_title"}}</a>
        <a href="/admin/settings/comments" class="px-4 py-2 rounded-lg text-sm font-medium bg-blue-600 text-white">{{index .Tr "comment_settings_title"}}</a>
    </div>

    {{if .Success}}
    <div class="bg-green-50 border border-green-200 text-green-700 px-4 py-3 rounded-lg mb-6">{{.Success}}</div>
    {{end}}

    <form action="/admin/settings/comments" method="post" class="bg-white rounded-xl shadow-sm border border-gray-200 p-6 space-y-4">
        <label class="flex items-center gap-3 text-sm text-gray-700">
            <input type="checkbox" name="enabled" value="1" {{if .CommentConfig.Enabled}}checked{{end}}
                class="w-4 h-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500">
            {{index .Tr "comment_settings_enabled"}}
        </label>
        <label class="flex items-center gap-3 text-sm text-gray-700">
            <input type="checkbox" name="allow_guest" value="1" {{if .CommentConfig.AllowGuest}}checked{{end}}
                class="w-4 h-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500">
            {{index .Tr "comment_settings_allow_guest"}}
        </label>
        <label class="flex items-center gap-3 text-sm text-gray-700">
            <input type="checkbox" name="guest_require_approval" value="1" {{if .CommentConfig.GuestRequireApproval}}checked{{end}}
                class="w-4 h-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500">
            {{index .Tr "comment_settings_guest_approval"}}
        </label>
        <div>
            <label class="flex items-center gap-3 text-sm text-gray-700">
                <input type="checkbox" name="use_gravatar" value="1" {{if .CommentConfig.UseGravatar}}checked{{end}}
                    class="w-4 h-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500">
                {{index .Tr "comment_settings_use_gravatar"}}
            </label>
            <p class="ml-7 text-xs text-gray-400">{{index .Tr "comment_settings_use_gravatar_hint"}}</p>
        </div>
        <button type="submit"
            class="bg-blue-600 text-white px-6 py-2 rounded-lg font-medium hover:bg-blue-700 transition-colors">
            {{index .Tr "settings_save"}}
        </button>
    </form>
</section>
{{template "footer" .}}
{{end}}