FN-7823: fix terminal header wrapping and spacing on narrow desktop panels

Prevent the terminal header's shortcut/status text and action controls from wrapping onto multiple lines when the floating or docked terminal panel is narrow at desktop breakpoints.

- Add white-space: nowrap to .terminal-shortcuts--header so header help text stays on one line
- Add white-space: nowrap to .terminal-connection-status to keep connection status text from wrapping
- Rely on existing .terminal-actions min-width: 0 + overflow-x: auto pattern for horizontal scrolling instead of wrapping
- Add regression test asserting the nowrap/scroll rules and that mobile still hides these elements
- Add changeset documenting the fix

Files changed:
 .changeset/fn-7823-terminal-header-nowrap.md        |  7 +++++++
 packages/dashboard/app/components/TerminalModal.css |  9 +++++++++
 .../app/components/__tests__/TerminalModal.test.tsx | 21 +++++++++++++++++++++
 3 files changed, 37 insertions(+)

Fusion-Task-Id: FN-7823

Fusion-Task-Lineage: 36426985-a489-41ec-9d79-f8b02862d504

Co-authored-by: Fusion (runfusion.ai) <noreply@runfusion.ai>

.changeset/fn-7823-terminal-header-nowrap.md

@@ -0,0 +1,7 @@
+---
+"@runfusion/fusion": patch
+---
+
+summary: Fix terminal header wrapping and spacing when the panel is narrow.
+category: fix
+dev: Header shortcut/status text now stays nowrap so terminal actions scroll horizontally instead of wrapping.

packages/dashboard/app/components/TerminalModal.css

@@ -851,6 +851,14 @@ The terminal header pop-out/dock affordance is an icon-only utility control. It
   color: var(--text-muted);
 }
 
+/*
+FNXC:TerminalHeader 2026-07-11-18:45:
+FN-7823: viewport-based terminal breakpoints keep narrow floating/docked panels on the desktop header layout, so the header help text must stay on one line and let .terminal-actions use the FN-7550 min-width: 0 + overflow-x scroll pattern instead of wrapping the header.
+*/
+.terminal-shortcuts--header {
+  white-space: nowrap;
+}
+
 .terminal-shortcuts kbd {
   display: inline-block;
   padding: 2px 6px;
@@ -1254,6 +1262,7 @@ The shortcut bar (modifier keys + arrow keys) must sit on ONE line, not stack in
 
 .terminal-connection-status {
   font-weight: 500;
+  white-space: nowrap;
 }
 
 .terminal-connection-status.connected {

packages/dashboard/app/components/__tests__/TerminalModal.test.tsx

@@ -1556,6 +1556,27 @@ describe("TerminalModal", () => {
       expect(tabletBlock).not.toMatch(/\.terminal-connection-status/);
     });
 
+    it("keeps the desktop terminal header controls on one scrollable row when narrow (FN-7823)", () => {
+      // FN-7823: large viewport breakpoints can still produce narrow floating or
+      // docked panels, so the desktop header must preserve horizontal scrolling
+      // instead of wrapping the help/status text into multiple rows.
+      const shortcutsHeaderRule = terminalModalCss.match(/\.terminal-shortcuts--header\s*\{([^}]*)\}/)?.[1] ?? "";
+      expect(shortcutsHeaderRule).toContain("white-space: nowrap;");
+
+      const actionsRule = terminalModalCss.match(/\.terminal-actions\s*\{([^}]*)\}/)?.[1] ?? "";
+      expect(actionsRule).toContain("min-width: 0;");
+      expect(actionsRule).toContain("overflow-x: auto;");
+      expect(actionsRule).not.toContain("flex-wrap: wrap;");
+
+      const connectionStatusRule = terminalModalCss.match(/\.terminal-connection-status\s*\{([^}]*)\}/)?.[1] ?? "";
+      expect(connectionStatusRule).toContain("white-space: nowrap;");
+
+      const mobileHideBlock = terminalModalCss.match(
+        /@media \(max-width: 768px\) \{[\s\S]*?\.terminal-shortcuts--header,\s*\n\s*\.terminal-connection-status \{([^}]*)\}/,
+      )?.[1] ?? "";
+      expect(mobileHideBlock).toContain("display: none;");
+    });
+
     describe("real-CSS mobile cascade (FN-7621 recurrence #3)", () => {
       // FN-7621: the FN-7550/FN-7560 tests above are leaf-rule string matches —
       // they proved the declarations exist, but never proved the panel actually