// Initialize file upload functionality
document.getElementById('video-upload').addEventListener('change', function(e) {
    const fileName = e.target.files[0]?.name;
    if (fileName) {
        const uploadBox = document.querySelector('.border-dashed');
        uploadBox.innerHTML = `
            <i data-feather="check-circle" class="w-12 h-12 mb-4 text-green-500"></i>
            <p class="text-gray-200 font-medium mb-2">${fileName}</p>
            <p class="text-gray-400 text-sm">Video ready for processing</p>
        `;
        feather.replace();
    }
});

// Demo functionality for face selection
const faceSelects = document.querySelectorAll('select');
faceSelects.forEach(select => {
    select.innerHTML = `
        <option>Select face</option>
        <option>Face 1 (Main character)</option>
        <option>Face 2 (Background person)</option>
        <option>Upload new face...</option>
    `;
});

// Theme toggle functionality (will work with navbar component)
document.addEventListener('DOMContentLoaded', () => {
    // Check for saved theme preference or use system preference
    const savedTheme = localStorage.getItem('theme') || 
        (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light');
    
    document.documentElement.classList.toggle('dark', savedTheme === 'dark');

    // Initialize tooltips
    const tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
    tooltipTriggerList.map(function (tooltipTriggerEl) {
        return new bootstrap.Tooltip(tooltipTriggerEl);
    });
});