import {Copyright} from "lucide-react";
import Link from "next/link";


export function Footer() {


	return (
		<footer className={"flex flex-col-reverse md:flex-row justify-between gap-2 md:gap-1 items-center p-2 border-t-2 w-full"}>
			<div className={"flex flex-row gap-1 items-center justify-center md:justify-start md:w-1/3 opacity-50"}>
				<Copyright className={"w-4"}/>
				<h4 className={"pr-2"}>Yidhra Studio</h4>
				<p>All right reserved <em>2024</em></p>
			</div>
			<div className={"flex flex-col flex-wrap md:flex-row max-h-24 md:flex-nowrap gap-1 md:gap-2 items-center justify-evenly w-full md:w-1/3"}>
				<Link href={"#"} className={"p-1 hover:-translate-y-1.5 hover:text-primary w-1/2"}>
					<h3 className={"text-nowrap text-center"}>Data privacy</h3>
				</Link>
				<Link href={"#"} className={"p-1 hover:-translate-y-1.5 hover:text-primary w-1/2"}>
					<h3 className={"text-nowrap text-center"}>Terms and conditions</h3>
				</Link>
				<Link href={"#"} className={"p-1 hover:-translate-y-1.5 hover:text-primary w-1/2"}>
					<h3 className={"text-nowrap text-center"}>Legal notice</h3>
				</Link>
				<Link href={"#"} className={"p-1 hover:-translate-y-1.5 hover:text-primary w-1/2"}>
					<h3 className={"text-nowrap text-center"}>Support Center</h3>
				</Link>
			</div>
			<div className={"flex flex-row gap-1 items-center justify-center md:justify-end md:w-1/3"}>
			</div>
		</footer>
	)
}