import { User , Headphones } from "lucide-react";

const AddressTab = ({ addresses }:any) => {
    return (
        <div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
            {addresses.map((address:any) => (
                <div
                    key={address.id}
                    className={`bg-white p-6 rounded-2xl border-2 ${
                        address.isDefault ? 'border-[#ffd230]' : 'border-gray-200'
                    }`}
                >
                    <div className="text-gray-800 leading-relaxed font-medium mb-4 text-sm sm:text-base">
                        {address.text}
                    </div>

                    <div className="flex flex-col gap-2 text-sm text-gray-500 mb-6">
                        <div className="flex items-center gap-2">
                            <User size={16} />
                            گیرنده: {address.receiver}
                        </div>
                        <div className="flex items-center gap-2">
                            <Headphones size={16} />
                            تماس: {address.phone}
                        </div>
                    </div>
                </div>
            ))}
        </div>
    );
};

export default AddressTab;