"use client";

import Title from "../lib_components/title";
import { FaPhoneAlt, FaTelegram } from "react-icons/fa";
import { BiTargetLock } from "react-icons/bi";
import GoogleMap from "../lib_components/google.map";

export default function Map() {
  return (
    <div dir="ltr" className="relative flex items-start justify-center">
      {/* map */}
      <div className="w-full ">
        <GoogleMap />
      </div>

      {/* contact information */}
      <div className="absolute flex flex-col gap-3 sm:top-20 top-5 sm:right-20 z-50 bg-white rounded-[15px] p-5 px-10 max-w-[400px] w-full text-left ">
        <div className="text-left flex w-full justify-start">
          <Title text="contacts" />
        </div>
        <div className="flex items-center justify-start gap-2 text-gray-500 text-[20px] ">
          <span className="text-secondary">
            <FaPhoneAlt />
          </span>
          +998 33 252-00-00
        </div>
        <div className="flex items-center justify-start gap-2 text-gray-500 text-[20px] ">
          <span className="text-secondary">
            <FaTelegram />
          </span>
          spes-texnika
        </div>
        <div className="flex items-center justify-start gap-2 text-gray-500 text-[20px] ">
          <span className="text-secondary">
            <BiTargetLock />
          </span>
          Yakkasaroy , Toshkent
        </div>
      </div>
    </div>
  );
}