fix: prevent horizontal form section info from overlapping form fields (#19189)

...on screens that are not wide enough to accommodate 2-column layout.

closes #19055 

Sticky positioning on form section info still works as expected on
desktop:


https://github.com/user-attachments/assets/e8f5b364-d20e-4248-acc6-848293947c92

Sticky positioning is no longer applied to form section info on
tablet/mobile:


https://github.com/user-attachments/assets/c52c6b04-7b73-457e-9d9e-0b461fff56ac

site/src/components/Form/Form.tsx

@@ -159,10 +159,13 @@ const styles = {
 			position: "initial" as const,
 		},
 	}),
-	formSectionInfoHorizontal: {
+	formSectionInfoHorizontal: (theme) => ({
 		maxWidth: 312,
-		position: "sticky",
-	},
+
+		[theme.breakpoints.up("lg")]: {
+			position: "sticky",
+		},
+	}),
 	formSectionInfoTitle: (theme) => ({
 		fontSize: 20,
 		color: theme.palette.text.primary,