feat: implement frontend-only mock for production lines and runs

- Add ProductionTemplatesPage component for managing production templates with a visual representation using React Flow.
- Create LineHeaderNode and LineStageNode components for rendering production line nodes.
- Introduce RunStageNode and RunHeaderNode components for displaying run stages and headers.
- Implement StageProgressStrip for visualizing stage progress in runs.
- Create mock data for production runs and templates to simulate backend functionality.
- Define types for production templates and runs to structure mock data.
- Document frontend Phase 2 specifications for manufacturing processes, including screens, dialogs, and validation posture.

Frontend/erp-system/components/Layouts/AppSidebar.tsx

@@ -11,16 +11,19 @@ import {
   CalendarClock,
   ChevronRight,
   ClipboardList,
+  Factory,
   FileBarChart,
   FileText,
   HelpCircle,
   IdCard,
   LayoutGrid,
+  LayoutTemplate,
   ListTree,
   Menu,
   Package,
   PackageCheck,
   PackageX,
+  PlayCircle,
   Ruler,
   Settings,
   ShieldCheck,
@@ -89,6 +92,18 @@ const navItems: {
   { title: "Stock", code: "stock", href: "/dashboard/stock", icon: Warehouse, chevron: true },
   { title: "Warehouses", code: "warehouses", href: "/dashboard/warehouse", icon: Building2, chevron: true },
   { title: "Orders", code: "orders", href: "/dashboard/orders", icon: ShoppingCart, chevron: true },
+  {
+    title: "Production",
+    code: "production",
+    href: "/dashboard/production",
+    landingHref: "/dashboard/production/runs",
+    icon: Factory,
+    chevron: true,
+    children: [
+      { title: "Templates", code: "production.templates", href: "/dashboard/production/templates", icon: LayoutTemplate },
+      { title: "Runs", code: "production.runs", href: "/dashboard/production/runs", icon: PlayCircle },
+    ],
+  },
   {
     title: "HRM",
     code: "hrm",
@@ -333,7 +348,7 @@ export function AppSidebar() {
   // grants it. This is also flagged in 02-SECURITY.md as the AR-09 sidebar-visibility
   // stopgap for HRM's salary/PII data — it hides HRM from the UI but doesn't enforce
   // anything server-side.
-  const bypassCodes = new Set(["procurement", "hrm"])
+  const bypassCodes = new Set(["procurement", "hrm", "production"])
   const visibleItems = loading
     ? []
     : navItems

Frontend/erp-system/components/Layouts/Breadcrumbs.tsx

@@ -35,6 +35,9 @@ const SEGMENT_LABELS: Record<string, string> = {
   rfqs: "RFQs",
   "purchase-orders": "Purchase Orders",
   "purchase-returns": "Purchase Returns",
+  production: "Production",
+  templates: "Templates",
+  runs: "Runs",
 }
 
 function labelFor(segment: string): string {