The action 'NAVIGATE' with payload {"name":"Evento"} was not handled by any navigator

Estou tentando criar um Stack.Navigator dentro de um Tab.Navigator, mas aparentemente nenhum navigator parece estar lidando com a action.

Tenho a seguinte estrutura:

Tab.Navigator
    Home (Tab.Screen)
    PertoDeMim (Tab.Screen)

Stack.Navigator
    PertoDeMim (Stack.Screen)
    Evento (Stack.Screen)

O que eu estou tentando fazer é:

1. Clicar na tab Perto de Mim, a qual, por sua vez me redirecionará para uma tela contendo uma listagem de eventos
2. Clicar em um dos eventos listados e ser redirecionado para a tela com as informações do evento.

No método responsável por gerar a tela Perto de Mim, estou chamando o componente ListagemEventos.js e é dentro desse componente que estou implementando o useNavigation(), que será usado dentro do atributo onPress do botão no card dos eventos listados com a <FlatList>.

Com o Tab.Navigator está tudo certo. O erro aparece quando eu clico no botão do card do evento.

O erro:

The action 'NAVIGATE' with payload {"name":"Evento"} was not handled by any navigator.

Do you have a screen named 'Evento'?

If you're trying to navigate to a screen in a nested navigator, see 
https://reactnavigation.org/docs/nesting-navigators#navigating-to-a-screen-in-a-nested- 
navigator. 

AppRoutes.js (onde estou criando o Tab.Navigator):

const Tab = createBottomTabNavigator();

export default function AppRoutes() {
    return <NavigationContainer>
        <Tab.Navigator>
            <Tab.Screen name="Home" component={ Home } />
            <Tab.Screen name="Perto de mim" component={ PertoDeMim } />
        </Tab.Navigator>
    </NavigationContainer>
}

EventRoutes.js (onde estrou criando o Stack.Navigator):

const Stack = createNativeStackNavigator();

export default function EventRoutes() {
    return <Stack.Navigator>
        <Stack.Screen name="Perto de mim" component={ PertoDeMim } />
        <Stack.Screen name="Evento" component={ Evento } />
    </Stack.Navigator>
}

ListagemEventos.js (componente chamado em PertoDeMim):

export default function Eventos() {
    const navigation = useNavigation();
    const [title, events] = useEventos();

    const ListTop = () => {
        return <>
            <Text style={ styles.content.title }>{ title }</Text>
        </>
    }

    return <FlatList
        data={ events }
        renderItem={ ({ item }) => {
            return <>
                <View style={ styles.content }>
                    <CardEvento { ...item } onPressed={
                        () => navigation.navigate("Evento")
                    }/>
                </View>
            </>
        }}
        keyExtractor={({id}) => id}
        ListHeaderComponent={ ListTop }
    />;
}

CardEvento.js:

export default function CardEvento({ title, description, date, onPressed }) {
    return <>
        <TouchableOpacity style={ styles.event } onPress={ onPressed }>
            <View style={ styles.event.info_container }>
                <Text style={ styles.event.title }>{ title }</Text>
                <Text style={ styles.event.description }>{ description }</Text>
                <Text style={ styles.event.date }>{ date }</Text>
            </View>
        </TouchableOpacity>
    </>
}