change login-page design

src/views/login/index.vue

@@ -1,12 +1,11 @@
 <template>
   <div class="login-page-root">
-    <!-- Desktop: premium split-panel -->
-    <DesktopAuthShell v-show="isDesktop">
+    <DesktopAuthShell>
       <div class="dauth-card">
         <header v-if="!loginPage.enterType" class="dauth-card__header">
           <p class="dauth-card__eyebrow">حساب کاربری</p>
           <h2 class="dauth-card__title">ورود</h2>
-          <p class="dauth-card__subtitle">برای ادامه، روش ورود خود را انتخاب کنید</p>
+          <p class="dauth-card__subtitle">برای ادامه، رمز ورود خود را انتخاب کنید.</p>
         </header>
         <header v-else class="dauth-card__header">
           <p class="dauth-card__eyebrow">حساب جدید</p>
@@ -14,53 +13,101 @@
           <p class="dauth-card__subtitle">اطلاعات خود را برای ایجاد حساب وارد کنید</p>
         </header>
 
-        <Login v-if="!loginPage.enterType" variant="desktop" @register="loginPage.setEnterType" />
-        <Register v-else variant="desktop" @register="loginPage.setEnterType" />
+        <Login
+          v-if="!loginPage.enterType"
+          variant="desktop"
+          @register="loginPage.setEnterType"
+        />
+        <Register
+          v-else
+          variant="desktop"
+          @register="loginPage.setEnterType"
+        />
       </div>
     </DesktopAuthShell>
-
-    <!-- Mobile: original layout -->
-    <div v-show="!isDesktop" class="login-page flex flex-col items-center">
-      <div class="login-page__content z-1000 w-full p-5">
-        <Login v-if="!loginPage.enterType" @register="loginPage.setEnterType" />
-        <Register v-else @register="loginPage.setEnterType" />
-      </div>
-    </div>
   </div>
 </template>
 
 <script lang="ts" setup>
+import { onMounted, onUnmounted } from 'vue'
 import { useLoginPage } from './composables/useLoginPage'
-import { useDesktopBreakpoint } from '@/layouts/composables/useAppLayout'
 import Login from './components/Login.vue'
 import Register from './components/Register.vue'
 import DesktopAuthShell from './desktop/components/DesktopAuthShell.vue'
 
-const isDesktop = useDesktopBreakpoint()
 const loginPage = useLoginPage()
+
+onMounted(() => {
+  document.documentElement.classList.add('login-page-active')
+})
+
+onUnmounted(() => {
+  document.documentElement.classList.remove('login-page-active')
+})
 </script>
 
 <style scoped>
 .login-page-root {
   width: 100%;
-  height: 100%;
-  max-height: 100dvh;
-  overflow: hidden;
-}
-
-.login-page {
-  height: 100%;
-  max-height: calc(100dvh - var(--app-credit-footer-offset, 28px));
+  min-height: 100vh;
+  min-height: 100dvh;
   overflow-x: hidden;
   overflow-y: auto;
-  overscroll-behavior: contain;
-  -webkit-overflow-scrolling: touch;
-}
-
-.login-page__content {
-  flex: 1;
   display: flex;
-  align-items: center;
-  justify-content: center;
+  flex-direction: column;
+}
+</style>
+
+<style lang="less">
+/* موبایل لاگین: تمام‌عرض — بدون فریم ۴۲۶ و حاشیه سفید دوطرف */
+@media screen and (max-width: 767.98px) {
+  html.login-page-active {
+    body {
+      display: block !important;
+      justify-content: unset !important;
+      background: #0b192e !important;
+    }
+
+    #app {
+      display: block !important;
+      width: 100% !important;
+      max-width: none !important;
+      background: #0b192e !important;
+    }
+
+    .desktopConfig,
+    .app-main,
+    .login-page-root,
+    .dauth,
+    .dauth--boursecu {
+      width: 100% !important;
+      max-width: none !important;
+      margin: 0 !important;
+      left: auto !important;
+      right: auto !important;
+      transform: none !important;
+    }
+
+    .desktopConfig,
+    .app-main,
+    .login-page-root {
+      min-height: 100dvh !important;
+      height: auto !important;
+      max-height: none !important;
+      overflow-x: hidden !important;
+      overflow-y: auto !important;
+      background: #0b192e !important;
+    }
+
+    .dauth--boursecu {
+      flex: 1 1 auto;
+      min-height: 100dvh !important;
+    }
+
+    .app-credit-footer--mobile,
+    .app-credit-footer--login {
+      display: none !important;
+    }
+  }
 }
 </style>