{% extends "layout-bare.twig" %}

{% block content %}
<main class="min-h-screen w-screen overflow-hidden beamer-root"
      data-sprint-root
      data-sprint-id="{{ sprint.id }}"
      data-csrf="{{ csrfToken }}"
      data-beamer="1">

    <header class="flex items-center justify-between gap-4 px-4 py-2 border-b bg-slate-50 dark:bg-slate-800 dark:border-slate-700">
        <div class="flex items-center gap-3">
            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" width="24" height="24" aria-hidden="true" class="block shrink-0" fill="none">
                <defs>
                    <radialGradient id="brand-cycle-glow-present" cx="32" cy="32" r="20" gradientUnits="userSpaceOnUse">
                        <stop offset="0"   stop-color="#6366f1" stop-opacity="0.55"/>
                        <stop offset="0.6" stop-color="#6366f1" stop-opacity="0.12"/>
                        <stop offset="1"   stop-color="#6366f1" stop-opacity="0"/>
                    </radialGradient>
                </defs>
                <circle cx="32" cy="32" r="20" fill="url(#brand-cycle-glow-present)"/>
                <path d="M52 32 A20 20 0 1 1 32 12" stroke="currentColor" stroke-width="3.5" stroke-linecap="round"/>
                <path d="M44 8 L52 12 L48 20" stroke="currentColor" stroke-width="3.5" stroke-linecap="round" stroke-linejoin="round"/>
                <circle cx="32" cy="32" r="5"  fill="#6366f1"/>
                <circle cx="48" cy="20" r="2.5" fill="currentColor" opacity="0.55"/>
                <circle cx="52" cy="40" r="2.5" fill="currentColor" opacity="0.55"/>
                <circle cx="40" cy="50" r="2.5" fill="currentColor" opacity="0.55"/>
                <circle cx="20" cy="48" r="2.5" fill="currentColor" opacity="0.55"/>
                <circle cx="14" cy="32" r="2.5" fill="#10b981"/>
            </svg>
            <div class="flex items-baseline gap-3">
                <h1 class="text-lg font-semibold tracking-tight">{{ sprint.name }}</h1>
                <p class="text-slate-600 text-xs dark:text-slate-400">
                    {{ sprint.startDate }} – {{ sprint.endDate }}
                    {% if sprint.isArchived %}
                        · <span class="inline-block px-1.5 py-0.5 text-[10px] bg-slate-200 text-slate-600 rounded dark:bg-slate-700 dark:text-slate-300">archived</span>
                    {% endif %}
                </p>
            </div>
        </div>
        <div class="flex items-center gap-3">
            <div data-status
                 class="text-xs border rounded px-2 py-0.5 opacity-0 transition-opacity duration-200 border-slate-200 bg-slate-50 text-slate-700 dark:bg-slate-800 dark:border-slate-700 dark:text-slate-300">
            </div>
            {% if presentSprintChoices|default([])|length > 1 %}
                <label class="sr-only" for="present-sprint-select">Sprint</label>
                <select id="present-sprint-select" data-present-sprint-select
                        class="rounded-md border border-slate-300 bg-white text-slate-700 px-2 py-1 text-sm hover:bg-slate-100 dark:bg-slate-800 dark:border-slate-600 dark:text-slate-200 dark:hover:bg-slate-700">
                    {% for choice in presentSprintChoices %}
                        <option value="{{ choice.id }}"{% if choice.id == sprint.id %} selected{% endif %}>{{ choice.name }}</option>
                    {% endfor %}
                </select>
            {% endif %}
            <a href="/sprints/{{ sprint.id }}" data-close-present
               class="inline-flex items-center gap-2 rounded-md border border-slate-300 bg-white text-slate-700 px-3 py-1 text-sm hover:bg-slate-100 dark:bg-slate-800 dark:border-slate-600 dark:text-slate-200 dark:hover:bg-slate-700">
                Close
            </a>
        </div>
    </header>

    {% if sprintWorkers is empty or weeks is empty %}
        <div class="m-4 rounded-md border border-amber-200 bg-amber-50 px-4 py-3 text-sm text-amber-900 dark:bg-amber-900 dark:border-amber-800 dark:text-amber-200">
            {% if weeks is empty %}
                No weeks yet. <a href="/sprints/{{ sprint.id }}/settings" class="underline">Open settings</a> to add some.
            {% elseif sprintWorkers is empty %}
                No workers on this sprint yet. <a href="/sprints/{{ sprint.id }}/settings" class="underline">Open settings</a> to add some.
            {% endif %}
        </div>
    {% else %}
        {% include "sprints/_task_list.twig" with { isBeamer: true } %}
    {% endif %}
</main>
{% endblock %}
