import Input from '@/components/Input'
import { ArrowLeft } from 'iconsax-react'
import Image from 'next/image'
import { FC } from 'react'

const Footer: FC = () => {
    return (
        <div className='w-full border-4 border-white rounded-4xl bg-white/26 px-4 min-h-[550px] xl:mt-24 mt-16 flex flex-col'>
            <div className='max-w-maxWidth mx-auto flex flex-col flex-1 w-full  pt-10'>
                <div className='flex-1 flex items-center pb-10'>

                    <div className='flex xl:flex-row flex-col xl:gap-24 gap-7 w-full'>

                        <div className='xl:max-w-[203px] flex flex-col items-center text-center xl:items-start xl:text-right'>
                            <Image
                                src={'/images/logo.svg'}
                                width={140}
                                height={58}
                                alt='لوگو داناک'
                            />

                            <p className='mt-6 text-sm xl:text-justify text-center'>
                                ما در داناک هم تولیدکننده نرم‌افزارهای پیشرفته هستیم و هم بستری برای فروش محصولات نرم‌افزاری دیگران فراهم کرده‌ایم. با ما هوشمندانه بسازید و حرفه‌ای بفروشید.
                            </p>
                        </div>

                        <div className='flex xl:gap-24 gap-7 justify-between'>
                            <div>
                                <h6 className='font-bold xl:text-base text-xs'>
                                    داناک
                                </h6>
                                <ul className='xl:text-sm text-xs mt-4 flex flex-col gap-4 text-center'>
                                    <li>
                                        محصولات
                                    </li>
                                    <li>
                                        خدمات
                                    </li>
                                    <li>
                                        مجله
                                    </li>
                                </ul>
                            </div>

                            <div>
                                <h6 className='font-bold xl:text-base text-xs whitespace-nowrap'>
                                    سرویس ها محبوب
                                </h6>
                                <ul className='xl:text-sm text-xs mt-4 flex flex-col gap-4 text-center'>
                                    <li>
                                        دی منو
                                    </li>
                                    <li>
                                        دی میل
                                    </li>
                                    <li>
                                        دی پیج
                                    </li>
                                </ul>
                            </div>

                            <div>
                                <h6 className='font-bold xl:text-base text-xs'>
                                    همکاری با داناک
                                </h6>
                                <ul className='xl:text-sm text-xs mt-4 flex flex-col gap-4 text-center'>
                                    <li>
                                        توسعه دهندگان
                                    </li>
                                    <li>
                                        نمایندگان
                                    </li>
                                </ul>
                            </div>
                        </div>

                        <div className='w-full flex-1'>
                            <h6 className='font-bold xl:text-base text-xs'>
                                خبرنامه
                            </h6>

                            <div className='mt-4 relative'>
                                <Input
                                    className='bg-[#ECEFF6] border-none shadow-inner'
                                />
                                <div className='absolute left-1 top-1 rounded-xl size-8 bg-white flex justify-center items-center'>
                                    <ArrowLeft
                                        size={18}
                                        color='black'
                                    />
                                </div>
                            </div>

                            <div className='mt-10 flex gap-4 items-center justify-center xl:justify-start'>
                                <Image
                                    src={'/images/linkedin.svg'}
                                    width={24}
                                    height={24}
                                    alt='داناک لینکداین'
                                />
                                <Image
                                    src={'/images/instagram.svg'}
                                    width={24}
                                    height={24}
                                    alt='داناک ایسنتاگرام'
                                />
                                <Image
                                    src={'/images/whatsapp.svg'}
                                    width={24}
                                    height={24}
                                    alt='داناک واتساپ'
                                />
                                <Image
                                    src={'/images/telegram.svg'}
                                    width={24}
                                    height={24}
                                    alt='داناک تلگرام'
                                />
                            </div>
                        </div>

                    </div>

                </div>
                <div className='xl:h-14 border-t border-[#DADDE6] flex xl:flex-row flex-col gap-5 pt-5 xl:pt-0 justify-between items-center'>
                    <ul className='flex gap-4 xl:text-sm text-[10px]'>
                        <li className='xl:pl-4 xl:border-l border-[#DADDE6]'>
                            درباره ی ما
                        </li>
                        <li className='xl:pl-4 xl:border-l border-[#DADDE6]'>
                            حریم خصوصی
                        </li>
                        <li className='xl:pl-4 xl:border-l border-[#DADDE6]'>
                            قوانین و مقررات
                        </li>
                        <li>
                            تماس با ما
                        </li>
                    </ul>

                    <div className='xl:text-sm text-xs dltr pb-4 xl:pb-0'>
                        © 2025 Danak. All rights reserved.
                    </div>
                </div>
            </div>
        </div>
    )
}

export default Footer