Projects/front/src/components/layout/EmptyLayout.tsx

// src/components/layout/EmptyLayout.tsx
import { Outlet } from "react-router-dom";
import { motion } from "framer-motion";

export default function EmptyLayout() {
  return (
    <div className="min-h-screen bg-slate-50 dark:bg-slate-950 text-slate-900 dark:text-slate-100 flex flex-col relative overflow-hidden transition-colors duration-300">
      {/* Subtle background ambient gradients */}
      <div className="absolute top-1/4 left-1/4 -z-10 w-[500px] h-[500px] bg-indigo-500/10 blur-[120px] rounded-full mix-blend-multiply dark:mix-blend-screen pointer-events-none" />
      <div className="absolute bottom-1/4 right-1/4 -z-10 w-[500px] h-[500px] bg-rose-500/10 blur-[120px] rounded-full mix-blend-multiply dark:mix-blend-screen pointer-events-none" />
      
      <motion.div
        initial={{ opacity: 0 }}
        animate={{ opacity: 1 }}
        transition={{ duration: 0.5 }}
        className="flex-1 flex flex-col w-full h-full relative z-10"
      >
        <Outlet />
      </motion.div>
    </div>
  );
}