refactor(ui): Sidebar 1:1 an enconf-Pattern angleichen

- <aside> → <nav> als Root-Element
- Section-Label-Div NEBEN dem <ul> (vorher verschachtelt)
- <NavLink>-Callback → <Link> + location.pathname-Vergleich (Pattern
  identisch zu netcell-webpanel/management-ui/src/components/Layout/Sidebar.tsx)
- nmg-prefix CSS-Variable `--nmg-sidebar-text` entfernt, Textfarbe
  direkt #94A3B8 (enconf-Standard)

Färbung war schon enconf-konform (Gradient #0B1426→#101D33→#0D1829,
Akzent-Stab #1677ff mit color-mix tint), nur Struktur+Markup zogen
nach.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

management-ui/src/components/Layout/Sidebar.tsx

@@ -1,4 +1,4 @@
-import { NavLink } from 'react-router-dom'
+import { Link, useLocation } from 'react-router-dom'
 import type { ReactNode } from 'react'
 import {
   ApartmentOutlined,
@@ -45,8 +45,6 @@ const NAV: NavSection[] = [
     items: [
       { path: '/domains',  labelKey: 'nav.domains',  icon: <GlobalOutlined /> },
       { path: '/backends', labelKey: 'nav.backends', icon: <DatabaseOutlined /> },
-      // /routing-rules erreichbar via Domain-Modal "Pfad-Routing"-Tab —
-      // kein eigener Nav-Eintrag mehr (war für 90% der Setups overkill).
     ],
   },
   {
@@ -77,42 +75,51 @@ const NAV: NavSection[] = [
   },
 ]
 
-const VERSION = '1.0.56'
+const VERSION = '1.0.57'
 
+// Sidebar-Pattern 1:1 aus netcell-webpanel (enconf) übernommen:
+// - <nav> als root, dunkler Gradient + Teal/Blue-Accent
+// - Section-Label-Div NEBEN dem <ul>, nicht verschachtelt
+// - <Link> + pathname-Vergleich für active-State (ein <li>.active::before
+//   rendert den Akzent-Stab links + tint die Item-Background)
+// CSS lebt in styles/enterprise.css (.sidebar*).
 export default function Sidebar({ isOpen, onClose }: SidebarProps) {
   const { t } = useTranslation()
+  const location = useLocation()
 
   return (
-    <aside className={`sidebar${isOpen ? ' open' : ''}`}>
+    <nav className={`sidebar${isOpen ? ' open' : ''}`}>
       <div className="sidebar-logo">
         <div className="sidebar-logo-icon">EG</div>
         <span className="sidebar-logo-text">{t('app.title')}</span>
       </div>
 
       {NAV.map((section) => (
-        <div key={section.labelKey} className="sidebar-section">
-          <div className="sidebar-section-label">{t(section.labelKey)}</div>
+        <div key={section.labelKey}>
+          <div className="sidebar-section">
+            <div className="sidebar-section-label">{t(section.labelKey)}</div>
+          </div>
           <ul className="sidebar-menu">
-            {section.items.map((item) => (
-              <li key={item.path} className="sidebar-menu-item">
-                <NavLink
-                  to={item.path}
-                  onClick={onClose}
-                  className={({ isActive }) =>
-                    isActive ? 'sidebar-menu-item active' : ''
-                  }
-                  end
+            {section.items.map((item) => {
+              const isActive = location.pathname === item.path
+                || location.pathname.startsWith(item.path + '/')
+              return (
+                <li
+                  key={item.path}
+                  className={`sidebar-menu-item${isActive ? ' active' : ''}`}
                 >
-                  {item.icon}
-                  <span>{t(item.labelKey)}</span>
-                </NavLink>
-              </li>
-            ))}
+                  <Link to={item.path} onClick={onClose}>
+                    {item.icon}
+                    <span>{t(item.labelKey)}</span>
+                  </Link>
+                </li>
+              )
+            })}
           </ul>
         </div>
       ))}
 
       <div className="sidebar-version">v{VERSION}</div>
-    </aside>
+    </nav>
   )
 }

management-ui/src/styles/enterprise.css

@@ -136,10 +136,7 @@ h1, h2, h3, h4, h5, h6 {
   gap: 10px;
   padding: 8px 10px;
   font-size: 14px;
-  /* CSS-Variable --nmg-sidebar-text wird vom Sidebar-Komponente
-     gesetzt wenn das Branding eine eigene Textfarbe hat. Fallback:
-     #94A3B8 (Light-Slate, ursprünglicher Hardcode). */
-  color: var(--nmg-sidebar-text, #94A3B8);
+  color: #94A3B8;
   text-decoration: none;
   border-radius: 6px;
   transition: all 0.15s ease;