@model PowderCoating.Application.DTOs.Notification.NotificationLogDto
@{
    ViewData["Title"] = "Notification Details";
    ViewData["PageIcon"] = "bi-bell-history";
}

<div class="container-fluid px-4 py-4">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <div>
            <p class="text-muted mb-0">Audit record #@Model.Id</p>
        </div>
        <a asp-action="Index" class="btn btn-outline-secondary">
            <i class="bi bi-arrow-left me-2"></i>Back to Log
        </a>
    </div>

    <div class="row g-4">
        <!-- Left column: notification info -->
        <div class="col-md-6">
            <div class="card border-0 shadow-sm h-100">
                <div class="card-body">
                    <h5 class="card-title border-bottom pb-2 mb-3">
                        <i class="bi bi-info-circle me-2 text-primary"></i>Notification Info
                    </h5>
                    <dl class="row mb-0">
                        <dt class="col-sm-4">Sent At</dt>
                        <dd class="col-sm-8">@Model.SentAt.Tz(ViewBag.CompanyTimeZone as string).ToString("MMMM d, yyyy HH:mm:ss")</dd>

                        <dt class="col-sm-4">Channel</dt>
                        <dd class="col-sm-8">
                            @if (Model.Channel == PowderCoating.Core.Enums.NotificationChannel.Email)
                            {
                                <span class="badge bg-primary"><i class="bi bi-envelope me-1"></i>Email</span>
                            }
                            else
                            {
                                <span class="badge bg-info text-dark"><i class="bi bi-phone me-1"></i>SMS</span>
                            }
                        </dd>

                        <dt class="col-sm-4">Type</dt>
                        <dd class="col-sm-8">@Model.NotificationTypeDisplay</dd>

                        <dt class="col-sm-4">Status</dt>
                        <dd class="col-sm-8">
                            @{
                                var (badgeClass, icon) = Model.Status switch
                                {
                                    PowderCoating.Core.Enums.NotificationStatus.Sent => ("bg-success", "bi-check-circle"),
                                    PowderCoating.Core.Enums.NotificationStatus.Failed => ("bg-danger", "bi-x-circle"),
                                    _ => ("bg-secondary", "bi-dash-circle")
                                };
                            }
                            <span class="badge @badgeClass">
                                <i class="bi @icon me-1"></i>@Model.StatusDisplay
                            </span>
                        </dd>

                        @if (!string.IsNullOrEmpty(Model.ErrorMessage))
                        {
                            <dt class="col-sm-4 text-danger">Error</dt>
                            <dd class="col-sm-8 text-danger">@Model.ErrorMessage</dd>
                        }

                        @if (!string.IsNullOrEmpty(Model.Subject))
                        {
                            <dt class="col-sm-4">Subject</dt>
                            <dd class="col-sm-8">@Model.Subject</dd>
                        }
                    </dl>
                </div>
            </div>
        </div>

        <!-- Right column: recipient info -->
        <div class="col-md-6">
            <div class="card border-0 shadow-sm h-100">
                <div class="card-body">
                    <h5 class="card-title border-bottom pb-2 mb-3">
                        <i class="bi bi-person me-2 text-primary"></i>Recipient
                    </h5>
                    <dl class="row mb-0">
                        <dt class="col-sm-4">Name</dt>
                        <dd class="col-sm-8">@Model.RecipientName</dd>

                        <dt class="col-sm-4">Address</dt>
                        <dd class="col-sm-8">@Model.Recipient</dd>

                        @if (Model.CustomerId.HasValue)
                        {
                            <dt class="col-sm-4">Customer</dt>
                            <dd class="col-sm-8">
                                <a asp-controller="Customers" asp-action="Details" asp-route-id="@Model.CustomerId">
                                    @(Model.CustomerName ?? "View Customer")
                                </a>
                            </dd>
                        }

                        @if (Model.JobId.HasValue)
                        {
                            <dt class="col-sm-4">Job</dt>
                            <dd class="col-sm-8">
                                <a asp-controller="Jobs" asp-action="Details" asp-route-id="@Model.JobId">
                                    @(Model.JobNumber ?? "View Job")
                                </a>
                            </dd>
                        }

                        @if (Model.QuoteId.HasValue)
                        {
                            <dt class="col-sm-4">Quote</dt>
                            <dd class="col-sm-8">
                                <a asp-controller="Quotes" asp-action="Details" asp-route-id="@Model.QuoteId">
                                    @(Model.QuoteNumber ?? "View Quote")
                                </a>
                            </dd>
                        }
                    </dl>
                </div>
            </div>
        </div>

        <!-- Message body -->
        <div class="col-12">
            <div class="card border-0 shadow-sm">
                <div class="card-body">
                    <h5 class="card-title border-bottom pb-2 mb-3">
                        <i class="bi bi-chat-text me-2 text-primary"></i>Message Body
                    </h5>
                    <pre class="bg-light p-3 rounded mb-0" style="white-space:pre-wrap; word-wrap:break-word;">@Model.Message</pre>
                </div>
            </div>
        </div>
    </div>
</div>