@model ScenarioCompareViewModel
@{
    ViewData["Title"] = "Compare Scenario";
}

<section class="scenario-banner">
    <div>
        <p class="eyebrow">Scenario Comparison</p>
        <h1>@Model.Scenario.ScenarioName <help-icon key="scenarios.compare" /></h1>
        <p>Review moved scenes and sandbox warnings before applying anything to the main order.</p>
    </div>
    <div class="button-row">
        <a class="btn btn-outline-secondary" asp-action="Timeline" asp-route-id="@Model.Scenario.ScenarioID">Back to scenario</a>
        <a class="btn btn-outline-secondary" asp-controller="Timeline" asp-action="Index" asp-route-projectId="@Model.Project.ProjectID" asp-route-bookId="@Model.Scenario.BookID">Main timeline</a>
    </div>
</section>

@if (TempData["ScenarioMessage"] is string message)
{
    <div class="alert alert-warning">@message</div>
}

<section class="story-bible-section">
    <div class="story-bible-section-heading">
        <div>
            <p class="eyebrow">Moved scenes</p>
            <h2>Main vs Scenario <help-icon key="scenarios.mainVsScenario" /></h2>
        </div>
        <span class="soft-count">@Model.MovedScenes.Count moved</span>
    </div>
    @if (!Model.MovedScenes.Any())
    {
        <p class="muted">No scene movements yet.</p>
    }
    else
    {
        <div class="scenario-compare-list">
            @foreach (var row in Model.MovedScenes)
            {
                <article>
                    <strong>@row.SceneTitle</strong>
                    <span>Main: @row.MainPosition</span>
                    <span>Scenario: @row.ScenarioPosition</span>
                </article>
            }
        </div>
    }
</section>

<section class="story-bible-section">
    <div class="story-bible-section-heading">
        <div>
            <p class="eyebrow">Warnings added</p>
            <h2>Scenario Warnings <help-icon key="scenarios.validationNotes" /></h2>
        </div>
        <span class="soft-count">@Model.ScenarioWarnings.Count</span>
    </div>
    @if (!Model.ScenarioWarnings.Any())
    {
        <p class="muted">No scenario warnings currently recorded.</p>
    }
    else
    {
        <div class="attention-list">
            @foreach (var warning in Model.ScenarioWarnings)
            {
                <article>
                    <span class="badge text-bg-light">@warning.SeverityName</span>
                    <strong>@warning.WarningTypeName</strong>
                    <p>@warning.Message</p>
                    @if (!string.IsNullOrWhiteSpace(warning.Details))
                    {
                        <p class="muted">@warning.Details</p>
                    }
                </article>
            }
        </div>
    }
</section>

<section class="story-bible-section danger-zone">
    <h2>Apply Scenario To Main <help-icon key="scenarios.applyToMain" /></h2>
    <p class="muted">This updates the real scene chapter/order using the scenario order. Linked story data stays attached to the same scenes.</p>
    <form asp-action="Apply" method="post" class="plotline-form">
        <input type="hidden" name="id" value="@Model.Scenario.ScenarioID" />
        <label class="form-label">Confirmation text <help-icon key="scenarios.fields.confirmationText" mode="inline" /></label>
        <input name="confirmation" class="form-control" value="" placeholder="This will replace the current scene order with the scenario order. Continue?" />
        <button class="btn btn-danger mt-2" type="submit">Apply Scenario</button>
    </form>
</section>