From eb1c8b682953c8d05f89f75005034d6b88ccc58a Mon Sep 17 00:00:00 2001
From: Nabil Bouzine <nabilsocialnetwork@gmail.com>
Date: Tue, 9 Sep 2025 19:48:08 +0100
Subject: [PATCH 1/3] feature: implement empty state for watch history

---
 .../watchhistory/WatchHistoryAdapter.kt       |  2 +
 .../watchhistory/WatchHistoryFragment.kt      |  6 +-
 .../watchhistory/WatchHistoryUIEvent.kt       |  2 +
 .../watchhistory/WatchHistoryViewModel.kt     |  3 +
 app/src/main/res/drawable/ic_history.xml      | 39 ---------
 .../main/res/drawable/ic_history_colored.xml  |  7 ++
 .../res/drawable/icon_circle_background.xml   |  6 ++
 .../drawable/squircle_button_background.xml   | 19 +++++
 .../main/res/layout/empty_history_item.xml    | 81 +++++++++++++++++++
 app/src/main/res/layout/fragment_search.xml   |  2 +-
 .../res/layout/fragment_watch_history.xml     |  6 +-
 .../main/res/navigation/movie_navigation.xml  |  6 +-
 app/src/main/res/values/strings.xml           |  5 +-
 13 files changed, 138 insertions(+), 46 deletions(-)
 delete mode 100644 app/src/main/res/drawable/ic_history.xml
 create mode 100644 app/src/main/res/drawable/ic_history_colored.xml
 create mode 100644 app/src/main/res/drawable/icon_circle_background.xml
 create mode 100644 app/src/main/res/drawable/squircle_button_background.xml
 create mode 100644 app/src/main/res/layout/empty_history_item.xml

diff --git a/app/src/main/java/com/karrar/movieapp/ui/profile/watchhistory/WatchHistoryAdapter.kt b/app/src/main/java/com/karrar/movieapp/ui/profile/watchhistory/WatchHistoryAdapter.kt
index 4c69f4662..e3bd0ed3c 100644
--- a/app/src/main/java/com/karrar/movieapp/ui/profile/watchhistory/WatchHistoryAdapter.kt
+++ b/app/src/main/java/com/karrar/movieapp/ui/profile/watchhistory/WatchHistoryAdapter.kt
@@ -13,4 +13,6 @@ class WatchHistoryAdapter(
 
 interface WatchHistoryInteractionListener : BaseInteractionListener {
     fun onClickMovie(item: MediaHistoryUiState)
+
+    fun onClickExplore()
 }
\ No newline at end of file
diff --git a/app/src/main/java/com/karrar/movieapp/ui/profile/watchhistory/WatchHistoryFragment.kt b/app/src/main/java/com/karrar/movieapp/ui/profile/watchhistory/WatchHistoryFragment.kt
index fa334ca20..b05e7289e 100644
--- a/app/src/main/java/com/karrar/movieapp/ui/profile/watchhistory/WatchHistoryFragment.kt
+++ b/app/src/main/java/com/karrar/movieapp/ui/profile/watchhistory/WatchHistoryFragment.kt
@@ -35,13 +35,17 @@ class WatchHistoryFragment : BaseFragment<FragmentWatchHistoryBinding>() {
                     event.movieID
                 )
             }
+
             is WatchHistoryUIEvent.TVShowEvent -> {
                 WatchHistoryFragmentDirections.actionWatchHistoryFragmentToTvShowDetailsFragment(
                     event.tvShowID
                 )
             }
+
+            is WatchHistoryUIEvent.NavigateExploreEvent -> {
+                WatchHistoryFragmentDirections.actionWatchHistoryFragmentToExploringFragment()
+            }
         }
         findNavController().navigate(action)
     }
-
 }
\ No newline at end of file
diff --git a/app/src/main/java/com/karrar/movieapp/ui/profile/watchhistory/WatchHistoryUIEvent.kt b/app/src/main/java/com/karrar/movieapp/ui/profile/watchhistory/WatchHistoryUIEvent.kt
index 0ad5bebaa..c1bd64c2c 100644
--- a/app/src/main/java/com/karrar/movieapp/ui/profile/watchhistory/WatchHistoryUIEvent.kt
+++ b/app/src/main/java/com/karrar/movieapp/ui/profile/watchhistory/WatchHistoryUIEvent.kt
@@ -3,4 +3,6 @@ package com.karrar.movieapp.ui.profile.watchhistory
 sealed interface WatchHistoryUIEvent {
     data class MovieEvent(val movieID: Int) : WatchHistoryUIEvent
     data class TVShowEvent(val tvShowID: Int) : WatchHistoryUIEvent
+
+    class NavigateExploreEvent(): WatchHistoryUIEvent
 }
\ No newline at end of file
diff --git a/app/src/main/java/com/karrar/movieapp/ui/profile/watchhistory/WatchHistoryViewModel.kt b/app/src/main/java/com/karrar/movieapp/ui/profile/watchhistory/WatchHistoryViewModel.kt
index 19ea5885d..2a8af4218 100644
--- a/app/src/main/java/com/karrar/movieapp/ui/profile/watchhistory/WatchHistoryViewModel.kt
+++ b/app/src/main/java/com/karrar/movieapp/ui/profile/watchhistory/WatchHistoryViewModel.kt
@@ -53,4 +53,7 @@ class WatchHistoryViewModel @Inject constructor(
         }
     }
 
+    override fun onClickExplore() {
+        _watchHistoryUIEvent.update { Event(WatchHistoryUIEvent.NavigateExploreEvent()) }
+    }
 }
\ No newline at end of file
diff --git a/app/src/main/res/drawable/ic_history.xml b/app/src/main/res/drawable/ic_history.xml
deleted file mode 100644
index 97d52adca..000000000
--- a/app/src/main/res/drawable/ic_history.xml
+++ /dev/null
@@ -1,39 +0,0 @@
-<vector xmlns:android="http://schemas.android.com/apk/res/android"
-    android:width="24dp"
-    android:height="24dp"
-    android:tint="@color/shade_primary"
-    android:viewportWidth="24"
-    android:viewportHeight="24">
-  <path
-      android:pathData="M12,7.5V12"
-      android:strokeAlpha="0.87"
-      android:strokeLineJoin="round"
-      android:strokeWidth="2"
-      android:fillColor="#00000000"
-      android:strokeColor="#ffffff"
-      android:strokeLineCap="round"/>
-  <path
-      android:pathData="M15.9,14.25L12,12"
-      android:strokeAlpha="0.87"
-      android:strokeLineJoin="round"
-      android:strokeWidth="2"
-      android:fillColor="#00000000"
-      android:strokeColor="#ffffff"
-      android:strokeLineCap="round"/>
-  <path
-      android:pathData="M6.731,9.347H2.981V5.597"
-      android:strokeAlpha="0.87"
-      android:strokeLineJoin="round"
-      android:strokeWidth="2"
-      android:fillColor="#00000000"
-      android:strokeColor="#ffffff"
-      android:strokeLineCap="round"/>
-  <path
-      android:pathData="M6.169,17.831C7.322,18.986 8.792,19.772 10.393,20.091C11.993,20.41 13.653,20.247 15.16,19.623C16.668,18.998 17.957,17.941 18.864,16.584C19.771,15.227 20.255,13.632 20.255,12C20.255,10.368 19.771,8.773 18.864,7.416C17.957,6.059 16.668,5.002 15.16,4.377C13.653,3.753 11.993,3.59 10.393,3.909C8.792,4.228 7.322,5.014 6.169,6.169L2.981,9.347"
-      android:strokeAlpha="0.87"
-      android:strokeLineJoin="round"
-      android:strokeWidth="2"
-      android:fillColor="#00000000"
-      android:strokeColor="#ffffff"
-      android:strokeLineCap="round"/>
-</vector>
diff --git a/app/src/main/res/drawable/ic_history_colored.xml b/app/src/main/res/drawable/ic_history_colored.xml
new file mode 100644
index 000000000..5d996c9dd
--- /dev/null
+++ b/app/src/main/res/drawable/ic_history_colored.xml
@@ -0,0 +1,7 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android" android:autoMirrored="true" android:height="28dp" android:viewportHeight="28" android:viewportWidth="28" android:width="28dp">
+      
+    <path android:fillColor="#536DFE" android:fillType="evenOdd" android:pathData="M5.925,5.914C10.353,1.492 17.551,1.539 22.006,5.994C26.463,10.451 26.508,17.653 22.081,22.081C17.653,26.508 10.451,26.463 5.994,22.006C3.353,19.365 2.262,15.762 2.731,12.345C2.796,11.866 3.238,11.531 3.716,11.597C4.195,11.662 4.53,12.104 4.464,12.582C4.068,15.476 4.991,18.528 7.232,20.768C11.017,24.554 17.111,24.575 20.843,20.843C24.576,17.111 24.554,11.017 20.769,7.232C16.985,3.448 10.896,3.425 7.163,7.151L8.035,7.156C8.518,7.158 8.908,7.552 8.906,8.035C8.903,8.518 8.509,8.908 8.026,8.906L5.056,8.891C4.577,8.888 4.188,8.5 4.186,8.02L4.171,5.05C4.168,4.567 4.558,4.173 5.042,4.171C5.525,4.168 5.918,4.558 5.921,5.041L5.925,5.914Z"/>
+      
+    <path android:fillAlpha="0.5" android:fillColor="#536DFE" android:pathData="M14,8.458C14.483,8.458 14.875,8.85 14.875,9.333V13.638L17.535,16.298C17.877,16.64 17.877,17.194 17.535,17.535C17.194,17.877 16.64,17.877 16.298,17.535L13.467,14.704C13.248,14.486 13.125,14.189 13.125,13.879V9.333C13.125,8.85 13.517,8.458 14,8.458Z" android:strokeAlpha="0.5"/>
+    
+</vector>
diff --git a/app/src/main/res/drawable/icon_circle_background.xml b/app/src/main/res/drawable/icon_circle_background.xml
new file mode 100644
index 000000000..1e9829ba0
--- /dev/null
+++ b/app/src/main/res/drawable/icon_circle_background.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android"
+    android:shape="oval">
+
+    <solid android:color="@color/brand_tertiary" />
+</shape>
\ No newline at end of file
diff --git a/app/src/main/res/drawable/squircle_button_background.xml b/app/src/main/res/drawable/squircle_button_background.xml
new file mode 100644
index 000000000..9a8d9a0fc
--- /dev/null
+++ b/app/src/main/res/drawable/squircle_button_background.xml
@@ -0,0 +1,19 @@
+<?xml version="1.0" encoding="utf-8"?>
+<ripple xmlns:android="http://schemas.android.com/apk/res/android"
+    android:color="?attr/colorControlHighlight">
+
+    <item>
+        <vector
+            android:width="240dp"
+            android:height="40dp"
+            android:viewportWidth="240"
+            android:viewportHeight="40">
+
+            <path
+                android:fillColor="@color/button_primary"
+                android:pathData="M0,20 C0,4 4,0 20,0 L220,0 C236,0 240,4 240,20 C240,36 236,40 220,40 L20,40 C4,40 0,36 0,20 Z" />
+
+        </vector>
+    </item>
+
+</ripple>
diff --git a/app/src/main/res/layout/empty_history_item.xml b/app/src/main/res/layout/empty_history_item.xml
new file mode 100644
index 000000000..0ca0283e2
--- /dev/null
+++ b/app/src/main/res/layout/empty_history_item.xml
@@ -0,0 +1,81 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto">
+
+    <data>
+
+        <variable
+            name="viewModel"
+            type="com.karrar.movieapp.ui.base.BaseViewModel" />
+
+        <variable
+            name="listener"
+            type="com.karrar.movieapp.ui.profile.watchhistory.WatchHistoryInteractionListener" />
+    </data>
+
+    <androidx.constraintlayout.widget.ConstraintLayout
+        android:layout_width="match_parent"
+        android:layout_height="match_parent">
+
+        <ImageView
+            android:id="@+id/no_data"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:background="@drawable/icon_circle_background"
+            android:contentDescription="@string/no_history_yet"
+            android:padding="18dp"
+            android:src="@drawable/ic_history_colored"
+            app:layout_constraintBottom_toTopOf="@+id/title"
+            app:layout_constraintEnd_toEndOf="@+id/title"
+            app:layout_constraintStart_toStartOf="@+id/title"
+            app:layout_constraintTop_toTopOf="parent"
+            app:layout_constraintVertical_chainStyle="packed"
+            app:tint="@color/brand_primary" />
+
+        <TextView
+            android:id="@+id/title"
+            style="@style/Medium.TextTitleSM"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_marginTop="@dimen/spacing_medium"
+            android:text="@string/no_history_yet"
+            android:textColor="@color/shade_primary"
+            app:layout_constraintBottom_toTopOf="@+id/empty_description"
+            app:layout_constraintEnd_toEndOf="@+id/empty_description"
+            app:layout_constraintStart_toStartOf="@+id/empty_description"
+            app:layout_constraintTop_toBottomOf="@+id/no_data" />
+
+        <TextView
+            android:id="@+id/empty_description"
+            style="@style/Medium.TextBodySM"
+            android:layout_width="240dp"
+            android:layout_height="wrap_content"
+            android:layout_marginTop="@dimen/spacing_small"
+            android:gravity="center"
+            android:text="@string/no_history_description"
+            android:textColor="@color/shade_secondary"
+            app:layout_constraintBottom_toTopOf="@+id/button_action"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toBottomOf="@+id/title" />
+
+        <Button
+            android:id="@+id/button_action"
+            style="@style/Medium.TextBodySM"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_marginTop="@dimen/spacing_large"
+            android:background="@drawable/squircle_button_background"
+            android:includeFontPadding="false"
+            android:onClick="@{() -> listener.onClickExplore()}"
+            android:paddingHorizontal="16dp"
+            android:text="@string/watch_something"
+            android:textAllCaps="false"
+            android:textColor="@color/button_on_primary"
+            app:layout_constraintBottom_toBottomOf="parent"
+            app:layout_constraintEnd_toEndOf="@+id/empty_description"
+            app:layout_constraintStart_toStartOf="@+id/empty_description"
+            app:layout_constraintTop_toBottomOf="@+id/empty_description" />
+
+    </androidx.constraintlayout.widget.ConstraintLayout>
+</layout>
diff --git a/app/src/main/res/layout/fragment_search.xml b/app/src/main/res/layout/fragment_search.xml
index 20a4e770c..414aa4857 100644
--- a/app/src/main/res/layout/fragment_search.xml
+++ b/app/src/main/res/layout/fragment_search.xml
@@ -128,7 +128,7 @@
             android:gravity="center"
             android:text="@string/history_label"
             android:textColor="@color/shade_primary"
-            app:drawableStartCompat="@drawable/ic_history"
+            app:drawableStartCompat="@drawable/ic_history_due_tone"
             app:hideWhenListIsEmpty="@{viewModel.uiState.searchHistory}"
             app:hideWhenSearch="@{viewModel.uiState.searchInput}"
             app:layout_constraintStart_toStartOf="@id/imagw_back_arrow"
diff --git a/app/src/main/res/layout/fragment_watch_history.xml b/app/src/main/res/layout/fragment_watch_history.xml
index 7df53d3a4..62505c338 100644
--- a/app/src/main/res/layout/fragment_watch_history.xml
+++ b/app/src/main/res/layout/fragment_watch_history.xml
@@ -29,16 +29,16 @@
             app:layout_constraintTop_toTopOf="parent"
             tools:listitem="@layout/item_watch_history" />
 
-        <TextView
-            style="@style/SemiBold.Medium"
+        <include
+            layout="@layout/empty_history_item"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:text="@string/this_list_has_no_movies"
             android:visibility="gone"
             app:layout_constraintBottom_toBottomOf="parent"
             app:layout_constraintEnd_toEndOf="parent"
             app:layout_constraintStart_toStartOf="parent"
             app:layout_constraintTop_toTopOf="parent"
+            app:listener="@{viewModel}"
             app:showWhenListEmpty="@{viewModel.uiState.allMedia}" />
 
     </androidx.constraintlayout.widget.ConstraintLayout>
diff --git a/app/src/main/res/navigation/movie_navigation.xml b/app/src/main/res/navigation/movie_navigation.xml
index d0bde216d..e4b367e75 100644
--- a/app/src/main/res/navigation/movie_navigation.xml
+++ b/app/src/main/res/navigation/movie_navigation.xml
@@ -253,7 +253,11 @@
     <fragment
         android:id="@+id/watchHistoryFragment"
         android:name="com.karrar.movieapp.ui.profile.watchhistory.WatchHistoryFragment"
-        tools:layout="@layout/fragment_watch_history">
+        tools:layout="@layout/empty_history_item">
+        <action
+            android:id="@+id/action_watchHistoryFragment_to_exploringFragment"
+            app:destination="@id/exploringFragment"
+            />
         <action
             android:id="@+id/action_watchHistoryFragment_to_movieDetailFragment"
             app:destination="@id/movieDetailFragment" />
diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml
index f6f19e245..a6b6cb98f 100644
--- a/app/src/main/res/values/strings.xml
+++ b/app/src/main/res/values/strings.xml
@@ -66,7 +66,7 @@
     <string name="submit_toast">Submitted, Thank you for your feedback</string>
     <string name="total_episodes">%1$s Episodes</string>
     <string name="m">%1$s m</string>
-    <string name="watch_history">Watch History</string>
+    <string name="watch_history">History</string>
     <string name="rated_movies">My Ratings</string>
     <string name="sign_out">Sign Out</string>
     <string name="at">\@</string>
@@ -102,4 +102,7 @@
     <string name="this_list_has_no_lists">No lists found</string>
     <string name="episode_title">%1$d. %2$s</string>
     <string name="season_number">(%1$s Seasons)</string>
+    <string name="no_history_yet">No History Yet</string>
+    <string name="no_history_description">It’s quiet in here… Start watching and we’ll keep track for you.</string>
+    <string name="watch_something">Find Something to Watch</string>
 </resources>
\ No newline at end of file

From 4a9a083e3191b0ca51755a39fcc2e3a0edb0a5c7 Mon Sep 17 00:00:00 2001
From: AimanYosofi <AimanYosofiUlt@gmail.com>
Date: Wed, 10 Sep 2025 10:07:32 +0300
Subject: [PATCH 2/3] add button style

---
 .../main/res/layout/empty_history_item.xml    |  7 +--
 app/src/main/res/values/styles.xml            | 43 +++++++++++++++----
 2 files changed, 37 insertions(+), 13 deletions(-)

diff --git a/app/src/main/res/layout/empty_history_item.xml b/app/src/main/res/layout/empty_history_item.xml
index 0ca0283e2..30a25e687 100644
--- a/app/src/main/res/layout/empty_history_item.xml
+++ b/app/src/main/res/layout/empty_history_item.xml
@@ -61,17 +61,14 @@
 
         <Button
             android:id="@+id/button_action"
-            style="@style/Medium.TextBodySM"
+            style="@style/SquircleButton.Medium"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:layout_marginTop="@dimen/spacing_large"
-            android:background="@drawable/squircle_button_background"
-            android:includeFontPadding="false"
             android:onClick="@{() -> listener.onClickExplore()}"
             android:paddingHorizontal="16dp"
             android:text="@string/watch_something"
-            android:textAllCaps="false"
-            android:textColor="@color/button_on_primary"
+            android:textSize="@dimen/text_size_body_sm"
             app:layout_constraintBottom_toBottomOf="parent"
             app:layout_constraintEnd_toEndOf="@+id/empty_description"
             app:layout_constraintStart_toStartOf="@+id/empty_description"
diff --git a/app/src/main/res/values/styles.xml b/app/src/main/res/values/styles.xml
index c101229e6..8a4bbb174 100644
--- a/app/src/main/res/values/styles.xml
+++ b/app/src/main/res/values/styles.xml
@@ -44,33 +44,33 @@
     </style>
 
     <style name="Medium.TextTitleSM">
-        <item name="android:textSize">@dimen/text_size_title_sm</item> 
+        <item name="android:textSize">@dimen/text_size_title_sm</item>
     </style>
 
     <!-- Body LG -->
     <style name="Regular.TextBodyLG">
-        <item name="android:textSize">@dimen/text_size_body_lg</item> 
+        <item name="android:textSize">@dimen/text_size_body_lg</item>
     </style>
 
     <style name="Medium.TextBodyLG">
-        <item name="android:textSize">@dimen/text_size_body_lg</item> 
+        <item name="android:textSize">@dimen/text_size_body_lg</item>
     </style>
 
     <style name="SemiBold.TextBodyLG">
-        <item name="android:textSize">@dimen/text_size_body_lg</item> 
+        <item name="android:textSize">@dimen/text_size_body_lg</item>
     </style>
 
     <!-- Body MD -->
     <style name="Regular.TextBodyMD">
-        <item name="android:textSize">@dimen/text_size_body_md</item> 
+        <item name="android:textSize">@dimen/text_size_body_md</item>
     </style>
 
     <style name="Medium.TextBodyMD">
-        <item name="android:textSize">@dimen/text_size_body_md</item> 
+        <item name="android:textSize">@dimen/text_size_body_md</item>
     </style>
 
     <style name="SemiBold.TextBodyMD">
-        <item name="android:textSize">@dimen/text_size_body_md</item> 
+        <item name="android:textSize">@dimen/text_size_body_md</item>
     </style>
 
     <!-- Body SM -->
@@ -96,8 +96,35 @@
     </style>
 
     <style name="SemiBold.TextLabelMD">
-        <item name="android:textSize">@dimen/text_size_label_md</item> 
+        <item name="android:textSize">@dimen/text_size_label_md</item>
+    </style>
+
+
+    <style name="SquircleButton" parent="Widget.AppCompat.Button">
+        <item name="android:background">@drawable/squircle_button_background</item>
+        <item name="android:textColor">@color/button_on_primary</item>
+        <item name="android:includeFontPadding">false</item>
+        <item name="android:textAllCaps">false</item>
+    </style>
+
+    <style name="SquircleButton.Regular">
+        <item name="android:fontFamily">@font/manrope_regular</item>
+        <item name="android:textSize">@dimen/text_size_label_md</item>
     </style>
 
+    <style name="SquircleButton.Medium">
+        <item name="android:fontFamily">@font/manrope_medium</item>
+        <item name="android:textSize">@dimen/text_size_label_md</item>
+    </style>
+
+    <style name="SquircleButton.SemiBold">
+        <item name="android:fontFamily">@font/manrope_semi_bold</item>
+        <item name="android:textSize">@dimen/text_size_label_md</item>
+    </style>
+
+    <style name="SquircleButton.Bold">
+        <item name="android:fontFamily">@font/manrope_bold</item>
+        <item name="android:textSize">@dimen/text_size_label_md</item>
+    </style>
 
 </resources>
\ No newline at end of file

From 41d62ab746deee96ea7a48a6a71e78e53e8b7fd8 Mon Sep 17 00:00:00 2001
From: AimanYosofi <AimanYosofiUlt@gmail.com>
Date: Tue, 16 Sep 2025 18:55:48 +0300
Subject: [PATCH 3/3] implement login screen

---
 app/build.gradle                              |   1 +
 .../karrar/movieapp/ui/login/LoginFragment.kt |   7 +
 .../karrar/movieapp/ui/login/LoginUIEvent.kt  |   1 +
 .../movieapp/ui/login/LoginViewModel.kt       |   4 +
 .../movieapp/utilities/view/MovieEditText.kt  | 116 +++++++++++++++
 app/src/main/res/drawable/cineverse_logo.xml  |  61 ++++++++
 app/src/main/res/drawable/click_ripple.xml    |   3 +
 app/src/main/res/drawable/eye_closed.xml      |  10 ++
 app/src/main/res/drawable/eye_opened.xml      |  14 ++
 app/src/main/res/drawable/lock.xml            |   9 ++
 app/src/main/res/drawable/password_eye.xml    |  26 ++++
 .../squircle_button_background_secondary.xml  |  19 +++
 .../main/res/drawable/squircle_text_field.xml |  14 ++
 app/src/main/res/drawable/user.xml            |  14 ++
 app/src/main/res/layout/fragment_login.xml    | 140 ++++++++++--------
 app/src/main/res/layout/view_edit_text.xml    |  45 ++++++
 app/src/main/res/values/attr.xml              |   7 +
 app/src/main/res/values/ids.xml               |   4 +
 app/src/main/res/values/strings.xml           |   5 +
 app/src/main/res/values/styles.xml            |   7 +
 20 files changed, 446 insertions(+), 61 deletions(-)
 create mode 100644 app/src/main/java/com/karrar/movieapp/utilities/view/MovieEditText.kt
 create mode 100644 app/src/main/res/drawable/cineverse_logo.xml
 create mode 100644 app/src/main/res/drawable/click_ripple.xml
 create mode 100644 app/src/main/res/drawable/eye_closed.xml
 create mode 100644 app/src/main/res/drawable/eye_opened.xml
 create mode 100644 app/src/main/res/drawable/lock.xml
 create mode 100644 app/src/main/res/drawable/password_eye.xml
 create mode 100644 app/src/main/res/drawable/squircle_button_background_secondary.xml
 create mode 100644 app/src/main/res/drawable/squircle_text_field.xml
 create mode 100644 app/src/main/res/drawable/user.xml
 create mode 100644 app/src/main/res/layout/view_edit_text.xml
 create mode 100644 app/src/main/res/values/attr.xml
 create mode 100644 app/src/main/res/values/ids.xml

diff --git a/app/build.gradle b/app/build.gradle
index 33436acd9..6f9aa5e77 100644
--- a/app/build.gradle
+++ b/app/build.gradle
@@ -22,6 +22,7 @@ android {
         buildConfigField "String", "BASE_URL", "\"https://api.themoviedb.org/3/\""
         buildConfigField "String", "IMAGE_BASE_PATH", "\"https://image.tmdb.org/t/p/w500\""
         buildConfigField "String", "TMDB_SIGNUP_URL", "\"https://www.themoviedb.org/signup\""
+        buildConfigField "String", "TMDB_FORGET_PASSWORD_URL", "\"https://www.themoviedb.org/reset-password\""
         testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
     }
 
diff --git a/app/src/main/java/com/karrar/movieapp/ui/login/LoginFragment.kt b/app/src/main/java/com/karrar/movieapp/ui/login/LoginFragment.kt
index 3c29078db..31ccb7970 100644
--- a/app/src/main/java/com/karrar/movieapp/ui/login/LoginFragment.kt
+++ b/app/src/main/java/com/karrar/movieapp/ui/login/LoginFragment.kt
@@ -30,11 +30,18 @@ class LoginFragment : BaseFragment<FragmentLoginBinding>() {
             is LoginUIEvent.LoginEvent -> {
                 findNavController().navigate(LoginFragmentDirections.actionLoginFragmentToProfileFragment())
             }
+
             LoginUIEvent.SignUpEvent -> {
                 val browserIntent =
                     Intent(Intent.ACTION_VIEW, Uri.parse(BuildConfig.TMDB_SIGNUP_URL))
                 startActivity(browserIntent)
             }
+
+            LoginUIEvent.ForgetPasswordEvent -> {
+                val browserIntent =
+                    Intent(Intent.ACTION_VIEW, Uri.parse(BuildConfig.TMDB_FORGET_PASSWORD_URL))
+                startActivity(browserIntent)
+            }
         }
     }
 }
\ No newline at end of file
diff --git a/app/src/main/java/com/karrar/movieapp/ui/login/LoginUIEvent.kt b/app/src/main/java/com/karrar/movieapp/ui/login/LoginUIEvent.kt
index 03214465e..09efcc9d4 100644
--- a/app/src/main/java/com/karrar/movieapp/ui/login/LoginUIEvent.kt
+++ b/app/src/main/java/com/karrar/movieapp/ui/login/LoginUIEvent.kt
@@ -3,4 +3,5 @@ package com.karrar.movieapp.ui.login
 sealed interface LoginUIEvent {
     data class LoginEvent(val login: Int) : LoginUIEvent
     object SignUpEvent : LoginUIEvent
+    object ForgetPasswordEvent : LoginUIEvent
 }
\ No newline at end of file
diff --git a/app/src/main/java/com/karrar/movieapp/ui/login/LoginViewModel.kt b/app/src/main/java/com/karrar/movieapp/ui/login/LoginViewModel.kt
index 33a6887ee..66046f1fd 100644
--- a/app/src/main/java/com/karrar/movieapp/ui/login/LoginViewModel.kt
+++ b/app/src/main/java/com/karrar/movieapp/ui/login/LoginViewModel.kt
@@ -40,6 +40,10 @@ class LoginViewModel @Inject constructor(
         login()
     }
 
+    fun onForgetPassword() {
+        _loginEvent.update { Event(LoginUIEvent.SignUpEvent) }
+    }
+
     fun onUserNameInputChange(text: CharSequence) {
         val userNameFieldState = validateFiledUseCase(text.toString())
         _loginUIState.update {
diff --git a/app/src/main/java/com/karrar/movieapp/utilities/view/MovieEditText.kt b/app/src/main/java/com/karrar/movieapp/utilities/view/MovieEditText.kt
new file mode 100644
index 000000000..b14b3f97d
--- /dev/null
+++ b/app/src/main/java/com/karrar/movieapp/utilities/view/MovieEditText.kt
@@ -0,0 +1,116 @@
+package com.karrar.movieapp.utilities.view
+
+import android.content.Context
+import android.text.Editable
+import android.text.TextUtils
+import android.text.TextWatcher
+import android.text.method.PasswordTransformationMethod
+import android.util.AttributeSet
+import android.view.View
+import android.widget.EditText
+import android.widget.FrameLayout
+import android.widget.ImageView
+import android.widget.TextView
+import androidx.core.content.ContextCompat
+import androidx.databinding.BindingAdapter
+import androidx.databinding.adapters.ListenerUtil
+import com.karrar.movieapp.R
+
+class MovieEditText @JvmOverloads constructor(
+    context: Context,
+    attrs: AttributeSet? = null,
+    defStyleAttr: Int = 0
+) : FrameLayout(context, attrs, defStyleAttr) {
+
+    private val editText: EditText
+    private val helperText: TextView
+    private val passwordEye: ImageView
+
+    private var isEyeShow = true
+
+    init {
+        inflate(context, R.layout.view_edit_text, this)
+        editText = findViewById(R.id.innerEditText)
+        helperText = findViewById(R.id.helperText)
+        passwordEye = findViewById(R.id.passwordEye)
+
+        val typedArray = context.obtainStyledAttributes(attrs, R.styleable.MovieEditText)
+        val helperTextValue = typedArray.getString(R.styleable.MovieEditText_helperText)
+        val showEye = typedArray.getBoolean(R.styleable.MovieEditText_showEye, false)
+        helperText.text = helperTextValue
+        passwordEye.visibility = if (showEye) VISIBLE else GONE
+
+        typedArray.recycle()
+
+        passwordEye.setOnClickListener {
+            val selection = editText.selectionStart
+            isEyeShow = !isEyeShow
+            passwordEye.setImageDrawable(
+                if (isEyeShow)
+                    ContextCompat.getDrawable(getContext(), R.drawable.eye_opened)
+                else
+                    ContextCompat.getDrawable(getContext(), R.drawable.eye_closed)
+            )
+
+            if (isEyeShow)
+                editText.transformationMethod = null
+            else
+                editText.transformationMethod = PasswordTransformationMethod()
+
+            editText.setSelection(selection)
+        }
+    }
+
+    fun getText(): String = editText.text.toString()
+
+    fun setText(value: String) {
+        editText.setText(value)
+    }
+
+    fun setHelperText(value: String?) {
+        helperText.text = value
+
+        if (value != null && TextUtils.isEmpty(value.trim())) {
+            helperText.visibility = GONE
+        } else {
+            helperText.visibility = VISIBLE
+        }
+    }
+
+    companion object {
+        @JvmStatic
+        @BindingAdapter("afterTextChanged")
+        fun setAfterTextChanged(view: MovieEditText, listener: AfterTextChangedListener?) {
+            val old = ListenerUtil.trackListener(
+                view, listener, R.id.textWatcher
+            ) as? TextWatcher
+            if (old != null) view.editText.removeTextChangedListener(old)
+
+            if (listener == null) return
+
+            val watcher = object : TextWatcher {
+                override fun beforeTextChanged(
+                    s: CharSequence?,
+                    start: Int,
+                    count: Int,
+                    after: Int
+                ) {
+                }
+
+                override fun onTextChanged(s: CharSequence?, start: Int, before: Int, count: Int) {}
+                override fun afterTextChanged(s: Editable?) {
+                    listener.afterTextChanged(s)
+                }
+            }
+
+            view.editText.addTextChangedListener(watcher)
+            ListenerUtil.trackListener(view, watcher, R.id.textWatcher)
+        }
+    }
+
+    fun interface AfterTextChangedListener {
+        fun afterTextChanged(s: Editable?)
+    }
+
+    fun getEditText(): EditText = editText
+}
\ No newline at end of file
diff --git a/app/src/main/res/drawable/cineverse_logo.xml b/app/src/main/res/drawable/cineverse_logo.xml
new file mode 100644
index 000000000..a135c3362
--- /dev/null
+++ b/app/src/main/res/drawable/cineverse_logo.xml
@@ -0,0 +1,61 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:aapt="http://schemas.android.com/aapt"
+    android:width="104dp"
+    android:height="104dp"
+    android:viewportWidth="104"
+    android:viewportHeight="104">
+  <path
+      android:pathData="M70.53,67.8C71.14,67.67 71.7,67.77 72.22,68.1C73.52,68.94 74.79,69.8 76.04,70.68C77.99,71.63 79.86,72.71 81.63,73.92C81.73,74.18 81.7,74.43 81.56,74.66C78.61,80.06 74.37,84.24 68.85,87.2C64.61,89.25 60.12,90.43 55.37,90.74C52.66,91.13 49.96,91.08 47.26,90.59L46.86,90.54C42.79,90 39,88.73 35.47,86.76L35.33,86.72C34.68,86.52 34.11,86.19 33.63,85.73C32.45,85.11 31.33,84.39 30.26,83.59C29.7,83.14 28.96,82.51 28.24,81.88C28.15,81.8 28.06,81.72 27.97,81.64C29.44,81.43 34.91,80.62 38.2,79.84C42.03,78.93 47.52,76.9 47.52,76.9L47.31,76.8C47.72,76.94 48.16,77.07 48.63,77.18C48.64,77.19 48.65,77.19 48.65,77.19C52.87,77.93 57.4,77.42 61.34,75.84L61.7,75.66C65.34,73.8 68.28,71.18 70.53,67.8Z"
+      android:fillColor="#313131"/>
+  <path
+      android:pathData="M70.53,67.8C71.14,67.67 71.7,67.77 72.22,68.1C73.52,68.94 74.79,69.8 76.04,70.68C77.99,71.63 79.86,72.71 81.63,73.92C81.73,74.18 81.7,74.43 81.56,74.66C78.61,80.06 74.37,84.24 68.85,87.2C64.61,89.25 60.12,90.43 55.37,90.74C52.66,91.13 49.96,91.08 47.26,90.59L46.86,90.54C42.79,90 39,88.73 35.47,86.76L35.33,86.72C34.68,86.52 34.11,86.19 33.63,85.73C32.45,85.11 31.33,84.39 30.26,83.59C29.7,83.14 28.96,82.51 28.24,81.88C28.15,81.8 28.06,81.72 27.97,81.64C29.44,81.43 34.91,80.62 38.2,79.84C42.03,78.93 47.52,76.9 47.52,76.9L47.31,76.8C47.72,76.94 48.16,77.07 48.63,77.18C48.64,77.19 48.65,77.19 48.65,77.19C52.87,77.93 57.4,77.42 61.34,75.84L61.7,75.66C65.34,73.8 68.28,71.18 70.53,67.8Z">
+    <aapt:attr name="android:fillColor">
+      <gradient
+          android:startX="95.33"
+          android:startY="13"
+          android:endX="11.31"
+          android:endY="93.75"
+          android:type="linear">
+        <item android:offset="0" android:color="#FFA015F8"/>
+        <item android:offset="0.5" android:color="#FF1E46FC"/>
+        <item android:offset="1" android:color="#FF0FBEF6"/>
+      </gradient>
+    </aapt:attr>
+  </path>
+  <path
+      android:pathData="M51.24,16.84C52.51,16.64 53.79,16.64 55.07,16.84C60,16.91 64.65,18.06 69,20.3C69.52,20.55 69.98,20.87 70.38,21.26C71.43,21.78 72.35,22.47 73.13,23.33C75.37,25.13 77.06,27.34 78.19,29.96C78.78,30.91 79.11,31.95 79.18,33.06C76.34,34.96 73.46,36.81 70.53,38.59C70.17,38.69 69.82,38.69 69.46,38.59C68.44,37.37 67.37,36.19 66.24,35.05C64.97,34.05 63.65,33.14 62.26,32.32C58.63,30.66 54.8,29.92 50.78,30.11C43.95,31.24 38.64,34.58 34.85,40.14C31.71,45.39 30.49,51.05 31.18,57.11C31.33,57.42 31.38,57.76 31.33,58.14C31.73,60.3 32.34,62.41 33.17,64.48C33.31,64.6 33.41,64.75 33.47,64.93C34.04,66.13 34.55,67.13 35.31,68.23C31.31,69.72 27.06,70.56 22.79,70.72C22.79,70.72 22.78,70.72 22.78,70.72C22.78,70.72 22.77,70.72 22.77,70.72C22.45,70.73 22.13,70.74 21.82,70.75C21.22,70.78 20.66,70.8 20.31,70.68C20.3,70.68 20.05,70.65 20,70.53C19.42,70 18.98,69.36 18.7,68.61C18.02,67.08 17.49,65.51 17.09,63.89C16.6,62.22 16.27,60.5 16.1,58.73C15.95,58.97 15.77,59.16 15.56,59.32C14.25,61.27 13.3,63.39 12.73,65.66C12.22,69.34 13.82,71.54 17.53,72.27L17.7,72.3L18.16,72.36C22.89,72.9 27.59,72.63 32.25,71.56L33.23,71.35C35.52,70.83 37.8,70.27 40.06,69.65L41.27,69.22C44.09,68.23 46.9,67.19 49.71,66.11C54.46,63.94 59.11,61.58 63.64,59.03C68.54,56.23 73.18,53.08 77.57,49.58C81.03,47 83.94,43.95 86.3,40.44C86.3,40.34 86.35,40.29 86.46,40.29C87.86,38.18 88.93,35.92 89.67,33.5C89.63,33.31 89.69,33.17 89.82,33.06L89.85,32.84C89.99,31.74 90.01,30.63 89.9,29.52C91.68,31.13 92.58,33.13 92.58,35.5C92.49,38.29 91.62,40.82 89.98,43.09C87.29,47.78 83.92,51.98 79.87,55.71C72.1,62.67 63.32,68.21 53.53,72.3C50.58,73.53 47.56,74.6 44.47,75.51L44.47,75.51C44.47,75.51 39.33,76.92 35.63,77.67C32.12,78.39 26.03,79.28 25.4,79.37C24.24,79.29 22.67,79.16 21.53,79.09C20.37,78.98 19.25,78.79 18.16,78.5L17.91,78.46C15.31,78.03 13.1,76.91 11.27,75.1C9.94,73.63 9.1,71.9 8.75,69.94C8.33,65.54 9.58,61.66 12.5,58.29C13.44,56.86 14.59,55.58 15.94,54.45C15.97,52.33 16.1,50.22 16.33,48.11C16.36,47.59 16.47,47.1 16.63,46.63C17.01,44.15 17.68,41.74 18.62,39.41C21.52,32.48 26.17,26.93 32.56,22.74C38.19,19.09 44.41,17.13 51.24,16.84Z"
+      android:fillColor="#313131"/>
+  <path
+      android:pathData="M51.24,16.84C52.51,16.64 53.79,16.64 55.07,16.84C60,16.91 64.65,18.06 69,20.3C69.52,20.55 69.98,20.87 70.38,21.26C71.43,21.78 72.35,22.47 73.13,23.33C75.37,25.13 77.06,27.34 78.19,29.96C78.78,30.91 79.11,31.95 79.18,33.06C76.34,34.96 73.46,36.81 70.53,38.59C70.17,38.69 69.82,38.69 69.46,38.59C68.44,37.37 67.37,36.19 66.24,35.05C64.97,34.05 63.65,33.14 62.26,32.32C58.63,30.66 54.8,29.92 50.78,30.11C43.95,31.24 38.64,34.58 34.85,40.14C31.71,45.39 30.49,51.05 31.18,57.11C31.33,57.42 31.38,57.76 31.33,58.14C31.73,60.3 32.34,62.41 33.17,64.48C33.31,64.6 33.41,64.75 33.47,64.93C34.04,66.13 34.55,67.13 35.31,68.23C31.31,69.72 27.06,70.56 22.79,70.72C22.79,70.72 22.78,70.72 22.78,70.72C22.78,70.72 22.77,70.72 22.77,70.72C22.45,70.73 22.13,70.74 21.82,70.75C21.22,70.78 20.66,70.8 20.31,70.68C20.3,70.68 20.05,70.65 20,70.53C19.42,70 18.98,69.36 18.7,68.61C18.02,67.08 17.49,65.51 17.09,63.89C16.6,62.22 16.27,60.5 16.1,58.73C15.95,58.97 15.77,59.16 15.56,59.32C14.25,61.27 13.3,63.39 12.73,65.66C12.22,69.34 13.82,71.54 17.53,72.27L17.7,72.3L18.16,72.36C22.89,72.9 27.59,72.63 32.25,71.56L33.23,71.35C35.52,70.83 37.8,70.27 40.06,69.65L41.27,69.22C44.09,68.23 46.9,67.19 49.71,66.11C54.46,63.94 59.11,61.58 63.64,59.03C68.54,56.23 73.18,53.08 77.57,49.58C81.03,47 83.94,43.95 86.3,40.44C86.3,40.34 86.35,40.29 86.46,40.29C87.86,38.18 88.93,35.92 89.67,33.5C89.63,33.31 89.69,33.17 89.82,33.06L89.85,32.84C89.99,31.74 90.01,30.63 89.9,29.52C91.68,31.13 92.58,33.13 92.58,35.5C92.49,38.29 91.62,40.82 89.98,43.09C87.29,47.78 83.92,51.98 79.87,55.71C72.1,62.67 63.32,68.21 53.53,72.3C50.58,73.53 47.56,74.6 44.47,75.51L44.47,75.51C44.47,75.51 39.33,76.92 35.63,77.67C32.12,78.39 26.03,79.28 25.4,79.37C24.24,79.29 22.67,79.16 21.53,79.09C20.37,78.98 19.25,78.79 18.16,78.5L17.91,78.46C15.31,78.03 13.1,76.91 11.27,75.1C9.94,73.63 9.1,71.9 8.75,69.94C8.33,65.54 9.58,61.66 12.5,58.29C13.44,56.86 14.59,55.58 15.94,54.45C15.97,52.33 16.1,50.22 16.33,48.11C16.36,47.59 16.47,47.1 16.63,46.63C17.01,44.15 17.68,41.74 18.62,39.41C21.52,32.48 26.17,26.93 32.56,22.74C38.19,19.09 44.41,17.13 51.24,16.84Z">
+    <aapt:attr name="android:fillColor">
+      <gradient
+          android:startX="95.33"
+          android:startY="13"
+          android:endX="11.31"
+          android:endY="93.75"
+          android:type="linear">
+        <item android:offset="0" android:color="#FFA015F8"/>
+        <item android:offset="0.5" android:color="#FF1E46FC"/>
+        <item android:offset="1" android:color="#FF0FBEF6"/>
+      </gradient>
+    </aapt:attr>
+  </path>
+  <path
+      android:pathData="M84.54,13.3C85,12.9 85.46,12.9 85.92,13.3C86.64,14.89 87.31,16.52 87.91,18.16C88.32,18.73 88.81,19.22 89.36,19.64C90.88,20.05 92.41,20.42 93.96,20.74C94.35,20.81 94.65,20.98 94.88,21.26C95.49,21.71 95.49,22.18 94.88,22.66C93.32,23.43 91.69,24.02 89.98,24.43C89.35,24.77 88.79,25.19 88.29,25.69C87.73,27.3 87.2,28.92 86.69,30.55C86.58,30.82 86.41,31.02 86.15,31.14C85.56,31.76 85.03,31.71 84.54,31C83.86,29.29 83.22,27.57 82.63,25.83C82.27,25.59 81.96,25.29 81.71,24.95C80.2,24.44 78.67,23.97 77.12,23.55C75.67,23.14 75.37,22.35 76.2,21.19C77.37,20.65 78.6,20.29 79.87,20.08C80.44,19.88 81.01,19.63 81.56,19.34L81.68,19.26C82.3,18.83 82.74,18.27 83.01,17.57C83.36,16.09 83.87,14.66 84.54,13.3Z"
+      android:fillColor="#313131"/>
+  <path
+      android:pathData="M84.54,13.3C85,12.9 85.46,12.9 85.92,13.3C86.64,14.89 87.31,16.52 87.91,18.16C88.32,18.73 88.81,19.22 89.36,19.64C90.88,20.05 92.41,20.42 93.96,20.74C94.35,20.81 94.65,20.98 94.88,21.26C95.49,21.71 95.49,22.18 94.88,22.66C93.32,23.43 91.69,24.02 89.98,24.43C89.35,24.77 88.79,25.19 88.29,25.69C87.73,27.3 87.2,28.92 86.69,30.55C86.58,30.82 86.41,31.02 86.15,31.14C85.56,31.76 85.03,31.71 84.54,31C83.86,29.29 83.22,27.57 82.63,25.83C82.27,25.59 81.96,25.29 81.71,24.95C80.2,24.44 78.67,23.97 77.12,23.55C75.67,23.14 75.37,22.35 76.2,21.19C77.37,20.65 78.6,20.29 79.87,20.08C80.44,19.88 81.01,19.63 81.56,19.34L81.68,19.26C82.3,18.83 82.74,18.27 83.01,17.57C83.36,16.09 83.87,14.66 84.54,13.3Z">
+    <aapt:attr name="android:fillColor">
+      <gradient
+          android:startX="95.33"
+          android:startY="13"
+          android:endX="11.31"
+          android:endY="93.75"
+          android:type="linear">
+        <item android:offset="0" android:color="#FFA015F8"/>
+        <item android:offset="0.5" android:color="#FF1E46FC"/>
+        <item android:offset="1" android:color="#FF0FBEF6"/>
+      </gradient>
+    </aapt:attr>
+  </path>
+</vector>
diff --git a/app/src/main/res/drawable/click_ripple.xml b/app/src/main/res/drawable/click_ripple.xml
new file mode 100644
index 000000000..86cd55e45
--- /dev/null
+++ b/app/src/main/res/drawable/click_ripple.xml
@@ -0,0 +1,3 @@
+<?xml version="1.0" encoding="utf-8"?>
+<ripple xmlns:android="http://schemas.android.com/apk/res/android"
+    android:color="?attr/colorControlHighlight" />
\ No newline at end of file
diff --git a/app/src/main/res/drawable/eye_closed.xml b/app/src/main/res/drawable/eye_closed.xml
new file mode 100644
index 000000000..884d6d5fe
--- /dev/null
+++ b/app/src/main/res/drawable/eye_closed.xml
@@ -0,0 +1,10 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="20dp"
+    android:height="20dp"
+    android:viewportWidth="20"
+    android:viewportHeight="20">
+  <path
+      android:pathData="M18.58,5.259C18.897,5.395 19.044,5.762 18.908,6.079L18.334,5.833C18.908,6.079 18.908,6.079 18.908,6.079L18.907,6.081L18.907,6.083L18.904,6.089L18.895,6.109C18.888,6.126 18.877,6.149 18.863,6.179C18.835,6.239 18.795,6.323 18.741,6.428C18.634,6.639 18.473,6.934 18.257,7.28C17.903,7.849 17.394,8.565 16.719,9.275L17.525,10.082C17.77,10.326 17.77,10.722 17.525,10.966C17.281,11.21 16.886,11.21 16.642,10.966L15.808,10.132C15.258,10.593 14.628,11.025 13.913,11.38L14.691,12.576C14.879,12.865 14.797,13.252 14.508,13.44C14.219,13.629 13.831,13.547 13.643,13.257L12.735,11.863C12.086,12.075 11.383,12.219 10.625,12.27V13.75C10.625,14.095 10.345,14.375 10,14.375C9.655,14.375 9.375,14.095 9.375,13.75V12.27C8.641,12.22 7.958,12.083 7.325,11.882L6.43,13.257C6.242,13.547 5.855,13.629 5.565,13.44C5.276,13.252 5.194,12.865 5.382,12.576L6.143,11.407C5.422,11.055 4.787,10.625 4.232,10.165L3.432,10.966C3.187,11.21 2.792,11.21 2.548,10.966C2.304,10.722 2.304,10.326 2.548,10.082L3.317,9.312C2.63,8.596 2.113,7.872 1.753,7.295C1.534,6.945 1.371,6.646 1.262,6.433C1.207,6.326 1.166,6.241 1.138,6.18C1.124,6.15 1.113,6.126 1.106,6.109L1.097,6.089L1.094,6.083L1.093,6.081L1.093,6.08C1.093,6.08 1.092,6.079 1.667,5.833L1.093,6.08C0.957,5.763 1.103,5.395 1.421,5.259C1.738,5.123 2.105,5.269 2.241,5.586C2.241,5.586 2.241,5.586 2.241,5.586L2.242,5.588L2.247,5.599C2.252,5.61 2.26,5.628 2.271,5.652C2.293,5.7 2.328,5.772 2.375,5.864C2.47,6.05 2.615,6.317 2.813,6.633C3.209,7.267 3.81,8.089 4.63,8.851C5.352,9.522 6.236,10.139 7.293,10.546C8.089,10.852 8.988,11.042 10,11.042C11.035,11.042 11.952,10.844 12.761,10.526C13.812,10.112 14.69,9.49 15.406,8.818C16.214,8.06 16.806,7.246 17.197,6.619C17.391,6.307 17.534,6.043 17.627,5.86C17.674,5.769 17.708,5.698 17.73,5.651C17.741,5.627 17.749,5.61 17.754,5.599L17.759,5.588L17.759,5.587C17.759,5.587 17.759,5.587 17.759,5.587M18.58,5.259C18.263,5.123 17.895,5.27 17.759,5.587L18.58,5.259ZM2.241,5.586C2.241,5.586 2.241,5.586 2.241,5.586V5.586Z"
+      android:fillColor="#717171"
+      android:fillType="evenOdd"/>
+</vector>
diff --git a/app/src/main/res/drawable/eye_opened.xml b/app/src/main/res/drawable/eye_opened.xml
new file mode 100644
index 000000000..76d4a78cc
--- /dev/null
+++ b/app/src/main/res/drawable/eye_opened.xml
@@ -0,0 +1,14 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="20dp"
+    android:height="20dp"
+    android:viewportWidth="20"
+    android:viewportHeight="20">
+  <path
+      android:pathData="M10,6.875C8.274,6.875 6.875,8.274 6.875,10C6.875,11.726 8.274,13.125 10,13.125C11.726,13.125 13.125,11.726 13.125,10C13.125,8.274 11.726,6.875 10,6.875ZM8.125,10C8.125,8.965 8.965,8.125 10,8.125C11.036,8.125 11.875,8.965 11.875,10C11.875,11.036 11.036,11.875 10,11.875C8.965,11.875 8.125,11.036 8.125,10Z"
+      android:fillColor="#717171"
+      android:fillType="evenOdd"/>
+  <path
+      android:pathData="M10,2.708C6.239,2.708 3.705,4.962 2.234,6.873L2.208,6.907C1.875,7.339 1.569,7.737 1.361,8.207C1.138,8.711 1.042,9.26 1.042,10C1.042,10.74 1.138,11.289 1.361,11.793C1.569,12.264 1.875,12.661 2.208,13.093L2.234,13.128C3.705,15.038 6.239,17.292 10,17.292C13.762,17.292 16.296,15.038 17.767,13.128L17.793,13.093C18.126,12.661 18.432,12.264 18.64,11.793C18.862,11.289 18.959,10.74 18.959,10C18.959,9.26 18.862,8.711 18.64,8.207C18.432,7.737 18.126,7.339 17.793,6.907L17.767,6.873C16.296,4.962 13.762,2.708 10,2.708ZM3.225,7.635C4.583,5.871 6.792,3.958 10,3.958C13.208,3.958 15.418,5.871 16.776,7.635C17.142,8.11 17.355,8.394 17.496,8.712C17.628,9.01 17.709,9.374 17.709,10C17.709,10.626 17.628,10.99 17.496,11.288C17.355,11.607 17.142,11.891 16.776,12.365C15.418,14.129 13.208,16.042 10,16.042C6.792,16.042 4.583,14.129 3.225,12.365C2.859,11.891 2.645,11.607 2.504,11.288C2.373,10.99 2.292,10.626 2.292,10C2.292,9.374 2.373,9.01 2.504,8.712C2.645,8.394 2.859,8.11 3.225,7.635Z"
+      android:fillColor="#717171"
+      android:fillType="evenOdd"/>
+</vector>
diff --git a/app/src/main/res/drawable/lock.xml b/app/src/main/res/drawable/lock.xml
new file mode 100644
index 000000000..59708557f
--- /dev/null
+++ b/app/src/main/res/drawable/lock.xml
@@ -0,0 +1,9 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="20dp"
+    android:height="20dp"
+    android:viewportWidth="20"
+    android:viewportHeight="20">
+  <path
+      android:pathData="M17.708,12.5C17.708,10.829 17.484,10.035 17.058,9.608C16.631,9.182 15.837,8.958 14.166,8.958H5.833C4.162,8.958 3.367,9.182 2.941,9.608C2.515,10.035 2.291,10.829 2.291,12.5V14.167C2.291,15.838 2.515,16.632 2.941,17.058C3.367,17.484 4.162,17.708 5.833,17.708H14.166C15.837,17.708 16.631,17.484 17.058,17.058C17.484,16.632 17.708,15.838 17.708,14.167V12.5ZM11.458,13.333C11.458,12.528 10.805,11.875 9.999,11.875C9.194,11.875 8.541,12.528 8.541,13.333C8.541,14.139 9.194,14.792 9.999,14.792C10.805,14.792 11.458,14.139 11.458,13.333ZM12.708,13.333C12.708,14.829 11.495,16.042 9.999,16.042C8.504,16.042 7.291,14.829 7.291,13.333C7.291,11.837 8.504,10.625 9.999,10.625C11.495,10.625 12.708,11.837 12.708,13.333ZM14.374,6.667C14.374,5.325 14.166,4.258 13.575,3.524C13.008,2.82 11.976,2.292 9.999,2.292C8.023,2.292 6.991,2.82 6.424,3.524C5.833,4.258 5.624,5.325 5.624,6.667V7.711C5.693,7.711 5.763,7.708 5.833,7.708H14.166C14.236,7.708 14.306,7.711 14.374,7.711V6.667ZM15.624,7.779C16.595,7.892 17.377,8.161 17.941,8.725C18.765,9.548 18.958,10.838 18.958,12.5V14.167C18.958,15.829 18.765,17.118 17.941,17.942C17.118,18.765 15.828,18.958 14.166,18.958H5.833C4.17,18.958 2.881,18.765 2.057,17.942C1.234,17.118 1.041,15.829 1.041,14.167V12.5C1.041,10.838 1.234,9.548 2.057,8.725C2.621,8.161 3.404,7.892 4.374,7.779V6.667C4.374,5.25 4.582,3.817 5.45,2.74C6.341,1.634 7.809,1.041 9.999,1.041C12.19,1.041 13.657,1.634 14.549,2.74C15.416,3.817 15.624,5.25 15.624,6.667V7.779Z"
+      android:fillColor="#A5A5A5"/>
+</vector>
diff --git a/app/src/main/res/drawable/password_eye.xml b/app/src/main/res/drawable/password_eye.xml
new file mode 100644
index 000000000..8a2d1b8a3
--- /dev/null
+++ b/app/src/main/res/drawable/password_eye.xml
@@ -0,0 +1,26 @@
+<?xml version="1.0" encoding="utf-8"?>
+<animated-selector xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools"
+    tools:ignore="NewApi">
+
+    <item
+        android:id="@+id/visible"
+        android:drawable="@drawable/eye_closed"
+        android:state_checked="true"/>
+
+    <item
+        android:id="@+id/masked"
+        android:drawable="@drawable/eye_opened"/>
+
+    <transition
+        android:drawable="@drawable/eye_closed"
+        android:fromId="@id/masked"
+        android:toId="@id/visible"/>
+
+    <transition
+        android:drawable="@drawable/eye_opened"
+        android:fromId="@id/visible"
+        android:toId="@id/masked"/>
+
+</animated-selector>
+
diff --git a/app/src/main/res/drawable/squircle_button_background_secondary.xml b/app/src/main/res/drawable/squircle_button_background_secondary.xml
new file mode 100644
index 000000000..b4a9a2078
--- /dev/null
+++ b/app/src/main/res/drawable/squircle_button_background_secondary.xml
@@ -0,0 +1,19 @@
+<?xml version="1.0" encoding="utf-8"?>
+<ripple xmlns:android="http://schemas.android.com/apk/res/android"
+    android:color="?attr/colorControlHighlight">
+
+    <item>
+        <vector
+            android:width="240dp"
+            android:height="40dp"
+            android:viewportWidth="240"
+            android:viewportHeight="40">
+
+            <path
+                android:fillColor="@color/button_secondary"
+                android:pathData="M0,20 C0,4 4,0 20,0 L220,0 C236,0 240,4 240,20 C240,36 236,40 220,40 L20,40 C4,40 0,36 0,20 Z" />
+
+        </vector>
+    </item>
+
+</ripple>
diff --git a/app/src/main/res/drawable/squircle_text_field.xml b/app/src/main/res/drawable/squircle_text_field.xml
new file mode 100644
index 000000000..b40f4e747
--- /dev/null
+++ b/app/src/main/res/drawable/squircle_text_field.xml
@@ -0,0 +1,14 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="328dp"
+    android:height="48dp"
+    android:viewportWidth="328"
+    android:viewportHeight="48">
+  <path
+      android:pathData="M24,0.5H304C309.67,0.5 313.87,0.5 317.1,0.93C320.31,1.37 322.48,2.22 324.13,3.87C325.78,5.52 326.63,7.69 327.07,10.9C327.5,14.13 327.5,18.33 327.5,24C327.5,29.67 327.5,33.87 327.07,37.1C326.63,40.31 325.78,42.48 324.13,44.13C322.48,45.78 320.31,46.63 317.1,47.07C313.87,47.5 309.67,47.5 304,47.5H24C18.33,47.5 14.13,47.5 10.9,47.07C7.69,46.63 5.52,45.78 3.87,44.13C2.22,42.48 1.37,40.31 0.93,37.1C0.5,33.87 0.5,29.67 0.5,24C0.5,18.33 0.5,14.13 0.93,10.9C1.37,7.69 2.22,5.52 3.87,3.87C5.52,2.22 7.69,1.37 10.9,0.93C14.13,0.5 18.33,0.5 24,0.5Z"
+      android:fillColor="#ffffff"/>
+  <path
+      android:strokeWidth="1"
+      android:pathData="M24,0.5H304C309.67,0.5 313.87,0.5 317.1,0.93C320.31,1.37 322.48,2.22 324.13,3.87C325.78,5.52 326.63,7.69 327.07,10.9C327.5,14.13 327.5,18.33 327.5,24C327.5,29.67 327.5,33.87 327.07,37.1C326.63,40.31 325.78,42.48 324.13,44.13C322.48,45.78 320.31,46.63 317.1,47.07C313.87,47.5 309.67,47.5 304,47.5H24C18.33,47.5 14.13,47.5 10.9,47.07C7.69,46.63 5.52,45.78 3.87,44.13C2.22,42.48 1.37,40.31 0.93,37.1C0.5,33.87 0.5,29.67 0.5,24C0.5,18.33 0.5,14.13 0.93,10.9C1.37,7.69 2.22,5.52 3.87,3.87C5.52,2.22 7.69,1.37 10.9,0.93C14.13,0.5 18.33,0.5 24,0.5Z"
+      android:fillColor="#00000000"
+      android:strokeColor="#ECECEC"/>
+</vector>
diff --git a/app/src/main/res/drawable/user.xml b/app/src/main/res/drawable/user.xml
new file mode 100644
index 000000000..416a673ea
--- /dev/null
+++ b/app/src/main/res/drawable/user.xml
@@ -0,0 +1,14 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="20dp"
+    android:height="20dp"
+    android:viewportWidth="20"
+    android:viewportHeight="20">
+  <path
+      android:pathData="M10.001,1.041C7.815,1.041 6.042,2.814 6.042,5C6.042,7.186 7.815,8.958 10.001,8.958C12.187,8.958 13.959,7.186 13.959,5C13.959,2.814 12.187,1.041 10.001,1.041ZM7.292,5C7.292,3.504 8.505,2.292 10.001,2.292C11.497,2.292 12.709,3.504 12.709,5C12.709,6.496 11.497,7.708 10.001,7.708C8.505,7.708 7.292,6.496 7.292,5Z"
+      android:fillColor="#A5A5A5"
+      android:fillType="evenOdd"/>
+  <path
+      android:pathData="M10.001,10.208C8.073,10.208 6.297,10.646 4.98,11.387C3.684,12.116 2.709,13.222 2.709,14.583L2.709,14.668C2.708,15.636 2.707,16.851 3.773,17.719C4.297,18.147 5.031,18.45 6.023,18.651C7.017,18.852 8.313,18.958 10.001,18.958C11.689,18.958 12.985,18.852 13.979,18.651C14.97,18.45 15.704,18.147 16.229,17.719C17.295,16.851 17.293,15.636 17.292,14.668L17.292,14.583C17.292,13.222 16.318,12.116 15.021,11.387C13.705,10.646 11.929,10.208 10.001,10.208ZM3.959,14.583C3.959,13.874 4.477,13.104 5.593,12.476C6.69,11.859 8.247,11.458 10.001,11.458C11.755,11.458 13.312,11.859 14.408,12.476C15.525,13.104 16.042,13.874 16.042,14.583C16.042,15.673 16.009,16.287 15.439,16.75C15.131,17.002 14.615,17.247 13.731,17.426C12.85,17.604 11.646,17.708 10.001,17.708C8.356,17.708 7.151,17.604 6.271,17.426C5.387,17.247 4.871,17.002 4.562,16.75C3.993,16.287 3.959,15.673 3.959,14.583Z"
+      android:fillColor="#A5A5A5"
+      android:fillType="evenOdd"/>
+</vector>
diff --git a/app/src/main/res/layout/fragment_login.xml b/app/src/main/res/layout/fragment_login.xml
index a24dde39b..6d9f9aead 100644
--- a/app/src/main/res/layout/fragment_login.xml
+++ b/app/src/main/res/layout/fragment_login.xml
@@ -15,18 +15,22 @@
     <androidx.constraintlayout.widget.ConstraintLayout
         android:layout_width="match_parent"
         android:layout_height="match_parent"
-        android:background="@color/background_color"
+        android:background="@color/background_screen"
+        android:padding="16dp"
         tools:context=".ui.login.LoginFragment">
 
 
         <ImageView
             android:id="@+id/imageView"
-            android:layout_width="match_parent"
-            android:layout_height="0dp"
-            android:scaleType="centerCrop"
+            android:layout_width="104dp"
+            android:layout_height="104dp"
+            android:layout_marginTop="48dp"
             android:shadowColor="@color/shade_secondary"
-            android:src="@drawable/login_movie"
+            android:src="@drawable/cineverse_logo"
+            app:layout_constraintEnd_toEndOf="parent"
             app:layout_constraintHeight_percent="0.35"
+            app:layout_constraintHorizontal_bias="0.5"
+            app:layout_constraintStart_toStartOf="parent"
             app:layout_constraintTop_toTopOf="parent" />
 
 
@@ -35,74 +39,86 @@
             style="@style/SemiBold.Large"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:layout_marginHorizontal="16dp"
-            android:layout_marginTop="@dimen/spacing_medium"
-            android:text="@string/login_to_your_account"
-            app:layout_constraintStart_toStartOf="parent"
+            android:layout_marginTop="8dp"
+            android:text="@string/welcome_back_to_cineverse"
+            android:textColor="@color/shade_primary"
+            android:textSize="@dimen/text_size_title_lg"
+            app:layout_constraintEnd_toEndOf="@+id/imageView"
+            app:layout_constraintStart_toStartOf="@+id/imageView"
             app:layout_constraintTop_toBottomOf="@+id/imageView" />
 
+        <TextView
+            android:id="@+id/username_title"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_marginTop="48dp"
+            android:text="@string/username"
+            android:textColor="@color/shade_secondary"
+            android:textSize="@dimen/text_size_body_md"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toBottomOf="@+id/textView" />
 
-        <com.google.android.material.textfield.TextInputLayout
+        <com.karrar.movieapp.utilities.view.MovieEditText
             android:id="@+id/user_name"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            android:layout_marginHorizontal="@dimen/spacing_medium"
-            android:layout_marginTop="@dimen/spacing_medium"
-            android:hint="@string/username"
+            android:layout_marginTop="8dp"
+            android:layout_marginBottom="16dp"
+            app:afterTextChanged="@{(text) -> viewModel.onUserNameInputChange(text)}"
             app:helperText="@{viewModel.loginUIState.userNameHelperText}"
-            app:layout_constraintTop_toBottomOf="@+id/textView"
-            app:startIconDrawable="@drawable/ic_profile">
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintHorizontal_bias="0.5"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toBottomOf="@+id/username_title"
+            app:startIconDrawable="@drawable/user" />
 
-            <com.google.android.material.textfield.TextInputEditText
-                android:layout_width="match_parent"
-                android:layout_height="56dp"
-                android:inputType="textPersonName"
-                android:maxLines="1"
-                android:afterTextChanged="@{(text) -> viewModel.onUserNameInputChange(text)}"
-                android:textColor="@color/shade_secondary"
+        <TextView
+            android:id="@+id/password_title"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_marginTop="16dp"
+            android:text="@string/password"
+            android:textColor="@color/shade_secondary"
+            android:textSize="@dimen/text_size_body_md"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toBottomOf="@+id/user_name" />
 
-                />
-        </com.google.android.material.textfield.TextInputLayout>
 
-        <com.google.android.material.textfield.TextInputLayout
+        <com.karrar.movieapp.utilities.view.MovieEditText
             android:id="@+id/password"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
-            android:layout_marginHorizontal="@dimen/spacing_medium"
-            android:layout_marginTop="@dimen/spacing_medium"
-            android:hint="@string/password"
+            app:showEye="true"
+            android:layout_marginTop="8dp"
+            android:layout_marginBottom="16dp"
+            app:afterTextChanged="@{(text) -> viewModel.onPasswordInputChange(text)}"
             app:helperText="@{viewModel.loginUIState.passwordHelperText}"
-            app:layout_constraintTop_toBottomOf="@+id/user_name"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintHorizontal_bias="0.5"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toBottomOf="@+id/password_title"
+            app:passwordToggleDrawable="@drawable/eye_opened"
             app:passwordToggleEnabled="true"
             app:passwordToggleTint="@color/shade_secondary"
-            app:startIconDrawable="@drawable/ic_key">
-
-            <com.google.android.material.textfield.TextInputEditText
-                android:layout_width="match_parent"
-                android:layout_height="56dp"
-                android:inputType="textPassword"
-                android:maxLines="1"
-                android:afterTextChanged="@{(text) -> viewModel.onPasswordInputChange(text)}"
-                android:textColor="@color/shade_secondary" />
-        </com.google.android.material.textfield.TextInputLayout>
+            app:startIconDrawable="@drawable/lock" />
 
         <com.google.android.material.button.MaterialButton
             android:id="@+id/containedButton"
+            style="@style/SquircleButton"
             android:layout_width="match_parent"
-            android:layout_height="56dp"
-            android:layout_marginHorizontal="@dimen/spacing_medium"
-            android:layout_marginTop="@dimen/spacing_extra_large"
+            android:layout_height="48dp"
+            android:layout_marginTop="20dp"
             android:enabled="@{viewModel.loginUIState.validForm}"
             android:onClick="@{()->viewModel.onClickLogin()}"
             android:text="@string/login"
             android:textAppearance="@style/SemiBold.Medium"
-            android:textColor="@color/white_primary"
+            android:textSize="@dimen/text_size_body_md"
             app:backgroundTint="@color/color_states_material_button"
             app:cornerRadius="@dimen/radius_small"
+            app:hideIfTrue="@{viewModel.loginUIState.loading}"
             app:layout_constraintEnd_toEndOf="parent"
             app:layout_constraintStart_toStartOf="parent"
-            app:layout_constraintTop_toBottomOf="@+id/password"
-            app:hideIfTrue="@{viewModel.loginUIState.loading}" />
+            app:layout_constraintTop_toBottomOf="@+id/forgetPasswordLink" />
 
 
         <com.google.android.material.progressindicator.CircularProgressIndicator
@@ -112,36 +128,38 @@
             android:indeterminate="true"
             android:visibility="gone"
             app:indicatorColor="@color/brand_primary"
+            app:isVisible="@{viewModel.loginUIState.loading}"
             app:layout_constraintEnd_toEndOf="parent"
             app:layout_constraintStart_toStartOf="parent"
             app:layout_constraintTop_toBottomOf="@+id/password"
-            app:isVisible="@{viewModel.loginUIState.loading}"
             app:trackColor="@color/shade_secondary" />
 
-        <com.google.android.material.textview.MaterialTextView
-            android:id="@+id/materialTextView"
+
+        <com.google.android.material.button.MaterialButton
+            style="@style/SquircleButton.Secondary"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:layout_marginBottom="16dp"
-            android:text="@string/don_t_have_an_account"
-            android:textAppearance="@style/Regular.Medium.Primary"
+            android:layout_marginBottom="24dp"
+            android:onClick="@{()->viewModel.onClickSignUp()}"
+            android:text="@string/create_a_new_account"
+            app:backgroundTint="@color/button_secondary"
             app:layout_constraintBottom_toBottomOf="parent"
             app:layout_constraintEnd_toEndOf="parent"
-            app:layout_constraintHorizontal_bias="0.42"
             app:layout_constraintStart_toStartOf="parent" />
 
         <TextView
-            android:id="@+id/sign_up"
+            android:id="@+id/forgetPasswordLink"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:layout_marginStart="4dp"
-            android:onClick="@{()->viewModel.onClickSignUp()}"
-            android:text="@string/sign_up"
-            android:textAppearance="@style/Regular.Medium.Primary"
-            android:textColor="@color/brand_primary"
-            app:layout_constraintBottom_toBottomOf="@+id/materialTextView"
-            app:layout_constraintStart_toEndOf="@+id/materialTextView"
-            app:layout_constraintTop_toTopOf="@+id/materialTextView" />
+            android:layout_marginTop="12dp"
+            android:clickable="true"
+            android:focusable="true"
+            android:onClick="@{()->viewModel.onForgetPassword()}"
+            android:text="@string/forgot_password"
+            android:textColor="@color/shade_secondary"
+            android:textSize="@dimen/text_size_body_md"
+            app:layout_constraintEnd_toEndOf="@+id/password"
+            app:layout_constraintTop_toBottomOf="@+id/password" />
 
     </androidx.constraintlayout.widget.ConstraintLayout>
 </layout>
\ No newline at end of file
diff --git a/app/src/main/res/layout/view_edit_text.xml b/app/src/main/res/layout/view_edit_text.xml
new file mode 100644
index 000000000..7c2ee3dd3
--- /dev/null
+++ b/app/src/main/res/layout/view_edit_text.xml
@@ -0,0 +1,45 @@
+<?xml version="1.0" encoding="utf-8"?>
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    android:orientation="vertical">
+
+    <LinearLayout
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:background="@drawable/squircle_text_field">
+
+        <EditText
+            android:id="@+id/innerEditText"
+            android:layout_width="0dp"
+            android:layout_height="48dp"
+            android:layout_weight="1"
+            android:background="#00000000"
+            android:drawableStart="@drawable/user"
+            android:drawablePadding="8dp"
+            android:hint="@string/enter_your_email_or_username"
+            android:paddingHorizontal="16dp"
+            android:textColor="@color/shade_primary"
+            android:textColorHint="@color/shade_tertiary"
+            android:textSize="@dimen/text_size_body_md" />
+
+        <ImageView
+            android:id="@+id/passwordEye"
+            android:layout_width="48dp"
+            android:adjustViewBounds="false"
+            android:layout_height="48dp"
+            android:background="@drawable/click_ripple"
+            android:clickable="true"
+            android:focusable="true"
+            android:padding="14dp"
+            android:src="@drawable/eye_opened" />
+    </LinearLayout>
+
+    <TextView
+        android:id="@+id/helperText"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:layout_marginTop="8dp"
+        android:textColor="@color/additional_primary_red"
+        android:textSize="@dimen/text_size_body_sm" />
+</LinearLayout>
\ No newline at end of file
diff --git a/app/src/main/res/values/attr.xml b/app/src/main/res/values/attr.xml
new file mode 100644
index 000000000..ef10df73a
--- /dev/null
+++ b/app/src/main/res/values/attr.xml
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <declare-styleable name="MovieEditText">
+        <attr name="helperText" format="string" />
+        <attr name="showEye" format="boolean" />
+    </declare-styleable>
+</resources>
\ No newline at end of file
diff --git a/app/src/main/res/values/ids.xml b/app/src/main/res/values/ids.xml
new file mode 100644
index 000000000..5fbfa33cb
--- /dev/null
+++ b/app/src/main/res/values/ids.xml
@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <item name="textWatcher" type="id"/>
+</resources>
\ No newline at end of file
diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml
index a6b6cb98f..1bb0378ec 100644
--- a/app/src/main/res/values/strings.xml
+++ b/app/src/main/res/values/strings.xml
@@ -105,4 +105,9 @@
     <string name="no_history_yet">No History Yet</string>
     <string name="no_history_description">It’s quiet in here… Start watching and we’ll keep track for you.</string>
     <string name="watch_something">Find Something to Watch</string>
+    <string name="enter_your_email_or_username">Enter your email or username</string>
+    <string name="welcome_back_to_cineverse">Welcome back to CineVerse!</string>
+    <string name="create_a_new_account">Create a New Account</string>
+    <string name="forgot_password"><u>Forgot Password?</u></string>
+    <string name="join_as_guest">Join as Guest</string>
 </resources>
\ No newline at end of file
diff --git a/app/src/main/res/values/styles.xml b/app/src/main/res/values/styles.xml
index 8a4bbb174..e1d76751e 100644
--- a/app/src/main/res/values/styles.xml
+++ b/app/src/main/res/values/styles.xml
@@ -107,6 +107,13 @@
         <item name="android:textAllCaps">false</item>
     </style>
 
+    <style name="SquircleButton.Secondary">
+        <item name="android:background">@drawable/squircle_button_background_secondary</item>
+        <item name="android:textColor">@color/shade_secondary</item>
+        <item name="android:includeFontPadding">false</item>
+        <item name="android:textAllCaps">false</item>
+    </style>
+
     <style name="SquircleButton.Regular">
         <item name="android:fontFamily">@font/manrope_regular</item>
         <item name="android:textSize">@dimen/text_size_label_md</item>