@model PowderCoating.Application.DTOs.Company.CompanyDto
@using PowderCoating.Web.ViewModels.Platform
@using PowderCoating.Web.Controllers

@{
    ViewData["Title"] = Model.CompanyName;
    ViewData["PageIcon"] = "bi-building";
    var planConfigs = ((IEnumerable<PowderCoating.Core.Entities.SubscriptionPlanConfig>)ViewBag.PlanConfigs)
        .OrderBy(c => c.SortOrder).ToList();
    var planBadgeColors = planConfigs.Select((c, i) => (c.Plan, i))
        .ToDictionary(x => x.Plan, x => x.i switch { 0 => "bg-secondary", 1 => "bg-primary", 2 => "bg-info", _ => "bg-success" });
    var planNames = planConfigs.ToDictionary(c => c.Plan, c => c.DisplayName);
    string PlanBadge(int plan) => planBadgeColors.TryGetValue(plan, out var c) ? c : "bg-secondary";
    string PlanName(int plan) => planNames.TryGetValue(plan, out var n) ? n : plan.ToString();

    var healthScore   = (int)(ViewBag.HealthScore ?? 0);
    var healthRisk    = (string)(ViewBag.HealthRisk ?? "Healthy");
    var healthSignals = (List<string>)(ViewBag.HealthSignals ?? new List<string>());
    var jobs30        = (int)(ViewBag.Jobs30 ?? 0);
    var jobs90        = (int)(ViewBag.Jobs90 ?? 0);
    var lastLogin     = (DateTime?)(ViewBag.LastLoginDate);
    var onboarding    = (OnboardingProgressRowViewModel?)(ViewBag.Onboarding);

    string ScoreColor(int s) => s >= 75 ? "text-success" : s >= 45 ? "text-warning" : "text-danger";
    string RiskBadgeClass(string r) => r switch {
        "Healthy"        => "bg-success",
        "AtRisk"         => "bg-warning text-dark",
        "Critical"       => "bg-danger",
        "NeverActivated" => "bg-secondary",
        _                => "bg-secondary"
    };
    string RiskLabel(string r) => r switch {
        "Healthy"        => "Healthy",
        "AtRisk"         => "At Risk",
        "Critical"       => "Critical",
        "NeverActivated" => "Never Activated",
        _                => r
    };
}

<div class="container-fluid">
    <div class="d-flex justify-content-between align-items-center mb-3">
        <div class="d-flex align-items-center gap-2">
            <a asp-action="Index" class="text-muted small text-decoration-none">
                <i class="bi bi-arrow-left me-1"></i>Companies
            </a>
            @if (!string.IsNullOrEmpty(Model.CompanyCode))
            {
                <span class="badge bg-secondary">@Model.CompanyCode</span>
            }
            <span class="badge @(Model.IsActive ? "bg-success" : "bg-danger")">@(Model.IsActive ? "Active" : "Inactive")</span>
            <span class="badge @RiskBadgeClass(healthRisk)">@RiskLabel(healthRisk)</span>
        </div>
        <div class="btn-group">
            <a asp-action="CreateCompanyAdmin" asp-route-id="@Model.Id" class="btn btn-success btn-sm">
                <i class="bi bi-person-plus me-1"></i>Add User
            </a>
            <a asp-action="Edit" asp-route-id="@Model.Id" class="btn btn-primary btn-sm">
                <i class="bi bi-pencil me-1"></i>Edit
            </a>
        </div>
    </div>

    @if (TempData["Warning"] != null)
    {
        <div class="alert alert-warning alert-permanent alert-dismissible fade show mb-3" role="alert">
            <i class="bi bi-exclamation-triangle me-2"></i>@TempData["Warning"]
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
    }

    <!-- KPI strip -->
    <div class="row g-2 mb-3">
        <div class="col-6 col-md-3">
            <div class="card shadow-sm h-100">
                <div class="card-body text-center py-2">
                    <div class="fs-4 fw-bold text-primary">@Model.UserCount</div>
                    <div class="small text-muted">Users</div>
                </div>
            </div>
        </div>
        <div class="col-6 col-md-3">
            <div class="card shadow-sm h-100">
                <div class="card-body text-center py-2">
                    <div class="fs-4 fw-bold text-success">@Model.CustomerCount</div>
                    <div class="small text-muted">Customers</div>
                </div>
            </div>
        </div>
        <div class="col-6 col-md-3">
            <div class="card shadow-sm h-100">
                <div class="card-body text-center py-2">
                    <div class="fs-4 fw-bold text-info">@Model.JobCount</div>
                    <div class="small text-muted">Jobs</div>
                </div>
            </div>
        </div>
        <div class="col-6 col-md-3">
            <div class="card shadow-sm h-100">
                <div class="card-body text-center py-2">
                    <div class="fs-5 fw-bold @ScoreColor(healthScore)">@healthScore</div>
                    <div class="small text-muted">Health Score</div>
                </div>
            </div>
        </div>
    </div>

    <!-- Tabs -->
    <ul class="nav nav-tabs mb-3" id="companyDetailTabs" role="tablist">
        <li class="nav-item" role="presentation">
            <button class="nav-link active" id="tab-overview" data-bs-toggle="tab" data-bs-target="#pane-overview" type="button" role="tab">
                <i class="bi bi-info-circle me-1"></i>Overview
            </button>
        </li>
        <li class="nav-item" role="presentation">
            <button class="nav-link" id="tab-users" data-bs-toggle="tab" data-bs-target="#pane-users" type="button" role="tab">
                <i class="bi bi-people me-1"></i>Users
                <span class="badge bg-secondary ms-1">@Model.Users.Count</span>
            </button>
        </li>
        <li class="nav-item" role="presentation">
            <button class="nav-link" id="tab-subscription" data-bs-toggle="tab" data-bs-target="#pane-subscription" type="button" role="tab">
                <i class="bi bi-credit-card me-1"></i>Subscription
            </button>
        </li>
        <li class="nav-item" role="presentation">
            <button class="nav-link" id="tab-onboarding" data-bs-toggle="tab" data-bs-target="#pane-onboarding" type="button" role="tab">
                <i class="bi bi-rocket-takeoff me-1"></i>Onboarding
            </button>
        </li>
        <li class="nav-item" role="presentation">
            <button class="nav-link" id="tab-health" data-bs-toggle="tab" data-bs-target="#pane-health" type="button" role="tab">
                <i class="bi bi-heart-pulse me-1"></i>Health
            </button>
        </li>
    </ul>

    <div class="tab-content" id="companyDetailTabContent">

        <!-- ── Overview tab ── -->
        <div class="tab-pane fade show active" id="pane-overview" role="tabpanel">
            <div class="row g-3">
                <div class="col-lg-6">
                    <div class="card shadow-sm h-100">
                        <div class="card-header bg-light">
                            <h6 class="mb-0"><i class="bi bi-info-circle me-2"></i>Company Information</h6>
                        </div>
                        <div class="card-body">
                            <table class="table table-sm table-borderless mb-0">
                                <tr><th style="width:40%">Company Name</th><td>@Model.CompanyName</td></tr>
                                <tr><th>Code</th><td>@(Model.CompanyCode ?? "—")</td></tr>
                                <tr><th>Status</th><td><span class="badge @(Model.IsActive ? "bg-success" : "bg-danger")">@(Model.IsActive ? "Active" : "Inactive")</span></td></tr>
                                <tr><th>Time Zone</th><td>@(Model.TimeZone ?? "America/New_York")</td></tr>
                                <tr><th>Created</th><td>@Model.CreatedAt.ToString("MMM d, yyyy h:mm tt")</td></tr>
                                @if (!string.IsNullOrEmpty(Model.CreatedBy))
                                {
                                    <tr><th>Created By</th><td>@Model.CreatedBy</td></tr>
                                }
                                @if (Model.UpdatedAt.HasValue)
                                {
                                    <tr><th>Last Updated</th><td>@Model.UpdatedAt.Value.ToString("MMM d, yyyy")</td></tr>
                                }
                            </table>
                        </div>
                    </div>
                </div>

                <div class="col-lg-6">
                    <div class="card shadow-sm h-100">
                        <div class="card-header bg-light">
                            <h6 class="mb-0"><i class="bi bi-person-lines-fill me-2"></i>Primary Contact</h6>
                        </div>
                        <div class="card-body">
                            <table class="table table-sm table-borderless mb-0">
                                <tr><th style="width:40%">Contact Name</th><td>@Model.PrimaryContactName</td></tr>
                                <tr><th>Email</th><td><a href="mailto:@Model.PrimaryContactEmail">@Model.PrimaryContactEmail</a></td></tr>
                                <tr><th>Phone</th><td>@(Model.Phone ?? "—")</td></tr>
                            </table>
                        </div>
                    </div>
                </div>

                <div class="col-lg-6">
                    <div class="card shadow-sm h-100">
                        <div class="card-header bg-light">
                            <h6 class="mb-0"><i class="bi bi-geo-alt me-2"></i>Address</h6>
                        </div>
                        <div class="card-body">
                            @if (!string.IsNullOrEmpty(Model.Address))
                            {
                                <address class="mb-0">
                                    @Model.Address<br />
                                    @if (!string.IsNullOrEmpty(Model.City) || !string.IsNullOrEmpty(Model.State))
                                    {
                                        <text>@Model.City, @Model.State @Model.ZipCode</text>
                                    }
                                </address>
                            }
                            else
                            {
                                <span class="text-muted">No address on file.</span>
                            }
                        </div>
                    </div>
                </div>

                @if (!string.IsNullOrEmpty(Model.StripeCustomerId) || !string.IsNullOrEmpty(Model.StripeSubscriptionId))
                {
                    <div class="col-lg-6">
                        <div class="card shadow-sm h-100">
                            <div class="card-header bg-light">
                                <h6 class="mb-0"><i class="bi bi-stripe me-2"></i>Stripe IDs</h6>
                            </div>
                            <div class="card-body">
                                <table class="table table-sm table-borderless mb-0">
                                    @if (!string.IsNullOrEmpty(Model.StripeCustomerId))
                                    {
                                        <tr><th style="width:40%">Customer</th><td><code class="small">@Model.StripeCustomerId</code></td></tr>
                                    }
                                    @if (!string.IsNullOrEmpty(Model.StripeSubscriptionId))
                                    {
                                        <tr><th>Subscription</th><td><code class="small">@Model.StripeSubscriptionId</code></td></tr>
                                    }
                                </table>
                            </div>
                        </div>
                    </div>
                }
            </div>
        </div>

        <!-- ── Users tab ── -->
        <div class="tab-pane fade" id="pane-users" role="tabpanel">
            <div class="card shadow-sm">
                <div class="card-header bg-light d-flex justify-content-between align-items-center">
                    <h6 class="mb-0"><i class="bi bi-people me-2"></i>Users (@Model.Users.Count)</h6>
                    <a asp-action="CreateCompanyAdmin" asp-route-id="@Model.Id" class="btn btn-sm btn-success">
                        <i class="bi bi-person-plus me-1"></i>Add Admin User
                    </a>
                </div>
                <div class="card-body p-0">
                    @if (Model.Users.Any())
                    {
                        <div class="table-responsive">
                            <table class="table table-hover mb-0">
                                <thead class="table-light">
                                    <tr>
                                        <th>Name</th>
                                        <th>Email</th>
                                        <th>Role</th>
                                        <th>Department</th>
                                        <th>Status</th>
                                        <th>Last Login</th>
                                        <th class="text-end">Actions</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach (var user in Model.Users.OrderBy(u => u.LastName))
                                    {
                                        <tr class="user-row" style="cursor:pointer;"
                                            data-user-id="@user.Id"
                                            data-company-id="@Model.Id"
                                            title="Click to view user details and login history">
                                            <td>
                                                <strong>@user.FullName</strong>
                                                @if (user.CompanyRole == null)
                                                {
                                                    <span class="badge bg-warning text-dark ms-1">
                                                        <i class="bi bi-star-fill"></i> SuperAdmin
                                                    </span>
                                                }
                                            </td>
                                            <td><a href="mailto:@user.Email">@user.Email</a></td>
                                            <td>
                                                @if (!string.IsNullOrEmpty(user.CompanyRole))
                                                {
                                                    <span class="badge @(user.CompanyRole switch {
                                                        "CompanyAdmin" => "bg-primary",
                                                        "Manager"      => "bg-info",
                                                        "Worker"       => "bg-secondary",
                                                        _              => "bg-light text-dark"
                                                    })">@user.CompanyRole.Replace("Company", "")</span>
                                                }
                                                else { <span class="text-muted">N/A</span> }
                                            </td>
                                            <td>@(user.Department ?? "—")</td>
                                            <td>
                                                <span class="badge @(user.IsActive ? "bg-success" : "bg-danger")">
                                                    @(user.IsActive ? "Active" : "Inactive")
                                                </span>
                                            </td>
                                            <td>
                                                <small class="text-muted">
                                                    @(user.LastLoginDate.HasValue
                                                        ? user.LastLoginDate.Value.ToString("MMM d, yyyy")
                                                        : "Never")
                                                </small>
                                            </td>
                                            <td class="text-end" onclick="event.stopPropagation()">
                                                @if (user.CompanyRole != null)
                                                {
                                                    <div class="btn-group btn-group-sm">
                                                        <a asp-controller="CompanyUsers" asp-action="Edit"
                                                           asp-route-id="@user.Id"
                                                           asp-route-returnUrl="@Url.Action("Details", "Companies", new { id = Model.Id })"
                                                           class="btn btn-outline-primary" title="Edit">
                                                            <i class="bi bi-pencil"></i>
                                                        </a>
                                                        <button type="button" class="btn btn-outline-secondary"
                                                                data-bs-toggle="modal" data-bs-target="#resetPasswordModal"
                                                                data-user-id="@user.Id" data-user-name="@user.FullName"
                                                                title="Reset Password">
                                                            <i class="bi bi-key"></i>
                                                        </button>
                                                        <form asp-controller="CompanyUsers" asp-action="SendPasswordResetEmail"
                                                              asp-route-id="@user.Id" method="post" class="d-inline"
                                                              onsubmit="return confirm('Send a password reset link to @Html.Encode(user.Email)?')">
                                                            @Html.AntiForgeryToken()
                                                            <button type="submit" class="btn btn-outline-info" title="Email reset link">
                                                                <i class="bi bi-envelope-arrow-up"></i>
                                                            </button>
                                                        </form>
                                                        <form asp-controller="CompanyUsers" asp-action="ToggleActive"
                                                              asp-route-id="@user.Id" method="post" class="d-inline">
                                                            @Html.AntiForgeryToken()
                                                            <button type="submit"
                                                                    class="btn btn-outline-@(user.IsActive ? "warning" : "success")"
                                                                    title="@(user.IsActive ? "Deactivate" : "Activate")">
                                                                <i class="bi bi-@(user.IsActive ? "pause" : "play")"></i>
                                                            </button>
                                                        </form>
                                                    </div>
                                                }
                                                else
                                                {
                                                    <span class="text-muted small">Platform User</span>
                                                }
                                            </td>
                                        </tr>
                                    }
                                </tbody>
                            </table>
                        </div>
                    }
                    else
                    {
                        <div class="text-center py-5">
                            <i class="bi bi-people" style="font-size: 3rem; color: #ccc;"></i>
                            <p class="text-muted mt-3 mb-3">No users found for this company.</p>
                            <a asp-action="CreateCompanyAdmin" asp-route-id="@Model.Id" class="btn btn-primary">
                                <i class="bi bi-person-plus me-1"></i>Create First Admin User
                            </a>
                        </div>
                    }
                </div>
            </div>
        </div>

        <!-- ── Subscription tab ── -->
        <div class="tab-pane fade" id="pane-subscription" role="tabpanel">
            <div class="row g-3">
                <div class="col-lg-6">
                    <div class="card shadow-sm h-100">
                        <div class="card-header bg-light">
                            <h6 class="mb-0"><i class="bi bi-credit-card me-2"></i>Subscription</h6>
                        </div>
                        <div class="card-body">
                            <table class="table table-sm table-borderless mb-3">
                                <tr>
                                    <th style="width:40%">Plan</th>
                                    <td><span class="badge @PlanBadge(Model.SubscriptionPlan)">@PlanName(Model.SubscriptionPlan)</span></td>
                                </tr>
                                <tr>
                                    <th>Status</th>
                                    <td>
                                        @{
                                            var (ssBadge, ssLabel) = Model.SubscriptionStatus switch {
                                                PowderCoating.Core.Enums.SubscriptionStatus.Active      => ("bg-success", "Active"),
                                                PowderCoating.Core.Enums.SubscriptionStatus.GracePeriod => ("bg-warning text-dark", "Grace Period"),
                                                PowderCoating.Core.Enums.SubscriptionStatus.Expired     => ("bg-danger", "Expired"),
                                                PowderCoating.Core.Enums.SubscriptionStatus.Canceled    => ("bg-secondary", "Canceled"),
                                                PowderCoating.Core.Enums.SubscriptionStatus.Inactive    => ("bg-secondary", "Inactive"),
                                                _                                                        => ("bg-secondary", Model.SubscriptionStatus.ToString())
                                            };
                                        }
                                        <span class="badge @ssBadge">@ssLabel</span>
                                    </td>
                                </tr>
                                <tr>
                                    <th>Start Date</th>
                                    <td>@Model.SubscriptionStartDate.ToString("MMMM d, yyyy")</td>
                                </tr>
                                <tr>
                                    <th>End Date</th>
                                    <td>
                                        @if (Model.SubscriptionEndDate.HasValue)
                                        {
                                            var daysLeft = (int)(Model.SubscriptionEndDate.Value.Date - DateTime.UtcNow.Date).TotalDays;
                                            <span class="@(daysLeft < 0 ? "text-danger" : daysLeft <= 14 ? "text-warning" : "")">
                                                @Model.SubscriptionEndDate.Value.ToString("MMMM d, yyyy")
                                                @if (daysLeft >= 0 && daysLeft <= 30) { <small class="text-muted">(in @daysLeft days)</small> }
                                                @if (daysLeft < 0) { <small>(expired @(-daysLeft)d ago)</small> }
                                            </span>
                                        }
                                        else
                                        {
                                            <span class="text-muted">Ongoing</span>
                                        }
                                    </td>
                                </tr>
                            </table>
                            <a asp-controller="SubscriptionManagement" asp-action="Manage" asp-route-id="@Model.Id"
                               class="btn btn-primary">
                                <i class="bi bi-sliders me-1"></i>Manage Subscription & Features
                            </a>
                        </div>
                    </div>
                </div>

                <div class="col-lg-6">
                    <div class="card shadow-sm h-100">
                        <div class="card-header bg-light">
                            <h6 class="mb-0"><i class="bi bi-speedometer2 me-2"></i>Activity Snapshot</h6>
                        </div>
                        <div class="card-body">
                            <table class="table table-sm table-borderless mb-0">
                                <tr>
                                    <th style="width:55%">Last Login</th>
                                    <td>
                                        @if (lastLogin.HasValue)
                                        {
                                            var days = (int)(DateTime.UtcNow - lastLogin.Value).TotalDays;
                                            <span class="@(days >= 60 ? "text-danger" : days >= 30 ? "text-warning" : "text-success")">
                                                @lastLogin.Value.ToString("MMM d, yyyy") (@days days ago)
                                            </span>
                                        }
                                        else { <span class="text-muted">Never</span> }
                                    </td>
                                </tr>
                                <tr><th>Jobs (last 30d)</th><td>@jobs30</td></tr>
                                <tr><th>Jobs (last 90d)</th><td>@jobs90</td></tr>
                                <tr><th>Jobs total</th><td>@Model.JobCount</td></tr>
                                <tr><th>Customers</th><td>@Model.CustomerCount</td></tr>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- ── Onboarding tab ── -->
        <div class="tab-pane fade" id="pane-onboarding" role="tabpanel">
            @if (onboarding != null)
            {
                <div class="row g-3">
                    <div class="col-lg-6">
                        <div class="card shadow-sm h-100">
                            <div class="card-header bg-light">
                                <h6 class="mb-0"><i class="bi bi-rocket-takeoff me-2"></i>Setup Progress</h6>
                            </div>
                            <div class="card-body">
                                <div class="d-flex flex-wrap gap-2 mb-3">
                                    @{
                                        var (obBadge, obLabel) = onboarding.Status switch {
                                            OnboardingStatus.Complete    => ("bg-success", "Complete"),
                                            OnboardingStatus.InProgress  => ("bg-primary", "In Progress"),
                                            OnboardingStatus.Dismissed   => ("bg-secondary", "Dismissed"),
                                            _                            => ("bg-light text-dark border", "Not Started")
                                        };
                                    }
                                    <span>
                                        <span class="text-muted small me-1">Status:</span>
                                        <span class="badge @obBadge">@obLabel</span>
                                    </span>
                                    @if (!string.IsNullOrEmpty(onboarding.OnboardingPath))
                                    {
                                        <span>
                                            <span class="text-muted small me-1">Path:</span>
                                            <span class="badge bg-info">@onboarding.OnboardingPath</span>
                                        </span>
                                    }
                                </div>

                                <table class="table table-sm table-borderless mb-3">
                                    <tr>
                                        <th style="width:55%">Setup Wizard</th>
                                        <td>
                                            @if (onboarding.WizardCompleted)
                                            {
                                                <span class="text-success"><i class="bi bi-check-circle-fill me-1"></i>Complete</span>
                                            }
                                            else
                                            {
                                                <span class="text-muted"><i class="bi bi-hourglass me-1"></i>Pending</span>
                                            }
                                        </td>
                                    </tr>
                                    <tr>
                                        <th>Milestones</th>
                                        <td>@onboarding.StepsCompleted / @onboarding.TotalSteps</td>
                                    </tr>
                                </table>

                                <div class="progress mb-3" style="height:8px;">
                                    @{
                                        var pct = onboarding.TotalSteps > 0
                                            ? (int)(onboarding.StepsCompleted * 100.0 / onboarding.TotalSteps)
                                            : 0;
                                        var barClass = pct == 100 ? "bg-success" : pct > 0 ? "bg-primary" : "bg-secondary";
                                    }
                                    <div class="progress-bar @barClass" style="width:@pct%"></div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="col-lg-6">
                        <div class="card shadow-sm h-100">
                            <div class="card-header bg-light">
                                <h6 class="mb-0"><i class="bi bi-flag me-2"></i>Milestone Dates</h6>
                            </div>
                            <div class="card-body">
                                <table class="table table-sm table-borderless mb-0">
                                    <tr>
                                        <th style="width:55%">First Job / Quote</th>
                                        <td>
                                            @{
                                                var firstActivity = onboarding.FirstJobCreatedAt ?? onboarding.FirstQuoteCreatedAt;
                                            }
                                            @(firstActivity.HasValue ? firstActivity.Value.ToString("MMM d, yyyy") : "—")
                                        </td>
                                    </tr>
                                    <tr>
                                        <th>First Invoice</th>
                                        <td>@(onboarding.FirstInvoiceCreatedAt.HasValue ? onboarding.FirstInvoiceCreatedAt.Value.ToString("MMM d, yyyy") : "—")</td>
                                    </tr>
                                    <tr>
                                        <th>Workflow Completed</th>
                                        <td>@(onboarding.FirstWorkflowCompletedAt.HasValue ? onboarding.FirstWorkflowCompletedAt.Value.ToString("MMM d, yyyy") : "—")</td>
                                    </tr>
                                    <tr>
                                        <th>Widget Dismissed</th>
                                        <td>@(onboarding.GuidedActivationDismissedAt.HasValue ? onboarding.GuidedActivationDismissedAt.Value.ToString("MMM d, yyyy") : "—")</td>
                                    </tr>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            }
            else
            {
                <p class="text-muted">Onboarding data not available.</p>
            }
        </div>

        <!-- ── Health tab ── -->
        <div class="tab-pane fade" id="pane-health" role="tabpanel">
            <div class="row g-3">
                <div class="col-lg-4">
                    <div class="card shadow-sm h-100">
                        <div class="card-header bg-light">
                            <h6 class="mb-0"><i class="bi bi-heart-pulse me-2"></i>Health Score</h6>
                        </div>
                        <div class="card-body text-center py-4">
                            <div class="display-4 fw-bold @ScoreColor(healthScore)">@healthScore</div>
                            <div class="mt-1 mb-3">
                                <span class="badge @RiskBadgeClass(healthRisk) fs-6">@RiskLabel(healthRisk)</span>
                            </div>
                            <div class="progress" style="height:10px;">
                                <div class="progress-bar @(healthScore >= 75 ? "bg-success" : healthScore >= 45 ? "bg-warning" : "bg-danger")"
                                     style="width:@healthScore%"></div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-lg-8">
                    <div class="card shadow-sm h-100">
                        <div class="card-header bg-light">
                            <h6 class="mb-0"><i class="bi bi-flag me-2"></i>Risk Signals</h6>
                        </div>
                        <div class="card-body">
                            @if (healthSignals.Any())
                            {
                                <ul class="list-group list-group-flush">
                                    @foreach (var signal in healthSignals)
                                    {
                                        <li class="list-group-item d-flex align-items-center gap-2 px-0">
                                            <i class="bi bi-exclamation-triangle-fill text-warning"></i>
                                            @signal
                                        </li>
                                    }
                                </ul>
                            }
                            else
                            {
                                <div class="text-center py-3 text-success">
                                    <i class="bi bi-check-circle-fill fs-3"></i>
                                    <p class="mb-0 mt-2">No risk signals detected.</p>
                                </div>
                            }

                            <hr class="my-3" />

                            <div class="d-flex gap-2">
                                <a asp-controller="CompanyHealth" asp-action="Index"
                                   asp-route-search="@Model.PrimaryContactEmail"
                                   class="btn btn-sm btn-outline-secondary">
                                    <i class="bi bi-binoculars me-1"></i>View in Health Dashboard
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </div><!-- /tab-content -->

    <!-- Danger Zone (outside tabs — always present) -->
    <div class="card shadow-sm border-danger mt-4">
        <div class="card-header bg-light">
            <h6 class="card-title mb-0 text-danger">
                <i class="bi bi-exclamation-triangle me-2"></i>Danger Zone
            </h6>
        </div>
        <div class="card-body d-flex flex-column gap-3">
            <div class="d-flex justify-content-between align-items-start border rounded p-3 bg-warning bg-opacity-10">
                <div>
                    <h6 class="mb-1 text-warning-emphasis"><i class="bi bi-fire me-1"></i>Reset All Company Data</h6>
                    <p class="text-muted small mb-0">
                        Permanently deletes all business data — customers, jobs, quotes, invoices, inventory, and more.
                        The company record, users, and settings are preserved. Use this to wipe a migration and start fresh.
                    </p>
                </div>
                <button type="button" class="btn btn-warning ms-3 text-nowrap"
                        data-bs-toggle="modal" data-bs-target="#resetDataModal">
                    <i class="bi bi-fire me-1"></i>Reset Data
                </button>
            </div>
            <div class="d-flex justify-content-between align-items-start border rounded p-3 bg-danger bg-opacity-10">
                <div>
                    <h6 class="mb-1 text-danger"><i class="bi bi-trash me-1"></i>Delete Company</h6>
                    <p class="text-muted small mb-0">
                        Permanently deletes the company and everything in it. There is no going back.
                        @if (Model.UserCount > 0)
                        {
                            <br /><strong class="text-danger">This company has @Model.UserCount user(s) — remove them first.</strong>
                        }
                    </p>
                </div>
                <button type="button" class="btn btn-danger ms-3 text-nowrap"
                        data-bs-toggle="modal" data-bs-target="#hardDeleteModal"
                        @(Model.UserCount > 0 ? "disabled" : "")>
                    <i class="bi bi-trash me-1"></i>Delete Company
                </button>
            </div>
        </div>
    </div>
</div>

<!-- User Details Modal -->
<div class="modal fade" tabindex="-1" id="userDetailOffcanvas" aria-labelledby="userDetailOffcanvasLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable" style="max-width:520px;">
        <div class="modal-content">
            <div class="modal-header border-bottom">
                <h5 class="modal-title" id="userDetailOffcanvasLabel">
                    <i class="bi bi-person-circle me-2"></i><span id="oc-name">User Details</span>
                </h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body p-0">
                <div id="oc-loading" class="d-flex justify-content-center align-items-center py-5">
                    <div class="spinner-border text-primary" role="status"><span class="visually-hidden">Loading…</span></div>
                </div>
                <div id="oc-content" style="display:none;">
                    <div class="px-3 pt-3 pb-2">
                        <div class="d-flex align-items-center gap-3 mb-3">
                            <div class="bg-primary bg-opacity-10 rounded-circle d-flex align-items-center justify-content-center flex-shrink-0"
                                 style="width:52px;height:52px;">
                                <i class="bi bi-person-fill text-primary fs-4"></i>
                            </div>
                            <div>
                                <h6 class="mb-0 fw-semibold" id="oc-fullname"></h6>
                                <small class="text-muted" id="oc-email"></small>
                            </div>
                            <span id="oc-status-badge" class="badge ms-auto"></span>
                        </div>
                        <table class="table table-sm table-borderless mb-0 small">
                            <tr><th style="width:38%;" class="text-muted fw-normal">Role</th><td id="oc-role">—</td></tr>
                            <tr><th class="text-muted fw-normal">Department</th><td id="oc-dept">—</td></tr>
                            <tr><th class="text-muted fw-normal">Position</th><td id="oc-position">—</td></tr>
                            <tr><th class="text-muted fw-normal">Phone</th><td id="oc-phone">—</td></tr>
                            <tr><th class="text-muted fw-normal">Hired</th><td id="oc-hire">—</td></tr>
                            <tr><th class="text-muted fw-normal">Account created</th><td id="oc-created">—</td></tr>
                            <tr><th class="text-muted fw-normal">Last login</th><td id="oc-lastlogin">—</td></tr>
                            <tr><th class="text-muted fw-normal">Email confirmed</th><td id="oc-emailconf">—</td></tr>
                        </table>
                    </div>
                    <hr class="my-0" />
                    <div class="px-3 pt-3">
                        <h6 class="fw-semibold mb-2">
                            <i class="bi bi-clock-history me-1"></i>Login History
                            <span class="text-muted fw-normal small" id="oc-log-count"></span>
                        </h6>
                    </div>
                    <div id="oc-no-logs" class="px-3 pb-3 text-muted small" style="display:none;">
                        No login records found.
                    </div>
                    <div class="table-responsive" id="oc-log-table-wrap">
                        <table class="table table-sm table-hover mb-0 small">
                            <thead class="table-light sticky-top">
                                <tr><th>Time</th><th>Event</th><th>IP Address</th></tr>
                            </thead>
                            <tbody id="oc-log-body"></tbody>
                        </table>
                    </div>
                </div>
                <div id="oc-error" class="px-3 py-4 text-danger small" style="display:none;">
                    <i class="bi bi-exclamation-triangle me-1"></i><span id="oc-error-msg">Failed to load user data.</span>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- Reset Data Modal -->
<div class="modal fade" id="resetDataModal" tabindex="-1" aria-labelledby="resetDataModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content border-warning">
            <div class="modal-header bg-warning bg-opacity-10">
                <h5 class="modal-title text-warning-emphasis" id="resetDataModalLabel">
                    <i class="bi bi-fire me-2"></i>Reset All Company Data
                </h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                <div class="alert alert-warning alert-permanent">
                    <strong>This will permanently delete:</strong>
                    <ul class="mb-0 mt-1">
                        <li>All customers, vendors, catalog items, and inventory</li>
                        <li>All chart of accounts entries</li>
                        <li>All invoices, bills, payments, and deposits</li>
                        <li>All jobs, quotes, and purchase orders</li>
                        <li>All equipment, shop workers, and maintenance records</li>
                    </ul>
                </div>
                <p><strong>Preserved:</strong> Company record, users, operating costs, preferences, and lookup tables.</p>
                <p class="mb-1">Type <strong>DELETE</strong> to confirm:</p>
                <input type="text" id="resetDataConfirmInput" class="form-control" placeholder="Type DELETE here" autocomplete="off" />
            </div>
            <form asp-action="ResetData" asp-route-id="@Model.Id" method="post" id="resetDataForm">
                @Html.AntiForgeryToken()
                <input type="hidden" name="confirmation" id="resetDataConfirmHidden" />
                <div class="modal-footer">
                    <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Cancel</button>
                    <button type="submit" id="btnResetDataConfirm" class="btn btn-warning" disabled>
                        <i class="bi bi-fire me-1"></i>Reset All Data
                    </button>
                </div>
            </form>
        </div>
    </div>
</div>

<!-- Hard Delete Modal -->
<div class="modal fade" id="hardDeleteModal" tabindex="-1" aria-labelledby="hardDeleteModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content border-danger">
            <div class="modal-header bg-danger bg-opacity-10">
                <h5 class="modal-title text-danger" id="hardDeleteModalLabel">
                    <i class="bi bi-trash me-2"></i>Permanently Delete Company
                </h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body">
                <div class="alert alert-danger alert-permanent">
                    <strong>This will permanently delete the company and everything in it.</strong> This cannot be undone.
                </div>
                <p class="mb-1">Type <strong>DELETE</strong> to confirm:</p>
                <input type="text" id="hardDeleteConfirmInput" class="form-control" placeholder="Type DELETE here" autocomplete="off" />
            </div>
            <form asp-action="HardDelete" asp-route-id="@Model.Id" method="post" id="hardDeleteForm">
                @Html.AntiForgeryToken()
                <input type="hidden" name="confirmation" id="hardDeleteConfirmHidden" />
                <div class="modal-footer">
                    <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Cancel</button>
                    <button type="submit" id="btnHardDeleteConfirm" class="btn btn-danger" disabled>
                        <i class="bi bi-trash me-1"></i>Permanently Delete
                    </button>
                </div>
            </form>
        </div>
    </div>
</div>

<!-- Reset Password Modal -->
<div class="modal fade" id="resetPasswordModal" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title"><i class="bi bi-key me-2"></i>Reset Password</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <form id="resetPasswordForm" asp-controller="CompanyUsers" asp-action="ResetPassword" method="post">
                @Html.AntiForgeryToken()
                <input type="hidden" id="resetUserId" name="id" />
                <div class="modal-body">
                    <div class="alert alert-warning alert-permanent">
                        <i class="bi bi-exclamation-triangle me-2"></i>
                        Resetting password for <strong id="resetUserName"></strong>.
                    </div>
                    <div class="mb-3">
                        <label for="newPassword" class="form-label">New Password</label>
                        <input type="password" class="form-control" id="newPassword" name="newPassword" required minlength="8">
                        <small class="text-muted">Min 8 characters with uppercase, lowercase, digit, and special character.</small>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Cancel</button>
                    <button type="submit" class="btn btn-primary"><i class="bi bi-key me-2"></i>Reset Password</button>
                </div>
            </form>
        </div>
    </div>
</div>

@section Scripts {
<script src="~/js/companies-details.js" asp-append-version="true"></script>
}