From 2ec4eb3518fddde792ae6cd2488a3b67c7d5095f Mon Sep 17 00:00:00 2001
From: gsxdsm <gsxdsm@users.noreply.github.com>
Date: Tue, 16 Jun 2026 20:00:55 -0700
Subject: [PATCH] FN-6507: enlarge task chat send icon

Keep the Task Detail chat send glyph proportional to its touch target on desktop and mobile.

- Set the task chat send button icon sizing token to the larger spacing value.
- Preserve the existing desktop and mobile touch-target dimensions.
- Add CSS regression coverage for the send glyph and mobile sizing rules.

Files changed:
 packages/dashboard/app/components/TaskChatTab.css       |  6 ++++++
 .../app/components/__tests__/TaskChatTab.test.tsx       | 17 +++++++++++++++++
 2 files changed, 23 insertions(+)

Fusion-Task-Id: FN-6507

Fusion-Task-Lineage: 619aef93-d225-443c-9cf2-41a59d794148
---
 .../dashboard/app/components/TaskChatTab.css    |  6 ++++++
 .../components/__tests__/TaskChatTab.test.tsx   | 17 +++++++++++++++++
 2 files changed, 23 insertions(+)

diff --git a/packages/dashboard/app/components/TaskChatTab.css b/packages/dashboard/app/components/TaskChatTab.css
index 839257f0f8..de32654e2f 100644
--- a/packages/dashboard/app/components/TaskChatTab.css
+++ b/packages/dashboard/app/components/TaskChatTab.css
@@ -335,7 +335,12 @@ FN-6425 requires the chat expand control to stay inside the chat view as an icon
   flex: 1 1 auto;
 }
 
+/*
+FNXC:TaskDetailChat 2026-06-16-19:45:
+FN-6507 requires the Task Detail chat send glyph to scale with the larger square touch target on desktop and mobile. Override only this button's global .btn-icon size so Send and Loader2 stay visually proportional without changing the tap box or sibling chat send buttons.
+*/
 .task-chat-send {
+  --btn-icon-size: var(--space-lg);
   flex: 0 0 auto;
   display: inline-flex;
   align-items: center;
@@ -422,6 +427,7 @@ FN-6425 requires the chat expand control to stay inside the chat view as an icon
   }
 
   .task-chat-send {
+    --btn-icon-size: var(--space-lg);
     inline-size: calc(var(--space-2xl) + var(--space-sm));
     min-inline-size: calc(var(--space-2xl) + var(--space-sm));
   }
diff --git a/packages/dashboard/app/components/__tests__/TaskChatTab.test.tsx b/packages/dashboard/app/components/__tests__/TaskChatTab.test.tsx
index 56212f0b09..2c6bf0eea5 100644
--- a/packages/dashboard/app/components/__tests__/TaskChatTab.test.tsx
+++ b/packages/dashboard/app/components/__tests__/TaskChatTab.test.tsx
@@ -1686,6 +1686,23 @@ describe("TaskChatTab", () => {
     expect(mobileJumpRule).toContain("min-block-size");
   });
 
+  it("scales the task chat send glyph without shrinking the desktop or mobile touch target", () => {
+    const css = readFileSync(resolve(__dirname, "../TaskChatTab.css"), "utf8");
+    const sendRule = getCssRuleBlock(css, ".task-chat-send");
+    const mobileCss = getCssAfter(css, "@media (max-width: 768px)");
+    const mobileSendRule = getCssRuleBlock(mobileCss, ".task-chat-send");
+
+    expect(sendRule).toContain("--btn-icon-size: var(--space-lg)");
+    expect(sendRule).not.toContain("--btn-icon-size: var(--icon-size-md)");
+    expect(sendRule).toContain("inline-size: calc(var(--space-2xl) + var(--space-sm))");
+    expect(sendRule).toContain("min-inline-size: calc(var(--space-2xl) + var(--space-sm))");
+    expect(sendRule).toContain("block-size: calc(var(--space-2xl) + var(--space-sm))");
+    expect(sendRule).toContain("min-block-size: calc(var(--space-2xl) + var(--space-sm))");
+    expect(mobileSendRule).toContain("--btn-icon-size: var(--space-lg)");
+    expect(mobileSendRule).toContain("inline-size: calc(var(--space-2xl) + var(--space-sm))");
+    expect(mobileSendRule).toContain("min-inline-size: calc(var(--space-2xl) + var(--space-sm))");
+  });
+
   it("keeps mobile breakpoint scaffolding for the transcript, composer, and collapsible groups", () => {
     const css = readFileSync(resolve(__dirname, "../TaskChatTab.css"), "utf8");
     const sendRule = getCssRuleBlock(css, ".task-chat-send");