@page "/"
@inject NavigationManager NavigationManager

<div class="d-flex justify-content-center align-items-center" style="min-height: 70vh;">
    <div class="card shadow-sm border-0" style="max-width: 560px; width: 100%;">
        <div class="card-body p-5 text-center">
            <div class="rounded-circle bg-primary bg-opacity-10 d-inline-flex align-items-center justify-content-center mb-4" style="width: 72px; height: 72px;">
                <span class="oi oi-document text-primary" aria-hidden="true" style="font-size: 2rem;"></span>
            </div>
            <h2 class="mb-3">Empfänger-UI</h2>
            <p class="text-muted mb-4">
                Sie werden zur Empfänger-UI weitergeleitet. Bitte warten Sie einen Moment.
            </p>

            <DxLoadingPanel Visible="true"
                            Text=""
                            IndicatorVisible="false"
                            IndicatorAreaVisible="false"
                            IsContentBlocked="false"
                            ApplyBackgroundShading="false">
                <div class="d-flex flex-column align-items-center gap-3 py-3">
                    <div class="spinner-border text-primary" role="status" style="width: 2rem; height: 2rem;">
                        <span class="visually-hidden">Wird geladen...</span>
                    </div>
                    <div class="text-muted small">Weiterleitung wird vorbereitet...</div>
                </div>
            </DxLoadingPanel>
        </div>
    </div>
</div>

@code {
    protected override async Task OnAfterRenderAsync(bool firstRender) {
        if(!firstRender)
            return;

        await Task.Delay(1200);
        NavigationManager.NavigateTo("/receiver");
    }
}