React-Native styles not getting appplied

React-Native styles are not getting applied in two screens, I already saved the changes but when it gets applie to one screen, the other one loses it's style. Here is the code :

import { render } from 'react-dom';
import {NavigationContainer} from '@react-navigation/native'
import { TextInput } from 'react-native-gesture-handler';
const width = Dimensions.get('window').width
const heigth = Dimensions.get('window').height
styles = StyleSheet.create({
Container:{
flex:1,
width: '100%',
width: width -20,
height:heigth - 10,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF'
},
ViewContainer:{
width: width -40,
flex:1,
alignItems: 'center',
backgroundColor: '#F5FCFF'
},
input:{
borderBottomColor: '#F5FCFF',
backgroundColor: '#FFFFFF',
borderRadius:30,
borderBottomWidth: 1,
paddingLeft: 8,
width:250,
height:45,
marginBottom:8,
marginTop:20,
flexDirection: 'row',
alignItems:'center',
marginLeft:40
},
Button:{
width:"80px",
height:"30px",
margin:100,
justifyContent:'flex-end',
alignItems: "flex-end",
},
buttonContainer: {
height:65,
flexDirection: 'row',
justifyContent: 'center',
alignItems: 'center',
marginBottom:20,
width:250,
borderRadius:30,
marginLeft:70
},
Container:{
flex:1,
justifyContent:"flex-end",
alignItems: "flex-end",
},
})

and the other one here:

import AsyncStorage from '@react-native-async-storage/async-storage';
import { render } from 'react-dom';
import {NavigationContainer} from '@react-navigation/native'
import { TextInput } from 'react-native-gesture-handler';
import { getPermissionsAsync } from 'expo-location';
const width = Dimensions.get('window').width
const heigth = Dimensions.get('window').height
styles = StyleSheet.create({
Container:{
flex:1,
width: width -20,
height:heigth-30,
alignItems: 'center',
backgroundColor: '#F5FCFF'
},
input:{
marginTop: heigth/4,
margin: 20,
borderBottomColor: '#F5FCFF',
backgroundColor: '#FFFFFF',
borderRadius:30,
borderBottomWidth: 1,
width:250,
height:45,
marginBottom:20,
flexDirection: 'row',
alignItems:'center',
marginLeft:70
},
Button:{
height:45,
flexDirection: 'row',
justifyContent: 'center',
alignItems: 'center',
marginBottom:20,
width:250,
borderRadius:60,
borderBottomWidth: 1,
marginTop:90,
marginLeft:70
},
Button2:{
flex:1,
height:20,
borderRadius:60,
borderBottomWidth: 1,
width:30,
color:'#f0f8ff',
alignSelf:'flex-end',
borderStyle: 'dashed'
}
})

I'm using stack navigation and think that it migth be the problem, here is the code:
function Tabnav() {

  return(
<Tab.Navigator 
screenOptions={{
tabBarActiveTintColor: '#101010',
TabBarLabelStyle: {
fontSize: 15,
},
TabBarStyle: {
backgroundColor: '#ffd700',
}
}}
>
<Tab.Screen name="Homescreen" component={Home} 
options={{
headerShown: false,
tabBarIcon: ({ color, size }) => (
<Ionicons name="ios-home" color={color} size={size} />
)
}}/>
<Tab.Screen name="Perfil" component={userProfile}
options={{
headerShown: false,
tabBarIcon: ({ color, size }) => (
<Ionicons name="ios-person" size={size} color={color} />
)
}}/>
</Tab.Navigator> 
);
}
export default function App(){
return (
<NavigationContainer initialRouteName="Signin">
<Stack.Navigator>
<Stack.Screen name="Signin" component={Signin} />
<Stack.Screen name="Register" component={Register}/>
<Stack.Screen name="Forgotpass" component={Forgotpass}/>
<Stack.Screen name="Reset" component={Reset}/>
<Stack.Screen name="Home" component={Tabnav} options={{headerLeft:()=>null, gestureEnabled: false,}}/>
<Stack.Screen name="Dermatologistas" component={Dermatologistas}/>
<Stack.Screen name="Hospitais" component={Hospitais}/>
<Stack.Screen name="Cardiologista" component={Cardiologista}/>
<Stack.Screen name="Pneumologista" component={Pneumologista}/>
<Stack.Screen name="Odontologo" component={Odontologo}/>
<Stack.Screen name="Oftalmologista" component={Oftalmologista}/>
<Stack.Screen name="UserProfile" component={userProfile}/>
<Stack.Screen name="Profile" component={Profile}/>
<Stack.Screen name="Edit" component={Edit}/>
</Stack.Navigator>
</NavigationContainer>
);
}

Need to import StyleSheet from react-native

import {StyleSheet, View, Text} from "react-native";

you have for got the const keyword.
const styles = StyleSheet.create({

you have forgot to import StyleSheet so this may be another Problem.

if the StyleSheet is declare in separate file you must have to export it like this

export default styles or export {styles}

to use styles in the other files . if you do export default styles like this then import like this

import styles from "../your/directroy/to/styles/"

if you export like this

export {styles}

then import like this

import {styles} from "../your/directroy/to/styles/"

just needed to define a const in the stylesheet

styles = StyleSheet.create({})