From 3ad0607cecd5f3b96e849bc95ebbdfae89059fce Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marc-Andr=C3=A9=20Bombeck?= <mbombeck@gmail.com>
Date: Fri, 9 Oct 2026 00:41:56 +0200
Subject: [PATCH] fix(settings): stack the coach nudge frequency row on a phone

At 16 px touch type the longest frequency option and its label no longer
fit one row inside a 390 px card, and the select pushed the page sideways.
---
 src/components/settings/coach-nudge-card.tsx | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/components/settings/coach-nudge-card.tsx b/src/components/settings/coach-nudge-card.tsx
index c675cbcb2..4db6cc25e 100644
--- a/src/components/settings/coach-nudge-card.tsx
+++ b/src/components/settings/coach-nudge-card.tsx
@@ -249,7 +249,10 @@ export function CoachNudgeCard({
               />
             </div>
           ))}
-          <div className="flex min-h-11 items-center gap-3">
+          {/* Stacked on a phone: at 16 px touch type the longest option
+              ("At most every two weeks") plus the label no longer fits one
+              row inside a 390 px card. */}
+          <div className="flex min-h-11 flex-col items-stretch gap-2 sm:flex-row sm:items-center sm:gap-3">
             <label
               htmlFor="coach-nudge-frequency"
               className="text-sm font-medium"
@@ -258,7 +261,7 @@ export function CoachNudgeCard({
             </label>
             <NativeSelect
               id="coach-nudge-frequency"
-              className="w-auto"
+              className="sm:w-auto"
               value={resolved.nudgeFrequency}
               disabled={!isAuthenticated || saving}
               onChange={(e) =>