From 5539ec8542c026c433eca02a370e7afe8f6289b1 Mon Sep 17 00:00:00 2001
From: Joseph Doherty <dohejw01@gmail.com>
Date: Wed, 3 Jun 2026 04:37:23 -0400
Subject: [PATCH] chore(dashboard): prune dead sidebar + orphaned login CSS
 from site.css

Removed the dead .sidebar nav block (replaced by the kit's .side-rail shell) and
the orphaned .dashboard-login/.login-card rules (the /login page now uses the
kit's <LoginCard>). Kept .app-bar (still used by the /denied page header) and the
.chip white-space override (emitted by StatusPill); corrected the now-stale
app-bar comment. 106 lines removed; builds clean.
---
 .../wwwroot/css/site.css                      | 109 +-----------------
 1 file changed, 3 insertions(+), 106 deletions(-)

diff --git a/src/ZB.MOM.WW.MxGateway.Server/wwwroot/css/site.css b/src/ZB.MOM.WW.MxGateway.Server/wwwroot/css/site.css
index 100071c..40542db 100644
--- a/src/ZB.MOM.WW.MxGateway.Server/wwwroot/css/site.css
+++ b/src/ZB.MOM.WW.MxGateway.Server/wwwroot/css/site.css
@@ -9,108 +9,13 @@
 body.dashboard-body { min-height: 100vh; }
 
 /* ── App bar ─────────────────────────────────────────────────────────────────
-   theme.css styles .app-bar / .brand / .mark / .spacer. Here we centre the row
-   and add the meta cluster. Navigation lives in the side rail below. */
+   The kit's theme.css styles .app-bar / .brand / .mark / .spacer; these rules
+   centre the row and tweak the brand. Used by the minimal /denied page header —
+   the main dashboard's navigation lives in the kit side-rail shell (ThemeShell). */
 .app-bar { align-items: center; gap: 1rem; }
 .app-bar .brand { color: var(--ink); }
 .app-bar .brand:hover { text-decoration: none; }
 
-/* ── Sidebar ─────────────────────────────────────────────────────────────────
-   Left-rail navigation. Pattern lifted from ScadaLink CentralUI: a fixed-width
-   sidebar that hosts the brand at the top, a scrollable nav region with
-   collapsible NavSections in the middle, and a sign-in/out footer at the
-   bottom. The sidebar is wrapped in a Bootstrap .collapse so a hamburger
-   button can show/hide it on <lg viewports. */
-.sidebar {
-  min-width: 220px;
-  max-width: 220px;
-  height: 100vh;
-  background: var(--card);
-  border-right: 1px solid var(--rule-strong);
-}
-
-/* Pin the sidebar to the viewport on lg+ so it stays visible when the main
-   content scrolls past 100vh. The wrapper is the flex child of MainLayout;
-   align-self prevents the flex row from stretching it. */
-@media (min-width: 992px) {
-  #sidebar-collapse {
-    position: sticky;
-    top: 0;
-    height: 100vh;
-    align-self: flex-start;
-    z-index: 1020;
-  }
-}
-
-/* When collapsed under <lg viewports the Bootstrap collapse container removes
-   the fixed width; restore full width on mobile. */
-@media (max-width: 991.98px) {
-  .sidebar {
-    min-width: 100%;
-    max-width: 100%;
-    height: auto;
-  }
-}
-
-.sidebar .brand {
-  display: block;
-  color: var(--ink);
-  font-size: 1.1rem;
-  font-weight: 600;
-  letter-spacing: 0.02em;
-  padding: 1rem;
-  border-bottom: 1px solid var(--rule);
-  text-decoration: none;
-}
-.sidebar .brand:hover { text-decoration: none; }
-.sidebar .brand .mark { color: var(--accent); }
-
-.sidebar .nav-link {
-  color: var(--ink-soft);
-  padding: 0.4rem 1rem;
-  font-size: 0.9rem;
-}
-.sidebar .nav-link:hover {
-  color: var(--ink);
-  background-color: var(--paper);
-  text-decoration: none;
-}
-.sidebar .nav-link.active {
-  color: var(--accent-deep);
-  background-color: var(--paper);
-  font-weight: 600;
-  /* Left accent so active state isn't carried by colour alone. */
-  border-left: 3px solid var(--accent);
-  padding-left: calc(1rem - 3px);
-}
-
-/* Collapsible section header — a full-width button styled as an uppercase
-   eyebrow with a leading expand/collapse chevron. */
-.sidebar .nav-section-toggle {
-  display: flex;
-  align-items: center;
-  gap: 0.4rem;
-  width: 100%;
-  background: none;
-  border: 0;
-  cursor: pointer;
-  text-align: left;
-  color: var(--ink-faint);
-  font-size: 0.7rem;
-  font-weight: 600;
-  text-transform: uppercase;
-  letter-spacing: 0.07em;
-  padding: 0.75rem 1rem 0.25rem;
-  margin-top: 0.5rem;
-}
-.sidebar .nav-section-toggle:hover { color: var(--ink); }
-.sidebar .nav-section-toggle .chevron {
-  display: inline-block;
-  width: 0.8rem;
-  font-size: 0.8rem;
-  line-height: 1;
-}
-
 /* ── Page header ─────────────────────────────────────────────────────────────
    h1 in sans, the sub-line in monospace as a quiet meta crumb. */
 .dashboard-page-header {
@@ -337,14 +242,6 @@ code {
 .alert-success { color: var(--ok); background: var(--ok-bg); border-color: #c6e6cd; }
 .alert-danger { color: var(--bad); background: var(--bad-bg); border-color: #eec3c3; }
 
-/* ── Login ───────────────────────────────────────────────────────────────────*/
-.dashboard-login { max-width: 24rem; margin: 0 auto; }
-.login-card {
-  background: var(--card);
-  border: 1px solid var(--rule);
-  border-radius: 8px;
-}
-
 /* ── API key management ──────────────────────────────────────────────────────*/
 .api-key-management-grid {
   display: grid;