// Services page interactive functionality
let dropdownStates = {};

function toggleDropdown(category) {
    const dropdownButton = document.querySelector(`.${category}-dropdown-btn`);
    const dropdownContent = document.querySelector(`.${category}-dropdown-content`);
    const chevronIcon = dropdownButton.querySelector('i');
    
    if (dropdownStates[category]) {
        // Close dropdown
        dropdownContent.classList.add('hidden');
        chevronIcon.classList.remove('fa-chevron-up');
        chevronIcon.classList.add('fa-chevron-down');
        dropdownStates[category] = false;
    } else {
        // Open dropdown
        dropdownContent.classList.remove('hidden');
        chevronIcon.classList.remove('fa-chevron-down');
        chevronIcon.classList.add('fa-chevron-up');
        dropdownStates[category] = true;
    }
}

function handleDropdownClicks() {
    // Architecture dropdown
    const architectureBtn = document.querySelector('.architecture-dropdown-btn');
    if (architectureBtn) {
        architectureBtn.addEventListener('click', () => toggleDropdown('architecture'));
    }
    
    // Engineering dropdown
    const engineeringBtn = document.querySelector('.engineering-dropdown-btn');
    if (engineeringBtn) {
        engineeringBtn.addEventListener('click', () => toggleDropdown('engineering'));
    }
    
    // Consultancy dropdown
    const consultancyBtn = document.querySelector('.consultancy-dropdown-btn');
    if (consultancyBtn) {
        consultancyBtn.addEventListener('click', () => toggleDropdown('consultancy'));
    }
    
    // Project Management dropdown
    const projectBtn = document.querySelector('.project-dropdown-btn');
    if (projectBtn) {
        projectBtn.addEventListener('click', () => toggleDropdown('project'));
    }
}

function handleQuoteRequests() {
    // Add click handlers for all "Request Quote" buttons
    const quoteButtons = document.querySelectorAll('button:has([class*="fa-quote-left"])');
    quoteButtons.forEach(button => {
        button.addEventListener('click', () => {
            // Navigate to contact page or show quote modal
            window.location.href = '/contact';
        });
    });
}

function handleProfessionalViews() {
    // Add click handlers for all "View Professionals" buttons
    const viewButtons = document.querySelectorAll('button:has([class*="fa-users"])');
    viewButtons.forEach(button => {
        button.addEventListener('click', () => {
            // Navigate to marketplace or professionals page
            window.location.href = '/marketplace';
        });
    });
}

function handleUploadActions() {
    // Handle upload buttons
    const uploadBtn = document.querySelector('button:has([class*="fa-upload"])');
    if (uploadBtn) {
        uploadBtn.addEventListener('click', () => {
            // Navigate to professional registration or upload page
            window.location.href = '/contact-us';
        });
    }
    
    const guidelinesBtn = document.querySelector('button:has([class*="fa-info-circle"])');
    if (guidelinesBtn) {
        guidelinesBtn.addEventListener('click', () => {
            // Show upload guidelines or navigate to help page
            window.location.href = '/faqs';
        });
    }
}

function handleRegistrationButtons() {
    // Handle registration buttons in the marketplace section
    const registrationButtons = document.querySelectorAll('button:contains("Register")');
    registrationButtons.forEach(button => {
        button.addEventListener('click', () => {
            // Navigate to appropriate registration page
            window.location.href = '/register';
        });
    });
}

// Initialize dropdown states
function initializeDropdownStates() {
    dropdownStates = {
        architecture: false,
        engineering: false,
        consultancy: false,
        project: false
    };
}

// Main initialization function
function init() {
    initializeDropdownStates();
    handleDropdownClicks();
    handleQuoteRequests();
    handleProfessionalViews();
    handleUploadActions();
    handleRegistrationButtons();
}

// Cleanup function
function teardown() {
    // Remove event listeners
    const architectureBtn = document.querySelector('.architecture-dropdown-btn');
    const engineeringBtn = document.querySelector('.engineering-dropdown-btn');
    const consultancyBtn = document.querySelector('.consultancy-dropdown-btn');
    const projectBtn = document.querySelector('.project-dropdown-btn');
    
    if (architectureBtn) architectureBtn.replaceWith(architectureBtn.cloneNode(true));
    if (engineeringBtn) engineeringBtn.replaceWith(engineeringBtn.cloneNode(true));
    if (consultancyBtn) consultancyBtn.replaceWith(consultancyBtn.cloneNode(true));
    if (projectBtn) projectBtn.replaceWith(projectBtn.cloneNode(true));
    
    // Reset states
    dropdownStates = {};
}

export { init, teardown };