script.js

/*
================================================================================
                      📊 DADOS DO EVENTO "O PALCO É DELAS"
================================================================================
Este arquivo contém todos os dados e funcionalidades do site do evento.
Cada seção está bem documentada para facilitar a compreensão e manutenção.
*/

// ============================================================================
// 👩‍💻 DADOS DAS PALESTRANTES
// ============================================================================
/*
Array com informações de todas as 20 palestrantes do evento.
Cada palestrante tem: id, nome, cargo, empresa, bio, especialidades e redes sociais.
*/
const speakers = [
    {
        id: 1,
        name: "Midian Brandão",
        role: "Tech Lead",
        company: "A definir",
        bio: "Informações serão atualizadas pela própria palestrante. Este é um placeholder para o projeto open source.",
        expertise: ["IA", "Machine Learning", "Python"],
        social: {
            linkedin: "#",
            twitter: "#",
            github: "#"
        },
        talks: ["Inteligência Artificial e o Futuro do Trabalho"]
    },
    {
        id: 2,
        name: "Camila Marques de Oliveira",
        role: "Frontend Developer",
        company: "A definir",
        bio: "Informações serão atualizadas pela própria palestrante. Este é um placeholder para o projeto open source.",
        expertise: ["React", "Vue.js", "JavaScript"],
        social: {
            linkedin: "#",
            twitter: "#",
            github: "#"
        },
        talks: ["Desenvolvimento Frontend Moderno"]
    },
    {
        id: 3,
        name: "Gabriela Matias",
        role: "Gameplay Programmer",
        company: "ARVORE Immersive Experiences",
        bio: "Programadora de jogos desde 2021, com foco em Unreal Engine e Unity. Participa frequentemente de game jams, e acredita que aprender na prática é a melhor maneira de crescer como game dev. Nas horas vagas, está sempre jogando jogos de terror com os amigos ou lendo algum webtoon.",
        expertise: ["Unreal Engine 5", "C++", "Blueprints", "Unity", "C#"],
        social: {
            linkedin: "https://www.linkedin.com/in/gabrielamilet",
            twitter: "https://x.com/jasbrela",
            github: "https://github.com/jasbrela"
        },
        talks: ["Level 1: Primeiros passos na área de Games"]
    },
    {
        id: 4,
        name: "Laryssa Viana Rocha",
        role: "DevOps Engineer",
        company: "A definir",
        bio: "Informações serão atualizadas pela própria palestrante. Este é um placeholder para o projeto open source.",
        expertise: ["DevOps", "Kubernetes", "AWS"],
        social: {
            linkedin: "#",
            twitter: "#",
            github: "#"
        },
        talks: ["DevOps e Cloud Computing"]
    },
    {
        id: 5,
        name: "Elizabeth Cristina de Souza",
        role: "Infrastrucute Analyst",
        company: "ConectaQ",
        bio: "Elizabeth é palestrante apaixonada por infraestrutura de TI, cloud e proteção de dados, com foco no protagonismo feminino na tecnologia.
        Após mais de 30 anos de experiência, está em transição para uma nova fase profissional, contribuindo ativamente para fortalecer e dar visibilidade às mulheres na área de tecnologia.
        Tem um estilo didático e prático, com uma abordagem que une conhecimento técnico e propósito humano.
        Contribui para a construção de uma comunidade para mulheres que querem crescer e transformar o mundo com tecnologia.",
        expertise: ["Cloud", "Data Center", "Virtualização", "Proteção de Dados"],
        social: {
            linkedin: "https://www.linkedin.com/in/bethcsouza",
            twitter: "@bethcsouza",
            github: "#"
        },
        talks: ["Tornando Infraestruturas de TI mais eficientes e sustentáveis com a virtualização"]
    },
    {
        id: 6,
        name: "Bianca Pinto Cardoso",
        role: "UX Designer",
        company: "A definir",
        bio: "Informações serão atualizadas pela própria palestrante. Este é um placeholder para o projeto open source.",
        expertise: ["UX", "Design", "Research"],
        social: {
            linkedin: "#",
            twitter: "#",
            github: "#"
        },
        talks: ["UX/UI Design: Criando Experiências Incríveis"]
    },
    {
        id: 7,
        name: "Juliana de Jesus de Oliveira",
        role: "Blockchain Developer",
        company: "A definir",
        bio: "Informações serão atualizadas pela própria palestrante. Este é um placeholder para o projeto open source.",
        expertise: ["Blockchain", "Solidity", "DeFi"],
        social: {
            linkedin: "#",
            twitter: "#",
            github: "#"
        },
        talks: ["Blockchain e Criptomoedas"]
    },
    {
        id: 8,
        name: "Marília Melo Favalesso",
        role: "Mobile Developer",
        company: "A definir",
        bio: "Informações serão atualizadas pela própria palestrante. Este é um placeholder para o projeto open source.",
        expertise: ["iOS", "Android", "React Native"],
        social: {
            linkedin: "#",
            twitter: "#",
            github: "#"
        },
        talks: ["Mobile Development: iOS e Android"]
    },
    {
        id: 9,
        name: "Ana Hashimoto",
        role: "IoT Engineer",
        company: "A definir",
        bio: "Informações serão atualizadas pela própria palestrante. Este é um placeholder para o projeto open source.",
        expertise: ["IoT", "Hardware", "Embedded"],
        social: {
            linkedin: "#",
            twitter: "#",
            github: "#"
        },
        talks: ["Internet das Coisas (IoT)"]
    },
    {
        id: 10,
        name: "Andrea Simone",
        role: "Software Architect",
        company: "A definir",
        bio: "Informações serão atualizadas pela própria palestrante. Este é um placeholder para o projeto open source.",
        expertise: ["Arquitetura", "Microservices", "Java"],
        social: {
            linkedin: "#",
            twitter: "#",
            github: "#"
        },
        talks: ["Arquitetura de Software Escalável"]
    },
    {
        id: 11,
        name: "Bruna Valentim",
        role: "Quantum Researcher",
        company: "A definir",
        bio: "Informações serão atualizadas pela própria palestrante. Este é um placeholder para o projeto open source.",
        expertise: ["Quantum", "Physics", "Research"],
        social: {
            linkedin: "#",
            twitter: "#",
            github: "#"
        },
        talks: ["Quantum Computing: A Nova Fronteira"]
    },
    {
        id: 12,
        name: "Cecilia Silva",
        role: "VR/AR Developer",
        company: "A definir",
        bio: "Informações serão atualizadas pela própria palestrante. Este é um placeholder para o projeto open source.",
        expertise: ["VR", "AR", "Unity"],
        social: {
            linkedin: "#",
            twitter: "#",
            github: "#"
        },
        talks: ["Realidade Virtual e Aumentada"]
    },
    {
        id: 13,
        name: "Jessica Alexandra",
        role: "Agile Coach",
        company: "A definir",
        bio: "Informações serão atualizadas pela própria palestrante. Este é um placeholder para o projeto open source.",
        expertise: ["Agile", "Scrum", "Leadership"],
        social: {
            linkedin: "#",
            twitter: "#",
            github: "#"
        },
        talks: ["Metodologias Ágeis e Scrum"]
    },
    {
        id: 14,
        name: "Jessica Borges",
        role: "Analista de Dados",
        company: "Deloitte",
        bio: "Analista de Dados na Deloitte, formada em Engenharia da Computação e pós-graduada em Inteligência Artificial e Aprendizado de Máquina. Já atuei em projetos de Visão Computacional, desenvolvendo soluções de IA aplicadas a diferentes contextos.",
        expertise: ["Python", "Visão Computacional"],
        social: {
            linkedin: "https://www.linkedin.com/in/jessicafborges/",
            twitter: "#",
            github: "https://github.com/jessicamfborges"
        },
        talks: ["Entre o Código e a Consciência: Os Dilemas Éticos da IA"]
    },
    {
        id: 15,
        name: "Karina Kaori",
        role: "Robotics Engineer",
        company: "A definir",
        bio: "Informações serão atualizadas pela própria palestrante. Este é um placeholder para o projeto open source.",
        expertise: ["Robotics", "Automation", "AI"],
        social: {
            linkedin: "#",
            twitter: "#",
            github: "#"
        },
        talks: ["Automação e Robótica"]
    },
    {
        id: 16,
        name: "Keline",
        role: "Tech Lead",
        company: "A definir",
        bio: "Informações serão atualizadas pela própria palestrante. Este é um placeholder para o projeto open source.",
        expertise: ["Leadership", "Management", "Strategy"],
        social: {
            linkedin: "#",
            twitter: "#",
            github: "#"
        },
        talks: ["Liderança Técnica Feminina"]
    },
    {
        id: 17,
        name: "Luciana Damasceno",
        role: "Open Source Advocate",
        company: "A definir",
        bio: "Informações serão atualizadas pela própria palestrante. Este é um placeholder para o projeto open source.",
        expertise: ["Open Source", "Community", "Python"],
        social: {
            linkedin: "#",
            twitter: "#",
            github: "#"
        },
        talks: ["Open Source e Comunidades Tech"]
    },
    {
        id: 18,
        name: "Rhaissa Barbosa",
        role: "Green Tech Specialist",
        company: "A definir",
        bio: "Informações serão atualizadas pela própria palestrante. Este é um placeholder para o projeto open source.",
        expertise: ["GreenTech", "Sustainability", "Energy"],
        social: {
            linkedin: "#",
            twitter: "#",
            github: "#"
        },
        talks: ["Sustentabilidade na Tecnologia"]
    },
    {
        id: 19,
        name: "Helena",
        role: "Entrepreneur",
        company: "A definir",
        bio: "Informações serão atualizadas pela própria palestrante. Este é um placeholder para o projeto open source.",
        expertise: ["Entrepreneurship", "Startups", "Business"],
        social: {
            linkedin: "#",
            twitter: "#",
            github: "#"
        },
        talks: ["Empreendedorismo Tech Feminino"]
    },
    {
        id: 20,
        name: "Juliana Lisboa",
        role: "Tech Evangelist",
        company: "A definir",
        bio: "Informações serão atualizadas pela própria palestrante. Este é um placeholder para o projeto open source.",
        expertise: ["Diversity", "Inclusion", "Future"],
        social: {
            linkedin: "#",
            twitter: "#",
            github: "#"
        },
        talks: ["O Futuro das Mulheres na Tecnologia"]
    }
];

// ============================================================================
// 🎤 DADOS DAS PALESTRAS
// ============================================================================
/*
Array com todas as 20 palestras do evento, divididas em 2 blocos:
- BLOCO 1 (Manhã): 10:10 - 12:40 (10 palestras)
- BLOCO 2 (Tarde): 14:00 - 16:30 (10 palestras)

IMPORTANTE: Todas as palestras começam como placeholders (isPlaceholder: true)
para que cada palestrante possa personalizar sua apresentação.
*/
const talks = [
    // ========================================================================
    // 🌅 BLOCO 1 - MANHÃ (10:10 - 12:40)
    // ========================================================================
    {
        id: 1,
        time: "10:10 - 10:25",
        title: "Título da palestra será definido pela palestrante",
        speaker: "Midian Brandão",
        description: "A palestrante adicionará a descrição de sua apresentação. Este é um placeholder do projeto open source para que cada participante possa personalizar sua palestra.",
        tags: ["A definir"],
        block: "morning",
        isPlaceholder: true
    },
    {
        id: 2,
        time: "10:25 - 10:40",
        title: "Título da palestra será definido pela palestrante",
        speaker: "Camila Marques de Oliveira",
        description: "A palestrante adicionará a descrição de sua apresentação. Este é um placeholder do projeto open source para que cada participante possa personalizar sua palestra.",
        tags: ["A definir"],
        block: "morning",
        isPlaceholder: true
    },
    {
        id: 3,
        time: "10:40 - 10:55",
        title: "Título da palestra será definido pela palestrante",
        speaker: "Gabriela Milet Matias",
        description: "A palestrante adicionará a descrição de sua apresentação. Este é um placeholder do projeto open source para que cada participante possa personalizar sua palestra.",
        tags: ["A definir"],
        block: "morning",
        isPlaceholder: true
    },
    {
        id: 4,
        time: "10:55 - 11:10",
        title: "Título da palestra será definido pela palestrante",
        speaker: "Laryssa Viana Rocha",
        description: "A palestrante adicionará a descrição de sua apresentação. Este é um placeholder do projeto open source para que cada participante possa personalizar sua palestra.",
        tags: ["A definir"],
        block: "morning",
        isPlaceholder: true
    },
    {
        id: 5,
        time: "11:10 - 11:25",
        title: "Tornando Infraestruturas de TI mais eficientes e sustentáveis com a virtualização",
        speaker: "Elizabeth Cristina de Souza",
        description: "Nesta apresentação vou falar, de forma clara e prática, o conceito de virtualização de servidores, seus principais benefícios, e como ela pode ajudar empresas a otimizarem seus recursos de TI. Se você é uma pessoa querendo aprender um pouco sobre esta área, esta palestra foi feita pensando em você.",
        tags: ["virtualização, cloud, datecenters"],
        block: "morning",
        isPlaceholder: true
    },
    {
        id: 6,
        time: "11:25 - 11:40",
        title: "Título da palestra será definido pela palestrante",
        speaker: "Bianca Pinto Cardoso",
        description: "A palestrante adicionará a descrição de sua apresentação. Este é um placeholder do projeto open source para que cada participante possa personalizar sua palestra.",
        tags: ["A definir"],
        block: "morning",
        isPlaceholder: true
    },
    {
        id: 7,
        time: "11:40 - 11:55",
        title: "Título da palestra será definido pela palestrante",
        speaker: "Juliana de Jesus de Oliveira",
        description: "A palestrante adicionará a descrição de sua apresentação. Este é um placeholder do projeto open source para que cada participante possa personalizar sua palestra.",
        tags: ["A definir"],
        block: "morning",
        isPlaceholder: true
    },
    {
        id: 8,
        time: "11:55 - 12:10",
        title: "Título da palestra será definido pela palestrante",
        speaker: "Marília Melo Favalesso",
        description: "A palestrante adicionará a descrição de sua apresentação. Este é um placeholder do projeto open source para que cada participante possa personalizar sua palestra.",
        tags: ["A definir"],
        block: "morning",
        isPlaceholder: true
    },
    {
        id: 9,
        time: "12:10 - 12:25",
        title: "Título da palestra será definido pela palestrante",
        speaker: "Ana Hashimoto",
        description: "A palestrante adicionará a descrição de sua apresentação. Este é um placeholder do projeto open source para que cada participante possa personalizar sua palestra.",
        tags: ["A definir"],
        block: "morning",
        isPlaceholder: true
    },
    {
        id: 10,
        time: "12:25 - 12:40",
        title: "Título da palestra será definido pela palestrante",
        speaker: "Andrea Simone",
        description: "A palestrante adicionará a descrição de sua apresentação. Este é um placeholder do projeto open source para que cada participante possa personalizar sua palestra.",
        tags: ["A definir"],
        block: "morning",
        isPlaceholder: true
    },
    
    // ========================================================================
    // 🌇 BLOCO 2 - TARDE (14:00 - 16:30)
    // ========================================================================
    {
        id: 11,
        time: "14:00 - 14:15",
        title: "Título da palestra será definido pela palestrante",
        speaker: "Bruna Valentim",
        description: "A palestrante adicionará a descrição de sua apresentação. Este é um placeholder do projeto open source para que cada participante possa personalizar sua palestra.",
        tags: ["A definir"],
        block: "afternoon",
        isPlaceholder: true
    },
    {
        id: 12,
        time: "14:15 - 14:30",
        title: "Título da palestra será definido pela palestrante",
        speaker: "Cecilia Silva",
        description: "A palestrante adicionará a descrição de sua apresentação. Este é um placeholder do projeto open source para que cada participante possa personalizar sua palestra.",
        tags: ["A definir"],
        block: "afternoon",
        isPlaceholder: true
    },
    {
        id: 13,
        time: "14:30 - 14:45",
        title: "Título da palestra será definido pela palestrante",
        speaker: "Jessica Alexandra",
        description: "A palestrante adicionará a descrição de sua apresentação. Este é um placeholder do projeto open source para que cada participante possa personalizar sua palestra.",
        tags: ["A definir"],
        block: "afternoon",
        isPlaceholder: true
    },
    {
        id: 14,
        time: "14:45 - 15:00",
        title: "Entre o Código e a Consciência: Os Dilemas Éticos da IA",
        speaker: "Jessica Borges",
        description: "Entre o Código e a Consciência traz reflexões sobre os dilemas éticos da IA, mostrando casos reais e como essa tecnologia impacta a sociedade.",
        tags: ["A definir"],
        block: "afternoon",
        isPlaceholder: true
    },
    {
        id: 15,
        time: "15:00 - 15:15",
        title: "Título da palestra será definido pela palestrante",
        speaker: "Karina Kaori",
        description: "A palestrante adicionará a descrição de sua apresentação. Este é um placeholder do projeto open source para que cada participante possa personalizar sua palestra.",
        tags: ["A definir"],
        block: "afternoon",
        isPlaceholder: true
    },
    {
        id: 16,
        time: "15:15 - 15:30",
        title: "Título da palestra será definido pela palestrante",
        speaker: "Keline",
        description: "A palestrante adicionará a descrição de sua apresentação. Este é um placeholder do projeto open source para que cada participante possa personalizar sua palestra.",
        tags: ["A definir"],
        block: "afternoon",
        isPlaceholder: true
    },
    {
        id: 17,
        time: "15:30 - 15:45",
        title: "Título da palestra será definido pela palestrante",
        speaker: "Luciana Damasceno",
        description: "A palestrante adicionará a descrição de sua apresentação. Este é um placeholder do projeto open source para que cada participante possa personalizar sua palestra.",
        tags: ["A definir"],
        block: "afternoon",
        isPlaceholder: true
    },
    {
        id: 18,
        time: "15:45 - 16:00",
        title: "Título da palestra será definido pela palestrante",
        speaker: "Rhaissa Barbosa",
        description: "A palestrante adicionará a descrição de sua apresentação. Este é um placeholder do projeto open source para que cada participante possa personalizar sua palestra.",
        tags: ["A definir"],
        block: "afternoon",
        isPlaceholder: true
    },
    {
        id: 19,
        time: "16:00 - 16:15",
        title: "Título da palestra será definido pela palestrante",
        speaker: "Helena",
        description: "A palestrante adicionará a descrição de sua apresentação. Este é um placeholder do projeto open source para que cada participante possa personalizar sua palestra.",
        tags: ["A definir"],
        block: "afternoon",
        isPlaceholder: true
    },
    {
        id: 20,
        time: "16:15 - 16:30",
        title: "Título da palestra será definido pela palestrante",
        speaker: "Juliana Lisboa",
        description: "A palestrante adicionará a descrição de sua apresentação. Este é um placeholder do projeto open source para que cada participante possa personalizar sua palestra.",
        tags: ["A definir"],
        block: "afternoon",
        isPlaceholder: true
    }
];

// ============================================================================
// 📅 AGENDA GERAL DO EVENTO
// ============================================================================
/*
Cronograma completo do evento desde o credenciamento até o encerramento.
Inclui horários de abertura, blocos de palestras, almoço e cerimônia final.
*/
const scheduleItems = [
    { time: "09:00", title: "Credenciamento", description: "Recepção e entrega de materiais" },
    { time: "10:00", title: "Abertura", description: "Cerimônia de abertura e boas-vindas (10 minutos)" },
    { time: "10:10", title: "Bloco 1 - Manhã", description: "10 palestras técnicas (15 min cada)" },
    { time: "12:40", title: "Encerramento Bloco 1", description: "Encerramento do bloco da manhã" },
    { time: "13:00", title: "Almoço", description: "Intervalo para almoço e networking (1 hora)" },
    { time: "14:00", title: "Bloco 2 - Tarde", description: "10 palestras técnicas (15 min cada)" },
    { time: "16:30", title: "Encerramento", description: "Cerimônia de formatura e networking final" }
];

/*
================================================================================
                        🛠️ FUNÇÕES DE RENDERIZAÇÃO
================================================================================
Estas funções são responsáveis por criar o HTML dinâmico das diferentes seções.
*/

// ============================================================================
// 👥 RENDERIZAR PALESTRANTES
// ============================================================================
/*
Função que cria os cards das palestrantes para a página principal.
Cada card inclui: foto (ícone), nome, cargo, empresa, bio, especialidades e redes sociais.
*/
function renderSpeakers() {
    const container = document.getElementById('speakers-container');
    
    // Verificar se o elemento existe na página atual
    if (!container) {
        console.log('Container speakers-container não encontrado nesta página');
        return;
    }

    container.innerHTML = speakers.map(speaker => `
        <div class="speaker-card fade-in">
            <div class="speaker-image">
                <i class="fas fa-user"></i>
            </div>
            <div class="speaker-info">
                <div class="speaker-name">${speaker.name}</div>
                <div class="speaker-role">${speaker.role}</div>
                <div class="speaker-company">${speaker.company}</div>
                <div class="speaker-bio">${speaker.bio}</div>
                <div class="speaker-expertise">
                    ${speaker.expertise.map(exp => `<span class="expertise-tag">${exp}</span>`).join('')}
                </div>
                <div class="speaker-social">
                    <a href="${speaker.social.linkedin}" target="_blank"><i class="fab fa-linkedin"></i></a>
                    <a href="${speaker.social.twitter}" target="_blank"><i class="fab fa-twitter"></i></a>
                    <a href="${speaker.social.github}" target="_blank"><i class="fab fa-github"></i></a>
                </div>
            </div>
        </div>
    `).join('');
    
    console.log(`✅ ${speakers.length} palestrantes renderizadas com sucesso!`);
}

// ============================================================================
// 🎤 RENDERIZAR PALESTRAS
// ============================================================================
/*
Função que cria os cards das palestras com sistema de placeholders.
- Palestras com isPlaceholder: true mostram aviso para personalização
- Links dos nomes direcionam para a página de palestrantes
- Tags são estilizadas diferentemente para placeholders
*/
function renderTalks() {
    const container = document.getElementById('talks-container');
    
    // Verificar se o elemento existe na página atual
    if (!container) {
        console.log('Container talks-container não encontrado nesta página');
        return;
    }

    container.innerHTML = talks.map(talk => {
        const placeholderClass = talk.isPlaceholder ? 'placeholder-talk' : '';
        const speakerLink = `<a href="palestrantes.html?speaker=${encodeURIComponent(talk.speaker)}" class="speaker-link">${talk.speaker}</a>`;
        
        return `
        <div class="talk-card fade-in ${placeholderClass}">
            <div class="talk-header">
                <div class="talk-time">${talk.time}</div>
                <div class="talk-title">${talk.title}</div>
                <div class="talk-speaker">por ${speakerLink}</div>
            </div>
            <div class="talk-content">
                <div class="talk-description">${talk.description}</div>
                <div class="talk-tags">
                    ${talk.tags.map(tag => `<span class="tag ${talk.isPlaceholder ? 'tag-placeholder' : ''}">${tag}</span>`).join('')}
                </div>
                ${talk.isPlaceholder ? `
                <div class="placeholder-notice">
                    <i class="fas fa-info-circle"></i>
                    <span>Esta palestra será personalizada pela palestrante</span>
                </div>
                ` : ''}
            </div>
        </div>
    `;
    }).join('');
    
    console.log(`✅ ${talks.length} palestras renderizadas com sucesso!`);
}

// ============================================================================
// 📋 RENDERIZAR AGENDA
// ============================================================================
/*
Função que cria a visualização da agenda em dois formatos:
1. Blocos de palestras (manhã e tarde) com detalhes
2. Timeline geral do evento com todos os horários
*/
function renderSchedule() {
    const container = document.getElementById('schedule-container');
    
    // Verificar se o elemento existe na página atual
    if (!container) {
        console.log('Container schedule-container não encontrado nesta página');
        return;
    }

    const morningTalks = talks.filter(talk => talk.block === 'morning');
    const afternoonTalks = talks.filter(talk => talk.block === 'afternoon');

    container.innerHTML = `
        <div class="schedule-blocks">
            <div class="schedule-block">
                <div class="block-header">
                    <div class="block-title">Bloco 1 - Manhã</div>
                    <div class="block-time">10:10 - 12:40</div>
                </div>
                <div class="block-talks">
                    ${morningTalks.map(talk => `
                        <div class="block-talk">
                            <div class="talk-time-small">${talk.time.split(' - ')[0]}</div>
                            <div class="talk-details">
                                <div class="talk-title-small">${talk.title}</div>
                                <div class="talk-speaker-small">${talk.speaker}</div>
                            </div>
                        </div>
                    `).join('')}
                </div>
            </div>
            
            <div class="schedule-block">
                <div class="block-header">
                    <div class="block-title">Bloco 2 - Tarde</div>
                    <div class="block-time">14:00 - 16:30</div>
                </div>
                <div class="block-talks">
                    ${afternoonTalks.map(talk => `
                        <div class="block-talk">
                            <div class="talk-time-small">${talk.time.split(' - ')[0]}</div>
                            <div class="talk-details">
                                <div class="talk-title-small">${talk.title}</div>
                                <div class="talk-speaker-small">${talk.speaker}</div>
                            </div>
                        </div>
                    `).join('')}
                </div>
            </div>
        </div>
        
        <div class="timeline">
            ${scheduleItems.map(item => `
                <div class="timeline-item fade-in">
                    <div class="timeline-time">${item.time}</div>
                    <h4>${item.title}</h4>
                    <p>${item.description}</p>
                </div>
            `).join('')}
        </div>
    `;
    
    console.log('✅ Agenda renderizada com sucesso!');
}

/*
================================================================================
                        🎨 FUNÇÕES DE INTERATIVIDADE
================================================================================
Estas funções adicionam comportamentos dinâmicos e melhoram a experiência do usuário.
*/

// ============================================================================
// 🔗 NAVEGAÇÃO SUAVE (SMOOTH SCROLL)
// ============================================================================
/*
Adiciona efeito de scroll suave para links internos (que começam com #).
Melhora a experiência de navegação entre seções da mesma página.
*/
function smoothScroll() {
    document.querySelectorAll('a[href^="#"]').forEach(anchor => {
        anchor.addEventListener('click', function (e) {
            e.preventDefault();
            const target = document.querySelector(this.getAttribute('href'));
            if (target) {
                target.scrollIntoView({
                    behavior: 'smooth',
                    block: 'start'
                });
            }
        });
    });
    
    console.log('✅ Navegação suave ativada para links internos');
}

// ============================================================================
// ✨ ANIMAÇÕES DE ENTRADA (FADE-IN)
// ============================================================================
/*
Observa elementos com classe 'fade-in' e adiciona classe 'visible' quando
entram na tela, criando efeito de aparição suave.
*/
function fadeInAnimation() {
    const observer = new IntersectionObserver((entries) => {
        entries.forEach(entry => {
            if (entry.isIntersecting) {
                entry.target.classList.add('visible');
            }
        });
    }, {
        threshold: 0.1,
        rootMargin: '0px 0px -50px 0px'
    });

    document.querySelectorAll('.fade-in').forEach(el => {
        observer.observe(el);
    });
    
    console.log('✅ Animações fade-in configuradas');
}

// ============================================================================
// 📱 MENU MOBILE
// ============================================================================
/*
Controla a abertura/fechamento do menu de navegação em dispositivos móveis.
Adiciona/remove classe 'active' para mostrar/esconder o menu.
*/
function mobileMenu() {
    const navToggle = document.querySelector('.nav-toggle');
    const navMenu = document.querySelector('.nav-menu');
    
    if (navToggle && navMenu) {
        navToggle.addEventListener('click', () => {
            navMenu.classList.toggle('active');
        });
        
        console.log('✅ Menu mobile configurado');
    }
}

// ============================================================================
// 📜 EFEITO DE SCROLL NO HEADER
// ============================================================================
/*
Muda a aparência do header quando o usuário faz scroll:
- Adiciona sombra e aumenta opacidade para melhor legibilidade
- Remove efeitos quando volta ao topo da página
*/
function headerScrollEffect() {
    const header = document.querySelector('.header');
    
    window.addEventListener('scroll', () => {
        if (window.scrollY > 100) {
            header.style.background = 'rgba(255, 255, 255, 0.98)';
            header.style.boxShadow = '0 2px 20px rgba(0, 0, 0, 0.1)';
        } else {
            header.style.background = 'rgba(255, 255, 255, 0.95)';
            header.style.boxShadow = 'none';
        }
    });
    
    console.log('✅ Efeito de scroll no header configurado');
}

/*
================================================================================
                        🎯 FUNÇÕES DE INICIALIZAÇÃO
================================================================================
Estas funções são executadas quando a página carrega.
*/

// ============================================================================
// 🚀 INICIALIZAÇÃO PRINCIPAL
// ============================================================================
/*
Função executada quando o DOM está completamente carregado.
Chama todas as funções necessárias para inicializar o site.
*/
document.addEventListener('DOMContentLoaded', function() {
    console.log('🎉 Iniciando site "O Palco é Delas"...');
    
    // Renderizar conteúdo principal
    renderTalks();
    renderSchedule();
    
    // Configurar interatividade
    smoothScroll();
    mobileMenu();
    headerScrollEffect();
    
    // Aguardar um pouco para animações e configurações adicionais
    setTimeout(() => {
        fadeInAnimation();
        addCardInteractions();
        addCountdown();
        addSearchFunction();
        
        console.log('✅ Site inicializado com sucesso!');
    }, 100);
});

/*
================================================================================
                        🔧 FUNÇÕES UTILITÁRIAS AVANÇADAS
================================================================================
Funcionalidades extras para melhorar a experiência do usuário.
*/

// ============================================================================
// 🎨 INTERAÇÕES DOS CARDS
// ============================================================================
/*
Adiciona efeitos hover nos cards de palestras e features.
Cria animações suaves de elevação e sombra.
*/
function addCardInteractions() {
    // Efeito hover nos cards de palestra
    document.querySelectorAll('.talk-card').forEach(card => {
        card.addEventListener('mouseenter', function() {
            this.style.transform = 'translateY(-10px) scale(1.02)';
            this.style.boxShadow = '0 15px 40px rgba(0, 0, 0, 0.15)';
        });
        
        card.addEventListener('mouseleave', function() {
            this.style.transform = 'translateY(0) scale(1)';
            this.style.boxShadow = '0 5px 20px rgba(0, 0, 0, 0.1)';
        });
    });

    // Efeito hover nos cards de feature
    document.querySelectorAll('.feature-card').forEach(card => {
        card.addEventListener('mouseenter', function() {
            this.style.transform = 'translateY(-8px)';
            this.style.boxShadow = '0 15px 30px rgba(0, 0, 0, 0.15)';
        });
        
        card.addEventListener('mouseleave', function() {
            this.style.transform = 'translateY(0)';
            this.style.boxShadow = '0 5px 20px rgba(0, 0, 0, 0.1)';
        });
    });
    
    console.log('✅ Interações dos cards configuradas');
}

// ============================================================================
// ⏰ CONTAGEM REGRESSIVA PARA O EVENTO
// ============================================================================
/*
Cria uma contagem regressiva até a data do evento (23 de agosto de 2025).
Atualiza automaticamente a cada minuto.
NOTA: Precisa de um elemento com id 'countdown' no HTML para funcionar.
*/
function addCountdown() {
    // Data do evento: Sábado, 23 de Agosto de 2025 às 09:00
    const eventDate = new Date('2025-08-23T09:00:00');
    
    function updateCountdown() {
        const now = new Date();
        const diff = eventDate - now;
        
        if (diff > 0) {
            const days = Math.floor(diff / (1000 * 60 * 60 * 24));
            const hours = Math.floor((diff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
            const minutes = Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60));
            
            // Elemento HTML onde mostrar a contagem (opcional)
            const countdownEl = document.getElementById('countdown');
            if (countdownEl) {
                countdownEl.innerHTML = `${days}d ${hours}h ${minutes}m para o evento!`;
            }
        }
    }
    
    // Atualizar a cada minuto
    setInterval(updateCountdown, 60000);
    updateCountdown(); // Executar imediatamente
    
    console.log('✅ Contagem regressiva configurada para 23/08/2025');
}

// ============================================================================
// 🔍 BUSCA DE PALESTRAS
// ============================================================================
/*
Permite buscar palestras por título, palestrante, descrição ou tags.
Filtra e re-renderiza os resultados em tempo real.
NOTA: Precisa de um elemento com id 'search-talks' no HTML para funcionar.
*/
function addSearchFunction() {
    const searchInput = document.getElementById('search-talks');
    
    // Verificar se o elemento existe na página atual
    if (!searchInput) {
        console.log('Campo de busca não encontrado nesta página');
        return;
    }
    
    searchInput.addEventListener('input', function() {
        const searchTerm = this.value.toLowerCase();
        
        // Filtrar palestras baseado no termo de busca
        const filteredTalks = talks.filter(talk => 
            talk.title.toLowerCase().includes(searchTerm) ||
            talk.speaker.toLowerCase().includes(searchTerm) ||
            talk.description.toLowerCase().includes(searchTerm) ||
            talk.tags.some(tag => tag.toLowerCase().includes(searchTerm))
        );
        
        renderFilteredTalks(filteredTalks);
        console.log(`🔍 Busca: "${searchTerm}" - ${filteredTalks.length} resultados`);
    });
    
    console.log('✅ Função de busca configurada');
}

// ============================================================================
// 📋 RENDERIZAR PALESTRAS FILTRADAS
// ============================================================================
/*
Versão simplificada da renderização para resultados de busca.
Não inclui sistema de placeholders pois foca na busca.
*/

function renderFilteredTalks(filteredTalks) {
    const container = document.getElementById('talks-container');
    if (!container) return;

    container.innerHTML = filteredTalks.map(talk => `
        <div class="talk-card fade-in visible">
            <div class="talk-header">
                <div class="talk-time">${talk.time}</div>
                <div class="talk-title">${talk.title}</div>
                <div class="talk-speaker">por ${talk.speaker}</div>
            </div>
            <div class="talk-content">
                <div class="talk-description">${talk.description}</div>
                <div class="talk-tags">
                    ${talk.tags.map(tag => `<span class="tag">${tag}</span>`).join('')}
                </div>
            </div>
        </div>
    `).join('');
    
    // Re-aplicar interações nos novos elementos
    addCardInteractions();
}

/*
================================================================================
                        🌐 FUNÇÕES DE COMPARTILHAMENTO SOCIAL
================================================================================
Permitem compartilhar o evento nas principais redes sociais.
*/

// ============================================================================
// 📤 COMPARTILHAR NAS REDES SOCIAIS
// ============================================================================
/*
Abre janelas popup para compartilhar o evento no Twitter, LinkedIn ou Facebook.
Parâmetros: plataforma, texto e URL para compartilhar.
*/
function shareOnSocial(platform, text, url) {
    const shareText = encodeURIComponent(text);
    const shareUrl = encodeURIComponent(url);
    let shareLink = '';
    
    // Definir URL de compartilhamento baseada na plataforma
    switch(platform) {
        case 'twitter':
            shareLink = `https://twitter.com/intent/tweet?text=${shareText}&url=${shareUrl}`;
            break;
        case 'linkedin':
            shareLink = `https://www.linkedin.com/sharing/share-offsite/?url=${shareUrl}`;
            break;
        case 'facebook':
            shareLink = `https://www.facebook.com/sharer/sharer.php?u=${shareUrl}`;
            break;
        default:
            console.log('Plataforma de compartilhamento não suportada:', platform);
            return;
    }
    
    // Abrir janela popup para compartilhamento
    window.open(shareLink, '_blank', 'width=600,height=400');
    console.log(`📤 Compartilhando no ${platform}`);
}

// ============================================================================
// 🔗 CONFIGURAR BOTÕES DE COMPARTILHAMENTO
// ============================================================================
/*
Adiciona eventos de clique nos botões com classe 'share-btn'.
Os botões devem ter atributo data-platform com o nome da rede social.
*/
function addSocialSharing() {
    const shareButtons = document.querySelectorAll('.share-btn');
    
    if (shareButtons.length === 0) {
        console.log('Nenhum botão de compartilhamento encontrado');
        return;
    }
    
    shareButtons.forEach(btn => {
        btn.addEventListener('click', function() {
            const platform = this.dataset.platform;
            const text = 'Confira o evento "O Palco é Delas" - Empoderando mulheres na tecnologia!';
            const url = window.location.href;
            shareOnSocial(platform, text, url);
        });
    });
    
    console.log(`✅ ${shareButtons.length} botões de compartilhamento configurados`);
}

/*
================================================================================
                        🎪 FUNCIONALIDADES EXTRAS
================================================================================
Recursos adicionais que podem ser implementados conforme necessário.
*/

// ============================================================================
// 📋 MODAL DE DETALHES DA PALESTRA
// ============================================================================
/*
Exibe detalhes completos de uma palestra em modal popup.
NOTA: Função opcional - precisa de CSS correspondente para o modal.
*/
function showTalkDetails(talkId) {
    // Buscar palestra pelo ID
    const talk = talks.find(t => t.id === talkId);
    if (!talk) {
        console.log('Palestra não encontrada:', talkId);
        return;
    }
    
    // Criar estrutura do modal
    const modal = document.createElement('div');
    modal.className = 'modal';
    modal.innerHTML = `
        <div class="modal-content">
            <span class="close">&times;</span>
            <h2>${talk.title}</h2>
            <p><strong>Palestrante:</strong> ${talk.speaker}</p>
            <p><strong>Horário:</strong> ${talk.time}</p>
            <p><strong>Descrição:</strong> ${talk.description}</p>
            <div class="talk-tags">
                ${talk.tags.map(tag => `<span class="tag">${tag}</span>`).join('')}
            </div>
        </div>
    `;
    
    document.body.appendChild(modal);
    
    // Configurar fechamento do modal
    const closeBtn = modal.querySelector('.close');
    closeBtn.addEventListener('click', () => {
        document.body.removeChild(modal);
    });
    
    // Fechar clicando fora do modal
    modal.addEventListener('click', (e) => {
        if (e.target === modal) {
            document.body.removeChild(modal);
        }
    });
    
    console.log('📋 Modal aberto para palestra:', talk.title);
}

// ============================================================================
// 🖨️ IMPRESSÃO DA AGENDA
// ============================================================================
/*
Gera uma versão para impressão da agenda do evento.
Abre nova janela com layout otimizado para papel.
*/
function printSchedule() {
    // Criar nova janela para impressão
    const printWindow = window.open('', '_blank');
    
    // Gerar HTML otimizado para impressão
    printWindow.document.write(`
        <html>
            <head>
                <title>Agenda - O Palco é Delas</title>
                <style>
                    body { 
                        font-family: Arial, sans-serif; 
                        margin: 20px; 
                        color: #333;
                    }
                    h1 { 
                        color: #3a8197; 
                        text-align: center;
                        margin-bottom: 30px;
                    }
                    .schedule-item { 
                        margin-bottom: 15px; 
                        padding: 10px; 
                        border-left: 4px solid #91c9cd;
                        page-break-inside: avoid;
                    }
                    .time { 
                        font-weight: bold; 
                        color: #3a8197; 
                        font-size: 1.1em;
                    }
                    h3 {
                        margin: 5px 0;
                        color: #3a8197;
                    }
                    p {
                        margin: 5px 0;
                        line-height: 1.4;
                    }
                    @media print {
                        body { margin: 0; }
                    }
                </style>
            </head>
            <body>
                <h1>O Palco é Delas - Agenda do Evento</h1>
                <p style="text-align: center; margin-bottom: 30px;">
                    <strong>Sábado, 23 de Agosto de 2025</strong>
                </p>
                ${scheduleItems.map(item => `
                    <div class="schedule-item">
                        <div class="time">${item.time}</div>
                        <h3>${item.title}</h3>
                        <p>${item.description}</p>
                    </div>
                `).join('')}
            </body>
        </html>
    `);
    
    // Finalizar e imprimir
    printWindow.document.close();
    printWindow.print();
    
    console.log('🖨️ Agenda enviada para impressão');
}

/*
================================================================================
                              🎯 RESUMO FINAL
================================================================================
Este arquivo contém todas as funcionalidades do site "O Palco é Delas":

📊 DADOS:
- 20 palestrantes com informações completas
- 20 palestras divididas em 2 blocos (manhã e tarde)
- Agenda completa do evento
- Sistema de placeholders para personalização

🛠️ FUNCIONALIDADES:
- Renderização dinâmica de conteúdo
- Navegação suave entre seções
- Menu mobile responsivo
- Animações de entrada
- Sistema de busca
- Contagem regressiva
- Compartilhamento social
- Modal de detalhes
- Impressão de agenda

🚀 INICIALIZAÇÃO:
- Carregamento automático quando DOM estiver pronto
- Verificações de segurança para elementos opcionais
- Logs detalhados para debugging
- Configuração modular e extensível

Para adicionar novas funcionalidades, seguir o padrão de documentação
e organização estabelecido neste arquivo.
*/