components/footer.js

class CustomFooter extends HTMLElement {
    connectedCallback() {
        this.attachShadow({ mode: 'open' });
        this.shadowRoot.innerHTML = `
            <style>
                footer {
                    background: rgba(0, 0, 0, 0.2);
                    backdrop-filter: blur(10px);
                }
            </style>
            <footer class="py-8 border-t border-white/20">
                <div class="container mx-auto px-4">
                    <div class="flex flex-col md:flex-row justify-between items-center">
                        <div class="mb-4 md:mb-0">
                            <h3 class="text-2xl font-bold">INDUS<span class="text-yellow-400">CORE</span> AI</h3>
                            <p class="text-sm mt-1">India's Super Intelligence App</p>
                        </div>
                        <div class="flex space-x-6">
                            <a href="#" class="hover:text-yellow-400 transition-colors">Privacy</a>
                            <a href="#" class="hover:text-yellow-400 transition-colors">Terms</a>
                            <a href="#" class="hover:text-yellow-400 transition-colors">Contact</a>
                        </div>
                    </div>
                    <div class="mt-8 text-center text-sm text-white/60">
                        © 2023 IndusCore AI. All rights reserved.
                    </div>
                </div>
            </footer>
        `;
    }
}
customElements.define('custom-footer', CustomFooter);