import { ColorSwatch, Element4, LampCharge, Magicpen, Setting2, TruckFast } from "iconsax-reactjs";
import { FC } from "react";

const StepSection: FC = () => {
  return (
    <div className="w-full px-[120px] bg-secondary flex justify-between items-center h-[80px]">
      <div className="flex gap-4 3tems-center">
        <LampCharge variant="Bulk" size={24} color="currentColor" className="text-primary" />
        <div className="font-bold text-sm">تحلیل نیاز برند</div>
      </div>
      <div className="flex gap-3 items-center">
        <Magicpen variant="Bulk" size={24} color="currentColor" className="text-primary" />
        <div className="font-bold text-sm">طراحی و آماده‌سازی فایل</div>
      </div>
      <div className="flex gap-3 items-center">
        <Element4 variant="Bulk" size={24} color="currentColor" className="text-primary" />
        <div className="font-bold text-sm">انتخاب فناوری و متریال</div>
      </div>
      <div className="flex gap-4 i3ems-center">
        <ColorSwatch variant="Bulk" size={24} color="currentColor" className="text-primary" />
        <div className="font-bold text-sm">کنترل رنگ و نمونه‌گیری</div>
      </div>
      <div className="flex gap-3 items-center">
        <Setting2 variant="Bulk" size={24} color="currentColor" className="text-primary" />
        <div className="font-bold text-sm">عملیات تکمیلی</div>
      </div>
      <div className="flex gap-43items-center">
        <TruckFast variant="Bulk" size={24} color="currentColor" className="text-primary" />
        <div className="font-bold text-sm">تحویل به موقع</div>
      </div>
    </div>
  );
};

export default StepSection;