import { PRODUCT_INFO } from '@/shared/constants/data';
import formatPhone from '@/shared/lib/formatPhone';
import Link from 'next/link';
import React from 'react';

const ContactGridItem = () => {
  return (
    <div>
      <div className="font-bold flex items-center gap-2">
        <span>Контакты</span>
        <div className="w-[25px] h-[4px] bg-gradient-to-r from-primary to-secondary"></div>
      </div>
      <div className="mt-[20px] flex flex-col gap-2 items-start">
        <p className="text-[14px] font-semibold text-muted">
          {PRODUCT_INFO.contact.address}
        </p>
        <Link
          href={`tel:${PRODUCT_INFO.contact.phone}`}
          className="border-b border-white font-semibold"
        >
          {formatPhone(PRODUCT_INFO.contact.phone)}
        </Link>
        <Link
          href={`mailto:${PRODUCT_INFO.contact.email}`}
          className="text-muted font-semibold hover:text-white duration-200"
        >
          {PRODUCT_INFO.contact.email}
        </Link>
      </div>
    </div>
  );
};

export default ContactGridItem;
