//Data 1
const dadosDosBlocos = [
    {

        titulo404: 'Erro 404',
        titulotex: 'Desculpa, mas não possivel encontra sua pagina!',
        titulosubtex: 'Tente fazer seu login novamente',
        link2: '../login.html',
        botao: 'Retornar',
    }
];


document.addEventListener("DOMContentLoaded", function () {
    var main = document.getElementById("entrada_1");

    // Verificar se a tag main está vazia
    if (main.innerHTML.trim() === "") {
        // Se estiver vazia, adicione a estrutura alternativa
        // Função para criar os blocos com base nos dados fornecidos
        function criarBlocos(dados) {
            // Limpar o container de blocos
            entrada_1.innerHTML = '';

            // Iterar sobre o array de dados dos blocos
            dados.forEach(dadosDoBloco => {
                // Responsavel por trazer todos os lementos da tela.
                const Painel = document.createElement('section');
                Painel.classList.add('matriz_404');
                Painel.id = "cap";


                const painel1 = document.createElement('section');
                painel1.classList.add('paineis_1');

                const cap1 = document.createElement('div');
                cap1.classList.add('cap');
                painel1.appendChild(cap1)
                const titulo404 = document.createElement('h1');
                titulo404.textContent = dadosDoBloco.titulo404;
                cap1.appendChild(titulo404)


                const painel2 = document.createElement('section');
                painel2.classList.add('paineis_2');

                const cap2 = document.createElement('div');
                cap2.classList.add('cap');
                painel2.appendChild(cap2)
                const titulotex = document.createElement('h2');
                titulotex.textContent = dadosDoBloco.titulotex;
                cap2.appendChild(titulotex)

                const titulosubtex = document.createElement('p');
                titulosubtex.textContent = dadosDoBloco.titulosubtex;
                cap2.appendChild(titulosubtex)

                const capsub2 = document.createElement('div');
                capsub2.classList.add('cap_2');
                painel2.appendChild(capsub2)
                const link2 = document.createElement('a');
                capsub2.appendChild(link2)
                link2.href = dadosDoBloco.link2;
                const botao = document.createElement('button');
                botao.textContent = dadosDoBloco.botao;
                link2.appendChild(botao);




                const wave1 = document.createElement('div');
                wave1.classList.add('wave', 'wave_1');
                Painel.appendChild(wave1);

                const wave2 = document.createElement('div');
                wave2.classList.add('wave', 'wave_2');
                Painel.appendChild(wave2);

                const wave3 = document.createElement('div');
                wave3.classList.add('wave', 'wave_3');
                Painel.appendChild(wave3);

                const wave4 = document.createElement('div');
                wave4.classList.add('wave', 'wave_4');
                Painel.appendChild(wave4);


                // Adicionar o painel ao bloco


                Painel.appendChild(painel1);
                Painel.appendChild(painel2);




                // Adicionar o bloco ao container de blocos
                entrada_1.appendChild(Painel);
            });
        }

    }
    // Renderizar os blocos inicialmente ao carregar a página
    criarBlocos(dadosDosBlocos);


});