src/features/auth/auth-layout.tsx

@@ -1,63 +1,79 @@
-import { Logo } from '@/assets/logo'
-
 type AuthLayoutProps = {
   children: React.ReactNode
 }
 
 export function AuthLayout({ children }: AuthLayoutProps) {
   return (
-    <div className='relative grid min-h-svh overflow-hidden bg-[radial-gradient(circle_at_top,_rgba(56,103,184,0.22),_transparent_38%),linear-gradient(180deg,_#07162e_0%,_#0a2347_48%,_#f4f7fb_48%,_#f4f7fb_100%)] px-6 py-10'>
-      <div className='pointer-events-none absolute inset-0 bg-[linear-gradient(135deg,transparent_0%,rgba(255,255,255,0.04)_50%,transparent_100%)]' />
-      <div className='relative mx-auto grid w-full max-w-6xl items-center gap-10 lg:grid-cols-[1.15fr_0.85fr]'>
-        <section className='hidden lg:block'>
-          <div className='max-w-xl text-white'>
-            <div className='mb-8 inline-flex items-center gap-3 rounded-full border border-white/14 bg-white/6 px-4 py-2 text-xs font-semibold tracking-[0.28em] text-white/72 uppercase backdrop-blur'>
-              <Logo className='size-5 text-[#d7b16d]' />
-              Bogazici Denizcilik Yonetim Merkezi
-            </div>
-            <h1 className='max-w-lg text-5xl leading-tight font-semibold tracking-tight'>
-              Operasyon, personel ve icerik akisini tek ekranda yonetin.
+    <div className='relative grid min-h-svh overflow-hidden bg-[#0a1e3d]'>
+      {/* Background pattern */}
+      <div className='pointer-events-none absolute inset-0 bg-[radial-gradient(ellipse_at_top_left,rgba(56,103,184,0.15),transparent_50%),radial-gradient(ellipse_at_bottom_right,rgba(30,64,120,0.1),transparent_50%)]' />
+
+      <div className='relative mx-auto flex w-full max-w-300 items-center gap-0 px-6 py-10 lg:gap-16'>
+        {/* Left - Branding */}
+        <section className='hidden flex-1 lg:block'>
+          <div className='max-w-lg'>
+            <img
+              src='/images/white-logo.svg'
+              alt='Bogazici Denizcilik'
+              className='mb-12 h-14'
+            />
+
+            <h1 className='text-[2.75rem] leading-[1.15] font-semibold tracking-tight text-white'>
+              Yonetim
+              <br />
+              Paneli
             </h1>
-            <p className='mt-6 max-w-lg text-base leading-7 text-white/72'>
-              Premium yonetim deneyimi; hizli karar alma, net yetkilendirme ve
-              kurumsal icerik kontrolu icin tasarlandi.
+
+            <div className='mt-6 h-px w-16 bg-linear-to-r from-[#3b7ddd] to-transparent' />
+
+            <p className='mt-6 max-w-sm text-[15px] leading-relaxed text-white/55'>
+              Kurs, icerik ve operasyon yonetimini tek bir merkezden kontrol
+              edin.
             </p>
-            <div className='mt-10 grid max-w-md grid-cols-3 gap-4'>
-              <div className='rounded-2xl border border-white/10 bg-white/6 p-4 backdrop-blur'>
-                <p className='text-3xl font-semibold'>24/7</p>
-                <p className='mt-2 text-sm text-white/65'>
-                  Operasyon gorunurlugu
+
+            <div className='mt-12 flex items-center gap-8'>
+              <div>
+                <p className='text-2xl font-semibold text-white'>15+</p>
+                <p className='mt-1 text-xs tracking-wide text-white/40 uppercase'>
+                  Yonetim Modulu
                 </p>
               </div>
-              <div className='rounded-2xl border border-white/10 bg-white/6 p-4 backdrop-blur'>
-                <p className='text-3xl font-semibold'>RBAC</p>
-                <p className='mt-2 text-sm text-white/65'>Rol bazli erisim</p>
+              <div className='h-8 w-px bg-white/10' />
+              <div>
+                <p className='text-2xl font-semibold text-white'>RBAC</p>
+                <p className='mt-1 text-xs tracking-wide text-white/40 uppercase'>
+                  Rol Tabanli Erisim
+                </p>
               </div>
-              <div className='rounded-2xl border border-white/10 bg-white/6 p-4 backdrop-blur'>
-                <p className='text-3xl font-semibold'>v1</p>
-                <p className='mt-2 text-sm text-white/65'>
-                  Canli API entegrasyonu
+              <div className='h-8 w-px bg-white/10' />
+              <div>
+                <p className='text-2xl font-semibold text-white'>24/7</p>
+                <p className='mt-1 text-xs tracking-wide text-white/40 uppercase'>
+                  Erisim
                 </p>
               </div>
             </div>
           </div>
         </section>
 
-        <div className='mx-auto flex w-full max-w-[520px] flex-col justify-center space-y-2'>
-          <div className='mb-5 flex items-center justify-center gap-3 text-slate-900 lg:hidden'>
-            <Logo className='size-7 text-[#1f4b87]' />
-            <div className='text-center'>
-              <p className='text-lg font-semibold tracking-tight'>
-                Bogazici Admin
-              </p>
-              <p className='text-xs tracking-[0.24em] text-slate-500 uppercase'>
-                Denizcilik Yonetim Paneli
-              </p>
+        {/* Right - Login card */}
+        <div className='mx-auto w-full max-w-110 shrink-0'>
+          {/* Mobile logo */}
+          <div className='mb-8 flex justify-center lg:hidden'>
+            <img
+              src='/images/white-logo.svg'
+              alt='Bogazici Denizcilik'
+              className='h-10'
+            />
           </div>
-          </div>
-          <div className='rounded-[28px] border border-white/70 bg-white/92 p-3 shadow-[0_32px_80px_rgba(6,22,45,0.18)] backdrop-blur sm:p-4'>
+
+          <div className='rounded-2xl border border-white/8 bg-white/4 p-8 shadow-2xl backdrop-blur-sm sm:p-10'>
             {children}
           </div>
+
+          <p className='mt-6 text-center text-xs text-white/30'>
+            Bogazici Denizcilik Egitim Kurumlari
+          </p>
         </div>
       </div>
     </div>

src/features/auth/sign-in/components/user-auth-form.tsx

@@ -86,9 +86,13 @@ export function UserAuthForm({
           name='email'
           render={({ field }) => (
             <FormItem>
-              <FormLabel>E-posta</FormLabel>
+              <FormLabel className='text-white/70'>E-posta</FormLabel>
               <FormControl>
-                <Input placeholder='yonetici@bogazici.com.tr' {...field} />
+                <Input
+                  placeholder='yonetici@bogazici.com.tr'
+                  className='border-white/10 bg-white/5 text-white placeholder:text-white/30 focus-visible:border-white/25 focus-visible:ring-0'
+                  {...field}
+                />
               </FormControl>
               <FormMessage />
             </FormItem>
@@ -99,23 +103,27 @@ export function UserAuthForm({
           name='password'
           render={({ field }) => (
             <FormItem className='relative'>
-              <FormLabel>Sifre</FormLabel>
+              <FormLabel className='text-white/70'>Sifre</FormLabel>
               <FormControl>
-                <PasswordInput placeholder='Sifrenizi girin' {...field} />
+                <PasswordInput
+                  placeholder='Sifrenizi girin'
+                  className='border-white/10 bg-white/5 text-white placeholder:text-white/30 focus-visible:border-white/25 focus-visible:ring-0'
+                  {...field}
+                />
               </FormControl>
               <FormMessage />
             </FormItem>
           )}
         />
         <Button
-          className='mt-3 h-11 rounded-xl bg-[#1f4b87] text-white hover:bg-[#183b6b]'
+          className='mt-3 h-11 rounded-xl bg-[#3b7ddd] text-white hover:bg-[#2d6bc4]'
           disabled={isLoading}
         >
           {isLoading ? <Loader2 className='animate-spin' /> : <LogIn />}
           Oturum ac
         </Button>
 
-        <div className='rounded-2xl border border-[#d8e2f0] bg-[#f6f9fc] px-4 py-3 text-sm text-[#496381]'>
+        <div className='rounded-xl border border-white/8 bg-white/5 px-4 py-3 text-xs text-white/40'>
           Eger yetki sorunu yasarsaniz sistem yoneticinizden yeni rol ve
           permission atamasi talep edin.
         </div>

src/features/auth/sign-in/index.tsx

@@ -15,24 +15,20 @@ export function SignIn() {
 
   return (
     <AuthLayout>
-      <Card className='gap-4 border-0 py-4 shadow-none'>
+      <Card className='gap-4 border-0 bg-transparent py-4 shadow-none'>
         <CardHeader className='gap-3'>
-          <div className='inline-flex w-fit items-center rounded-full bg-[#eef4fb] px-3 py-1 text-[11px] font-semibold tracking-[0.22em] text-[#3c5f90] uppercase'>
-            Guvenli Giris
-          </div>
-          <CardTitle className='text-2xl tracking-tight text-[#102948]'>
-            Yonetici girisi
+          <CardTitle className='text-2xl tracking-tight text-white'>
+            Oturum Ac
           </CardTitle>
-          <CardDescription>
-            Personel, rol ve yonetim modullerine erismek icin yetkili
-            hesabinizla oturum acin.
+          <CardDescription className='text-white/50'>
+            Yonetim paneline erismek icin hesap bilgilerinizi girin.
           </CardDescription>
         </CardHeader>
         <CardContent>
           <UserAuthForm redirectTo={redirect} />
         </CardContent>
         <CardFooter>
-          <p className='px-2 text-center text-sm text-muted-foreground'>
+          <p className='px-2 text-center text-xs text-white/30'>
             Bu panel yalnizca yetkili personel icindir. Tum islemler kayit
             altina alinabilir.
           </p>

src/routes/_authenticated/route.tsx

@@ -9,7 +9,7 @@ export const Route = createFileRoute('/_authenticated')({
       throw redirect({
         to: '/sign-in',
         search: {
-          redirect: location.href,
+          redirect: location.href === '/' ? undefined : location.href,
         },
       })
     }