import { Logo } from '@/components/Logo';
/** Giriş / kayıt: örnek parselin uydu görüntüsü üzerinde düz beyaz form paneli. */
export default function L({ children }: { children: React.ReactNode }) {
  return (
    <div className="relative min-h-[100svh] bg-ink md:flex md:items-center md:p-6" style={{ backgroundImage: 'url(/kareler/gokova-z18.jpg)', backgroundSize: 'cover', backgroundPosition: '60% 50%' }}>
      <div className="h-[22svh] md:hidden" />
      <div className="relative w-full bg-white md:w-[440px]">
        <div className="border-b border-ink/15 px-5 py-3"><Logo sub /></div>
        <div className="px-5 py-6 md:px-7 md:py-8">{children}</div>
      </div>
      <svg className="pointer-events-none absolute hidden md:block" style={{ left: 'calc(50% + 160px)', top: 'calc(50% - 60px)' }} width="80" height="130" viewBox="0 0 80 130" aria-hidden>
        <polygon points="58,6 30,0 13,54 0,96 28,105 43,61" fill="rgba(255,106,31,.22)" stroke="#FF6A1F" strokeWidth="3" />
      </svg>
      <span className="absolute bottom-3 right-3 hidden bg-ink px-2 py-1 text-[12px] font-semibold text-white md:block">Gökova 101 ada 5 parsel · 684 m²</span>
    </div>
  );
}