async function getPokemon() {
    const pokemonName = document.getElementById("pokemonName").value.trim().toLowerCase();
    const dataBox = document.getElementById("dataBox");

    const apiUrl = `https://pokeapi.co/api/v2/pokemon/${pokemonName}`;

    const response = await fetch(apiUrl);
    const data = await response.json();

    console.log(data);

    const type_response = await fetch(data.types[0].type.url);
    const type_data = await type_response.json();
    console.log(type_data);

    dataBox.innerHTML = `
        <img id="pokemonImage" src="${data.sprites.front_default}">
        <span>${data.name.toUpperCase()}</span>
        <span>${data.types[0].type.name.toUpperCase()}</span>
    `;
}