import React from 'react'
import { FaFacebookF, FaTwitter, FaWhatsapp } from "react-icons/fa"
import { CiLinkedin } from "react-icons/ci"

const Footer = () => {
  return (

    <div className="grid  bg-[#AFA0D7] p-5">
      <div className="mb-6 flex items-center gap-5 ">
        <a href="">
          <img src="/public/image/logoeskayvie.png" alt="" className="w-14 h-14 rounded-full p-2 bg-white" />
        </a>
        <p className="text-2xl font-bold text-[#fefefe]">ESKAYVIE</p>
      </div>
      <div className="lg:flex lg:justify-between lg:gap-5  lg:mb-3">
        <div className="w-full mb-2">
          <p className="text-md text-[#fefefe]">
            Lorem ipsum dolor sit amet consectetur adipisicing elit. Cum alias
            dignissimos animi qui aliquid aut temporibus quisquam accusamus
            soluta, voluptatum reiciendis libero optio assumenda et quidem
            quasi reprehenderit tempore consequatur. Lorem ipsum dolor sit
            amet consectetur adipisicing elit. Laborum quaerat quibusdam nisi
            commodi veniam, esse sunt voluptas officia autem dignissimos odio
            eos mollitia perspiciatis, placeat dolore? Tempore, dicta.
          </p>
        </div>

        <div className="gird">
          <h1 className="text-lg font-bold text-white">Connect With Us!</h1>
          <p className='text-white'>customercare@eskayvie.com
          </p>
          <p className='text-white'> 03-5511 1050</p>
          <div className="mt-3 mb-3 flex items-center gap-3">
            <a
              href=""
              className="flex p-2 items-center justify-center rounded-full bg-[#E2D7FF]  text-xl"
            >
              <FaFacebookF className="text-xl" />
            </a>
            <a
              href=""
              className="flex p-2 items-center justify-center rounded-full bg-[#E2D7FF] "
            >
              <FaTwitter className="text-xl" />
            </a>
            <a
              href=""
              className="flex p-2 items-center justify-center rounded-full bg-[#E2D7FF]   text-xl"
            >
              <FaWhatsapp className="text-xl" />
            </a>
            <a
              href=""
              className="flex p-2 items-center justify-center rounded-full bg-[#E2D7FF]  text-xl  "
            >
              <CiLinkedin className="text-xl" />
            </a>
          </div>
        </div>
      </div>

      <div className="grid items-start mx-2 gap-3 md:flex md:justify-between text-white">
        <p>
          We shall continuously improve our products and services to enhance customer satisfaction and complying with ISO 9001 Quality Management System requirements.
        </p>
        <div className='grid gap-5'>
          <p className='flex justify-center text-xl font-bold'>Organization</p>
          <div className='lg:flex gap-5 grid grid-cols-2'>
            <div className='w-32 p-2 rounded-xl bg-white bg-opacity-50'>

              <img src="/image/yayasan.png" alt="" />
            </div>
            <div className='w-32 p-2 rounded-xl bg-white bg-opacity-50'>

              <img src="/image/yayasan.png" alt="" />
            </div>
            <div className='w-32 p-2 rounded-xl bg-white bg-opacity-50'>

              <img src="/image/yayasan.png" alt="" />
            </div>
          </div>
        </div>

      </div>
      <div className=" boder-2 border-2 border-x-transparent border-b-transparent pt-2 border-white flex justify-center items-center text-white font-bold text-lg mt-5">
        @2024 ESKAYVIE
      </div>

    </div>
  )
}

export default Footer