Add dashboard chrome to POS and collapsible sidebar

Wrap the POS terminal in the sidebar + topbar layout via a nested
fullscreen layout, and make the sidebar collapse to an icon-only rail
with a persisted toggle so operators keep navigation on the POS screen.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

web/dashboard/src/app/[locale]/(fullscreen)/pos/layout.tsx

@@ -0,0 +1,50 @@
+"use client";
+
+import { useLocale } from "next-intl";
+import { Sidebar } from "@/components/layout/sidebar";
+import { Topbar } from "@/components/layout/topbar";
+import { CafeThemeProvider } from "@/components/theme/cafe-theme-provider";
+
+/**
+ * POS route layout — wraps the terminal in the standard dashboard chrome
+ * (collapsible sidebar + topbar) but keeps the main content area
+ * overflow-hidden so PosScreen can manage its own internal scrolling.
+ */
+export default function PosLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  const locale = useLocale();
+  const isRtl = locale !== "en";
+
+  const mainColumn = (
+    <div className="flex min-h-0 min-w-0 flex-1 flex-col">
+      <Topbar />
+      <main className="min-h-0 flex-1 overflow-hidden bg-background p-3 md:p-4">
+        {children}
+      </main>
+    </div>
+  );
+
+  return (
+    <CafeThemeProvider>
+      <div
+        className="flex h-screen min-h-0 overflow-hidden bg-background"
+        dir={isRtl ? "rtl" : "ltr"}
+      >
+        {isRtl ? (
+          <>
+            <Sidebar side="right" />
+            {mainColumn}
+          </>
+        ) : (
+          <>
+            <Sidebar side="left" />
+            {mainColumn}
+          </>
+        )}
+      </div>
+    </CafeThemeProvider>
+  );
+}

web/dashboard/src/app/[locale]/(fullscreen)/pos/page.tsx

@@ -1,16 +1,11 @@
 import { Suspense } from "react";
-import { CafeThemeProvider } from "@/components/theme/cafe-theme-provider";
 import { PosScreen } from "@/components/pos/pos-screen";
 
-/** Full-viewport POS terminal — no sidebar, no topbar. */
+/** POS terminal — chrome (sidebar + topbar) is provided by layout.tsx */
 export default function PosPage() {
   return (
-    <CafeThemeProvider>
-      <div className="flex h-screen min-h-0 flex-col overflow-hidden bg-background p-4 md:p-6">
-        <Suspense fallback={null}>
-          <PosScreen />
-        </Suspense>
-      </div>
-    </CafeThemeProvider>
+    <Suspense fallback={null}>
+      <PosScreen />
+    </Suspense>
   );
 }