/* Copyright (C) 2024-2025 LibreWeddingPlanner contributors*/

import SideNav from '@/app/ui/dashboard/sidenav';
import Image from 'next/image';

export default function Layout({ children }: { children: React.ReactNode }) {
  return (
    <div className="flex h-screen flex-col">
      <div className="w-full lg:h-72 h-36 relative">
        <Image
          src="/header.png"
          alt="Header"
          fill
          style={{ objectFit: 'cover', objectPosition: 'center', zIndex: 0 }}
          priority
        />
      </div>
      <div className="flex-grow flex items-center justify-center lg:p-24 py-8 bg-[#e1d5c7] relative">
        <div className="absolute left-1/2 lg:top-24 top-8 z-10 -translate-x-1/2 -translate-y-1/2 flex justify-center w-full pointer-events-none w-12 h-12 lg:w-24 lg:h-24">
          <Image
            src="/stamp.png"
            alt="Stamp"
            width={120}
            height={120}
            className="object-contain"
            priority
          />
        </div>

        <div className="max-w-4xl w-full h-full bg-[#f9f9f7] shadow-lg">
            <div
              className="max-w-4xl lg:m-6 m-3 lg:px-6 px-3 lg:py-24 py-2 border-2 border-[#d3d3d1] rounded-xl text-[#958971] flex justify-center"
              style={{ height: 'calc(100% - 3rem)' }}
            >
              {children}
            </div>
        </div>
      </div>
    </div>
  );
}