feat: ensure text field does not overflow

src/components/organisms/RightSidePanel.tsx

@@ -427,17 +427,18 @@ export const RightSidePanel: React.FC<RightSidePanelProps> = ({ onFinishCapture
                 <FormControlLabel value="custom" control={<Radio />} label="Custom" />
                 {limitType === 'custom' && (
                   <TextField
-                    type="number"
+                  type="number"
-                    value={customLimit}
+                  value={customLimit}
-                    onChange={(e) => updateCustomLimit(e.target.value)}
+                  onChange={(e) => updateCustomLimit(e.target.value)}
-                    placeholder="Enter number"
+                  placeholder="Enter number"
-                    sx={{
+                  sx={{
-                      marginLeft: '10px',
+                    marginLeft: '10px',
-                      '& input': {
+                    '& input': {
-                        padding: '10px',
+                    padding: '10px',
-                        background: 'white',
+                    background: 'white',
-                      },
+                    },
-                    }}
+                    width: '150px', // Ensure the text field does not go outside the panel
+                  }}
                   />
                 )}
               </div>