'use client'

import Image from 'next/image'
import Link from 'next/link'
import styles from './Footer.module.css'
import { FaFacebookF, FaTwitter, FaInstagram } from 'react-icons/fa'

export default function Footer() {

    const metatronCubeLink = "https://metatroncubesolutions.com/";

    return (
        <footer className={styles.footer} id="contact">
            <div className={styles.borderWrapper}>
                <div className={styles.container}>
                    {/* Brand Column */}
                    <div className={`${styles.column} ${styles.brandColumn}`}>
                        <div className={styles.logo}>
                            <Link href="/" onClick={() => window.scrollTo(0, 0)} prefetch={false}>
                                <Image
                                    src="/images/footer-logo.png"
                                    alt="Antalya Restaurant Footer Logo"
                                    width={200}
                                    height={200}
                                    className={styles.logoImage}
                                    priority
                                />
                            </Link>
                        </div>
                        <p className={styles.description}>
                            Discover the richness of Turkish fusion dining in the heart of Ontario at Antalya Restaurant.
                            Our thoughtfully curated menu showcases everything from fire-grilled kebabs and juicy doners to authentic pides, wraps, and sandwiches - crafted to bring true Anatolian flavour to your table.
                        </p>
                        <div className={styles.socialIcons}>
                            <a
                                href="https://www.facebook.com/antalyakebabgrill#"
                                className={styles.iconLink}
                                target="_blank"
                                rel="noopener noreferrer"
                            >
                                <div className={styles.icon}>
                                    <FaFacebookF />
                                </div>
                            </a>

                            <a
                                href="#"
                                className={styles.iconLink}
                                target="_blank"
                                rel="noopener noreferrer"
                            >
                                <div className={styles.icon}>
                                    <FaTwitter />
                                </div>
                            </a>

                            <a
                                href="#"
                                className={styles.iconLink}
                                target="_blank"
                                rel="noopener noreferrer"
                            >
                                <div className={styles.icon}>
                                    <FaInstagram />
                                </div>
                            </a>

                        </div>
                    </div>

                    {/* Quick Links Column */}
                    <div className={`${styles.column} ${styles.linksColumn}`}>
                        <h3 className={styles.heading}>Quick Links</h3>
                        <ul className={styles.linkList}>
                            <li className={styles.linkItem}><Link href="/" className={styles.link} prefetch={false}>Home</Link></li>
                            <li className={styles.linkItem}><Link href="/antalya-restaurant-menu" className={styles.link} prefetch={false}>Menu</Link></li>
                            <li className={styles.linkItem}><Link href="/catering-services-ontario" className={styles.link} prefetch={false}>Catering</Link></li>
                            <li className={styles.linkItem}><Link href="/antalya-restaurant-gallery" className={styles.link} prefetch={false}>Gallery</Link></li>
                            <li className={styles.linkItem}><Link href="/about-antalya-restaurant" className={styles.link} prefetch={false}>About</Link></li>
                            <li className={styles.linkItem}><Link href="/antalya-turkish-food-blog" className={styles.link} prefetch={false}>Blog</Link></li>
                            <li className={styles.linkItem}><Link href="/book-a-table" className={styles.link} prefetch={false}>Contact</Link></li>
                        </ul>
                    </div>

                    {/* Location Column */}
                    <div className={`${styles.column} ${styles.locationColumn}`}>
                        <div className={styles.locationHoursWrapper}>
                            {/* LEFT - LOCATION */}
                            <div className={styles.locationBlock}>
                                <h3 className={styles.heading}>Location</h3>
                                <p className={styles.address}>
                                    1187 Fischer-Hallman Rd #435, Kitchener, ON N2E 4H9<br />
                                    1860 Appleby Line, Burlington, ON L7L 7H7
                                </p>

                                <div className={styles.contactRow}>
                                    <img src="/images/phone-call.png" alt="Kitchener Phone Icon" className={styles.iconImage} />
                                    <a href="tel:5195816363">Kitchener: 519-581-6363</a>
                                </div>

                                <div className={styles.contactRow}>
                                    <img src="/images/phone-call.png" alt="Burlington Phone Icon" className={styles.iconImage} />
                                    <a href="tel:2893139838">Burlington: 289-313-9838</a>
                                </div>

                                <div className={styles.contactRow}>
                                    <img src="/images/email.png" alt="Email Icon" className={styles.iconImage} />
                                    <a href="mailto:hello@antalyarestaurant.ca">hello@antalyarestaurant.ca</a>
                                </div>
                            </div>

                            {/* RIGHT - HOURS */}
                            <div className={styles.hoursBlock}>
                                <h3 className={styles.subHeading}>Opening Hours</h3>
                                <p className={styles.hours}>
                                    Sunday-Saturday 11am-10pm<br />
                                    {/* Friday-Saturday 11am-11pm */}
                                </p>
                            </div>
                        </div>
                    </div>


                </div>

                <div className={styles.copyright}>
                    © Copyright 2025 Antalya Restaurant | Powered by{' '}
                    <a
                        href={metatronCubeLink}
                        target="_blank"
                        rel="noopener noreferrer"
                    >
                        MetatronCube
                    </a>{' '}
                    All Rights Reserved
                </div>
            </div>
        </footer>
    )
}