import { FlotAutoCardImage, FlotAutoCardImage2, FlotAutoCardImage3, FlotAutoCoverImage } from '@/assets/svg'
import { metaTitles } from '@/components/metaData/metaTitles'
import { Button } from '@/components/ui/buttons/Button'
import { CustomCard } from '@/components/ui/cards'
import CustomImage from '@/components/ui/miscellaneous/CustomImage'
import { H2, H3,  H5, S } from '@/components/ui/typography'
import { useTranslations } from 'next-intl'
import React from 'react'

const FlotAutoPresentation = () => {
    const t = useTranslations()
    return (
        <div className="relative w-full flex flex-col gap-6  ">
            <CustomCard className=' w-full bg-white  flex flex-col gap-3  p-2 border-none shadow-lg shadow-black/5 '>
                <div className=" lg:h-[387px] w-full  ">
                    <CustomImage pageTitle={metaTitles?.FlautAutoMeta_Title} src={FlotAutoCoverImage} alt="FlotAutoCoverImage" className="dadycar fautauto award event" />
                </div>
                <div className='flex items-center justify-center flex-col gap-2 '>
                    <H3>{t("About the Flotauto Paris – La Villette Meetings")}</H3>
                    <S className='!text-muted-foreground lg:w-[650px] text-center'>{t("The Flotauto Paris – La Villette Meetings is a major event dedicated to mobility solutions, bringing together key players in the sector to present the latest innovations and trends in vehicle fleet management and sustainable mobility")}</S>
                </div>
                <Button className=' w-fit mx-auto mt-2 mb-10' variant={"outline"}>{t("Discover more")}</Button>
            </CustomCard>
            <div className=' grid grid-cols-1  sm:grid-cols-3 gap-6    '>
                <CustomCard className='flex flex-col gap-4 justify-center items-center text-center  bg-white w-full border-none p-6 shadow-xl shadow-black/5 '>
                    <H2 className=''>250</H2>
                    <S className='max-w-60 text-muted-foreground !text-base !font-normal'>{t("Exhibitors")}</S>
                </CustomCard>
                <CustomCard className='flex flex-col gap-4 justify-center items-center text-center  bg-white w-full border-none p-6 shadow-xl shadow-black/5'>
                    <H2 className=''>5500</H2>
                    <S className='max-w-60 text-muted-foreground !text-base !font-normal'>{t("Visitors")}</S>
                </CustomCard>
                <CustomCard className='flex flex-col gap-4 justify-center items-center text-center  bg-white w-full border-none p-6 shadow-xl shadow-black/5'>
                    <H2 className=''>25</H2>
                    <S className='max-w-60 text-muted-foreground !text-base !font-normal'>{t("Conferences")}</S>
                </CustomCard>
            </div>
            <div className='grid grid-cols-1 sm:grid-cols-2  lg:grid-cols-4 gap-6'>
                <CustomCard className='flex flex-col gap-1 border-none w-full h-[420px]'>
                    <CustomImage pageTitle={metaTitles?.FlautAutoMeta_Title} src={FlotAutoCardImage} className='h-[211px] w-full rounded-md object-cover mb-1' alt='dadycar fautauto award event'/>
                    <H5>{t("Exhibitors")}</H5>
                    <S className=' text-muted-foreground  !font-normal'>{t("Dadycar leveraged the presence of 250 exhibitors specializing in fleet management to engage with key industry players It also established strategic partnerships aimed at developing innovative solutions tailored to business needs")}</S>
                </CustomCard>
                <CustomCard className='flex flex-col gap-1 border-none w-full h-[420px]'>
                    <CustomImage pageTitle={metaTitles?.FlautAutoMeta_Title} src={FlotAutoCardImage2} className='h-[211px] w-full rounded-md object-cover mb-1' alt='dadycar fautauto award event'/>
                    <H5>{t("Conferences")}</H5>
                    <S className=' text-muted-foreground  !font-normal'>{t("Discussions around the challenges of vehicle fleet management confirmed the importance of Dadycar's solutions for digitalizing, optimizing and supporting companies in their energy transition")}</S>
                </CustomCard>
                <CustomCard className='flex flex-col gap-1 border-none w-full h-[420px]'>
                    <CustomImage pageTitle={metaTitles?.FlautAutoMeta_Title} src={FlotAutoCardImage3} className='h-[211px] w-full rounded-md object-cover mb-1' alt='dadycar fautauto award event'/>
                    <H5>{t("Eco-responsible vehicles")}</H5>
                    <S className=' text-muted-foreground  !font-normal'>{t("Various providers of eco-friendly solutions participated in the event Dadycar supports this transition by providing advanced tracking tools to maximize the profitability and environmental impact of electric and hybrid vehicles")}</S>
                </CustomCard>
                <CustomCard className='flex flex-col gap-1 border-none w-full h-[420px]'>
                    <CustomImage pageTitle={metaTitles?.FlautAutoMeta_Title} src={FlotAutoCardImage} className='h-[211px] w-full rounded-md object-cover mb-1' alt='dadycar fautauto award event'/>
                    <H5>{t("ChargeAuto")}</H5>
                    <S className=' text-muted-foreground  !font-normal'>{t("A hall entirely dedicated to charging solutions was set up during the Flotauto 2025 meetings This fits perfectly with Dadycar's mission, which offers connected solutions for optimized electrification of vehicle fleets")}</S>
                </CustomCard>

            </div>
        </div>
    )
}

export default FlotAutoPresentation