@page
@model Status.Pages.Admin.CertificatesModel
@{
    ViewData["Title"] = "Manage Certificates";
    ViewData["Page"] = "admin-certs";
}

@if (!string.IsNullOrEmpty(Model.Message))
{
    <div class="alert alert-success">✓ @Model.Message</div>
}

<div class="section-header">
    <span class="section-title">SSL Certificates</span>
    <button class="btn btn-primary" onclick="openModal('add-cert-modal')">+ Add Certificate</button>
</div>

<div class="card">
    <table class="data-table">
        <thead><tr>
            <th>Name</th>
            <th>Domain</th>
            <th>Issuer</th>
            <th>Issued</th>
            <th>Expires</th>
            <th>Days Left</th>
            <th>Status</th>
            <th>Actions</th>
        </tr></thead>
        <tbody>
        @foreach (var c in Model.Certificates)
        {
            var now = DateTime.UtcNow;
            var days = c.ExpiresAt.HasValue ? (int)(c.ExpiresAt.Value - now).TotalDays : (int?)null;
            var cls = days == null ? "" : days <= 0 ? "cert-expiry-expired" : days <= 7 ? "cert-expiry-critical" : days <= 30 ? "cert-expiry-warn" : "cert-expiry-ok";
            <tr>
                <td style="font-weight:500;color:var(--text-primary)">@c.Name</td>
                <td class="mono" style="font-size:11px">@c.Domain:@c.Port</td>
                <td style="font-size:11px;color:var(--text-muted);max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap" title="@c.Issuer">@(c.Issuer?.Split(',')[0] ?? "—")</td>
                <td class="mono" style="font-size:11px">@(c.IssuedAt?.ToString("yyyy-MM-dd") ?? "—")</td>
                <td class="mono @cls" style="font-size:11px">@(c.ExpiresAt?.ToString("yyyy-MM-dd") ?? "—")</td>
                <td class="mono @cls" style="font-size:11px;font-weight:700">@(days.HasValue ? days + "d" : "—")</td>
                <td>
                    @if (!string.IsNullOrEmpty(c.LastError)) { <span class="badge badge-down" title="@c.LastError">ERROR</span> }
                    else if (days == null) { <span class="badge badge-unknown">Unchecked</span> }
                    else if (days <= 0) { <span class="badge badge-down">EXPIRED</span> }
                    else if (days <= 7) { <span class="badge badge-down">CRITICAL</span> }
                    else if (days <= 30) { <span class="badge badge-warn">EXPIRING</span> }
                    else { <span class="badge badge-up">VALID</span> }
                </td>
                <td>
                    <div class="flex gap-2">
                        <form method="post" asp-page-handler="CheckNow">
                            <input type="hidden" name="id" value="@c.Id" />
                            <button type="submit" class="btn btn-outline btn-sm">▶ Check</button>
                        </form>
                        <form method="post" asp-page-handler="Delete" onsubmit="return confirm('Delete @c.Name?')">
                            <input type="hidden" name="id" value="@c.Id" />
                            <button type="submit" class="btn btn-danger btn-sm">Delete</button>
                        </form>
                    </div>
                </td>
            </tr>
        }
        @if (!Model.Certificates.Any())
        {
            <tr><td colspan="8" style="text-align:center;padding:32px;color:var(--text-muted)">No certificates tracked yet.</td></tr>
        }
        </tbody>
    </table>
</div>

<!-- Add Cert Modal -->
<div class="modal-overlay" id="add-cert-modal">
    <div class="modal">
        <div class="modal-header">
            <span class="modal-title">Add Certificate</span>
            <button class="modal-close" onclick="closeModal('add-cert-modal')">✕</button>
        </div>
        <form method="post" asp-page-handler="Save">
            <div class="modal-body">
                <input type="hidden" name="EditCert.Id" value="0" />
                <div class="two-col">
                    <div class="form-group">
                        <label class="form-label">Name *</label>
                        <input type="text" name="EditCert.Name" class="form-control" required placeholder="My Site" />
                    </div>
                    <div class="form-group">
                        <label class="form-label">Domain *</label>
                        <input type="text" name="EditCert.Domain" class="form-control" required placeholder="example.com" />
                    </div>
                </div>
                <div class="two-col">
                    <div class="form-group">
                        <label class="form-label">Port</label>
                        <input type="number" name="EditCert.Port" class="form-control" value="443" />
                    </div>
                    <div class="form-group">
                        <label class="form-label">Alert Days Before Expiry</label>
                        <input type="number" name="EditCert.AlertDaysBeforeExpiry" class="form-control" value="30" />
                    </div>
                </div>
                <div class="flex gap-3 align-center">
                    <label class="flex align-center gap-2" style="cursor:pointer">
                        <label class="toggle">
                            <input type="checkbox" name="EditCert.IsPublic" checked />
                            <span class="toggle-slider"></span>
                        </label>
                        <span style="font-size:13px">Public</span>
                    </label>
                    <label class="flex align-center gap-2" style="cursor:pointer">
                        <label class="toggle">
                            <input type="checkbox" name="EditCert.AlertOnExpiry" checked />
                            <span class="toggle-slider"></span>
                        </label>
                        <span style="font-size:13px">Alert on Expiry</span>
                    </label>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-outline" onclick="closeModal('add-cert-modal')">Cancel</button>
                <button type="submit" class="btn btn-primary">Save</button>
            </div>
        </form>
    </div>
</div>