From b193455e99bb0335ab29ef36f94992eaaa8d1a9c Mon Sep 17 00:00:00 2001
From: TheOnlyMace <0815cracky@gmail.com>
Date: Tue, 13 Jan 2026 22:07:37 +0100
Subject: [PATCH] Add FAQ accordion functionality to main.js: Implemented
 interactive FAQ section that allows users to toggle answers while ensuring
 only one item is open at a time. Enhanced user experience by managing answer
 visibility with smooth transitions.

---
 public/assets/js/main.js | 35 +++++++++++++++++++++++++++++++++++
 1 file changed, 35 insertions(+)

diff --git a/public/assets/js/main.js b/public/assets/js/main.js
index c227c52..19429b6 100644
--- a/public/assets/js/main.js
+++ b/public/assets/js/main.js
@@ -251,9 +251,44 @@
         }
     }
 
+    // FAQ Accordion functionality
+    function initFAQ() {
+        const faqItems = document.querySelectorAll('.faq-item');
+        
+        faqItems.forEach(item => {
+            const question = item.querySelector('.faq-question');
+            const answer = item.querySelector('.faq-answer');
+            
+            if (question && answer) {
+                question.addEventListener('click', function() {
+                    // Close all other FAQ items
+                    faqItems.forEach(otherItem => {
+                        if (otherItem !== item && otherItem.classList.contains('open')) {
+                            otherItem.classList.remove('open');
+                            const otherAnswer = otherItem.querySelector('.faq-answer');
+                            if (otherAnswer) {
+                                otherAnswer.style.maxHeight = null;
+                            }
+                        }
+                    });
+                    
+                    // Toggle current item
+                    item.classList.toggle('open');
+                    
+                    if (item.classList.contains('open')) {
+                        answer.style.maxHeight = answer.scrollHeight + 'px';
+                    } else {
+                        answer.style.maxHeight = null;
+                    }
+                });
+            }
+        });
+    }
+
     // Initialize all features when DOM is loaded
     document.addEventListener('DOMContentLoaded', function() {
         initDarkMode();
+        initFAQ();
         
         // Add loading animation complete class
         document.body.classList.add('loaded');