Fixing the layout

"> "> ">

<body className="relative">
	<footer className="absolute bottom-0 left-0 h-14">sssdsd </footer>
<body>

main div : backdrop-blur-sm shadaw-sm bg-white/75, dark:bg-slate-900 border-b, border-slate-300, dark:border-slate-700 fixed, top-0, left-0, z-60, h-20 flex, items-centre, justify-between,

sub div : container ,max-w-7xl (1280px, 80rem) ,mx-auto ,w-full , flex, items-centre, justify-between,

Some classes : ring classes disabled : opacity-50, pointer-events-none transition-color outline

<header class="main container>
	<nav class="sub container">
		<logo />
		<div class="md: hidden">
			//invisible for medium to large screens.
			<ThemeToggle />
		</div>
		<div class="hidden md:flex gap-4">
			//invisible for small screens.
			<ThemeToggle />
			<content what you want >
			{session ?( link component and <signOutButton />)  : <signInButton />}
		</div>
	</nav>
</header>