{{define "partials/tab_settings.html"}}
<div class="flex justify-between items-center min-h-12 mb-6">
    <h1 class="text-2xl font-bold">Hold Settings</h1>
</div>

<form hx-post="/admin/settings/update" hx-swap="none" class="space-y-6">
    <div class="card bg-base-100 shadow-sm">
        <div class="card-body">
            <h2 class="card-title text-lg">Access Control</h2>

            <label class="flex items-start gap-4 p-4 bg-base-200 rounded-lg mb-3 cursor-pointer">
                <input type="checkbox" name="public" class="toggle toggle-primary mt-0.5" {{if .Settings.Public}}checked{{end}}>
                <span class="flex flex-col">
                    <strong>Public Hold</strong>
                    <small class="text-base-content/60">Allow anonymous users to read blobs (no auth required for pulls)</small>
                </span>
            </label>

            <label class="flex items-start gap-4 p-4 bg-base-200 rounded-lg cursor-pointer">
                <input type="checkbox" name="allow_all_crew" class="toggle toggle-primary mt-0.5" {{if .Settings.AllowAllCrew}}checked{{end}}>
                <span class="flex flex-col">
                    <strong>Open Registration</strong>
                    <small class="text-base-content/60">Allow any authenticated user to join as crew via requestCrew</small>
                </span>
            </label>
        </div>
    </div>

    <div class="card bg-base-100 shadow-sm">
        <div class="card-body">
            <h2 class="card-title text-lg">Integrations</h2>

            <label class="flex items-start gap-4 p-4 bg-base-200 rounded-lg cursor-pointer">
                <input type="checkbox" name="enable_bluesky_posts" class="toggle toggle-primary mt-0.5" {{if .Settings.EnableBlueskyPosts}}checked{{end}}>
                <span class="flex flex-col">
                    <strong>Bluesky Posts</strong>
                    <small class="text-base-content/60">Post to Bluesky when images are pushed to this hold</small>
                </span>
            </label>
        </div>
    </div>

    <div class="card bg-base-100 shadow-sm">
        <div class="card-body">
            <h2 class="card-title text-lg">Migration</h2>

            <div class="p-4 bg-base-200 rounded-lg">
                <label class="flex flex-col gap-2">
                    <span class="flex flex-col">
                        <strong>Successor Hold</strong>
                        <small class="text-base-content/60">DID of the successor hold. When set, the appview redirects all requests to the successor.</small>
                    </span>
                    <input type="text" name="successor" class="input input-bordered w-full font-mono text-sm"
                        placeholder="did:web:hold.example.com or did:plc:..."
                        value="{{.Settings.Successor}}">
                </label>
            </div>
        </div>
    </div>

    <div class="card bg-base-100 shadow-sm">
        <div class="card-body">
            <h2 class="card-title text-lg">Hold Information</h2>
            <div class="grid grid-cols-[auto_1fr] gap-x-6 gap-y-3 mt-2">
                <dt class="font-medium text-base-content/70">Hold DID</dt>
                <dd><code class="font-mono text-sm">{{.Settings.HoldDID}}</code></dd>
                <dt class="font-medium text-base-content/70">Owner</dt>
                <dd>
                    {{if .Settings.OwnerHandle}}<strong>{{.Settings.OwnerHandle}}</strong><br>{{end}}
                    <code class="text-xs text-base-content/50 break-all font-mono">{{.Settings.OwnerDID}}</code>
                </dd>
                <dt class="font-medium text-base-content/70">Quotas</dt>
                <dd>
                    {{if .Settings.QuotasEnabled}}
                    <span class="badge badge-primary badge-sm">Enabled</span>
                    <small class="text-base-content/60">({{.Settings.TierCount}} tiers, default: {{.Settings.DefaultTier}})</small>
                    {{else}}
                    <span class="badge badge-ghost badge-sm">Disabled</span>
                    {{end}}
                </dd>
            </div>
        </div>
    </div>

    <div class="flex gap-3">
        <button type="submit" class="btn btn-primary gap-2">
            {{ icon "save" "size-4" }}
            Save Settings
        </button>
    </div>
</form>
{{end}}