@model ScenarioListViewModel
@{
    ViewData["Title"] = "Scenarios";
}

<section class="context-header">
    <div class="context-title">
        <span class="eyebrow">Scenario Sandbox</span>
        <strong>@Model.Project.ProjectName</strong>
    </div>
    <nav class="context-nav" aria-label="Workspace navigation">
        <a asp-controller="Projects" asp-action="Details" asp-route-id="@Model.Project.ProjectID">Project</a>
        <a asp-controller="Timeline" asp-action="Index" asp-route-projectId="@Model.Project.ProjectID">Main timeline</a>
        <a asp-controller="Analytics" asp-action="Index" asp-route-projectId="@Model.Project.ProjectID">Story health</a>
    </nav>
</section>

<div class="page-heading">
    <div>
        <p class="eyebrow">Planning sandbox</p>
        <h1>Scenarios <help-icon key="scenarios.overview" /></h1>
        <p class="lead-text">Test structural changes without changing the main story order.</p>
    </div>
    <a class="btn btn-primary" asp-action="Create" asp-route-projectId="@Model.Project.ProjectID">Create Scenario</a>
</div>

<section class="story-bible-section">
    @if (!Model.Scenarios.Any())
    {
        <p class="muted">No scenarios yet. Create one from the current order to test a structural idea.</p>
    }
    else
    {
        <div class="story-bible-grid story-bible-grid-compact">
            @foreach (var scenario in Model.Scenarios)
            {
                <article class="story-bible-card scenario-card">
                    <div class="story-bible-card-title">
                        <h3>@scenario.ScenarioName</h3>
                        @if (scenario.IsAppliedToMain)
                        {
                            <span>Applied</span>
                        }
                    </div>
                    <p class="muted">@scenario.Description</p>
                    <div class="story-bible-meta">
                        <span>@scenario.SceneCount scenes</span>
                        <span>@scenario.WarningCount warnings</span>
                        @if (!string.IsNullOrWhiteSpace(scenario.BookTitle))
                        {
                            <span>@scenario.BookTitle</span>
                        }
                    </div>
                    <div class="button-row mt-2">
                        <a class="btn btn-outline-primary btn-sm" asp-action="Timeline" asp-route-id="@scenario.ScenarioID">Open timeline</a>
                        <a class="btn btn-outline-secondary btn-sm" asp-action="Compare" asp-route-id="@scenario.ScenarioID">Compare</a>
                        <form asp-action="Archive" method="post" data-confirm-message="Archive this scenario?&#10;&#10;This will hide it from active lists and timelines, but the data will be kept and can be restored later.">
                            <input type="hidden" name="id" value="@scenario.ScenarioID" />
                            <input type="hidden" name="projectId" value="@Model.Project.ProjectID" />
                            <button class="btn btn-outline-danger btn-sm" type="submit">Archive</button>
                        </form>
                    </div>
                </article>
            }
        </div>
    }
</section>
