diff --git a/components/HDPath.tsx b/components/HDPath.tsx
index 244b765..582d890 100644
--- a/components/HDPath.tsx
+++ b/components/HDPath.tsx
@@ -1,9 +1,10 @@
 import React, { useState } from 'react';
-import { ScrollView, View, Text, StyleSheet } from 'react-native';
+import { ScrollView, View, Text } from 'react-native';
 import { Button, TextInput } from 'react-native-paper';
 
 import { addAccountFromHDPath } from '../utils/Accounts';
 import { Account, PathState } from '../types';
+import styles from '../styles/stylesheet';
 
 const HDPath = ({
   pathCode,
@@ -26,7 +27,7 @@ const HDPath = ({
   const handleChange = (key: keyof PathState, value: string) => {
     setPath({
       ...path,
-      [key]: value.replace(/[^0-9]/g, ''), // Allow only numeric characters
+      [key]: value.replace(/[^0-9]/g, ''),
     });
   };
 
@@ -50,37 +51,34 @@ const HDPath = ({
   };
 
   return (
-    <ScrollView style={styles.container}>
-      <View style={styles.rowContainer}>
-        <Text style={styles.text}>{pathCode}</Text>
+    <ScrollView style={styles.HDcontainer}>
+      <View style={styles.HDrowContainer}>
+        <Text style={styles.HDtext}>{pathCode}</Text>
         <TextInput
           keyboardType="numeric"
           mode="outlined"
           onChangeText={text => handleChange('firstNumber', text)}
           value={path.firstNumber}
-          style={styles.textInput}
-          maxLength={1}
+          style={styles.HDtextInput}
         />
-        <Text style={styles.text}>'/</Text>
+        <Text style={styles.HDtext}>'/</Text>
         <TextInput
           keyboardType="numeric"
           mode="outlined"
           onChangeText={text => handleChange('secondNumber', text)}
           value={path.secondNumber}
-          style={styles.textInput}
-          maxLength={1}
+          style={styles.HDtextInput}
         />
-        <Text style={styles.text}>/</Text>
+        <Text style={styles.HDtext}>/</Text>
         <TextInput
           keyboardType="numeric"
           mode="outlined"
           onChangeText={text => handleChange('thirdNumber', text)}
           value={path.thirdNumber}
-          style={styles.textInput}
-          maxLength={1}
+          style={styles.HDtextInput}
         />
       </View>
-      <View style={styles.buttonContainer}>
+      <View style={styles.HDbuttonContainer}>
         <Button
           mode="contained"
           onPress={createFromHDPathHandler}
@@ -92,28 +90,4 @@ const HDPath = ({
   );
 };
 
-const styles = StyleSheet.create({
-  container: {
-    marginTop: 24,
-    paddingHorizontal: 8,
-  },
-  rowContainer: {
-    flexDirection: 'row',
-    alignItems: 'center',
-  },
-  text: {
-    color: 'black',
-    fontSize: 18,
-    padding: 10,
-  },
-  textInput: {
-    flex: 1,
-  },
-  buttonContainer: {
-    marginTop: 20,
-    width: 200,
-    alignSelf: 'center',
-  },
-});
-
 export default HDPath;
diff --git a/styles/stylesheet.js b/styles/stylesheet.js
index dbaad4a..962b199 100644
--- a/styles/stylesheet.js
+++ b/styles/stylesheet.js
@@ -81,6 +81,27 @@ const styles = StyleSheet.create({
     alignItems: 'center',
     justifyContent: 'flex-start',
   },
+  HDcontainer: {
+    marginTop: 24,
+    paddingHorizontal: 8,
+  },
+  HDrowContainer: {
+    flexDirection: 'row',
+    alignItems: 'center',
+  },
+  HDtext: {
+    color: 'black',
+    fontSize: 18,
+    margin: 4,
+  },
+  HDtextInput: {
+    flex: 1,
+  },
+  HDbuttonContainer: {
+    marginTop: 20,
+    width: 200,
+    alignSelf: 'center',
+  },
 });
 
 export default styles;