diff --git a/app/src/main/java/com/alya/ecommerce_serang/data/api/dto/RegisterRequest.kt b/app/src/main/java/com/alya/ecommerce_serang/data/api/dto/RegisterRequest.kt
index 19581dc..d1a4482 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/data/api/dto/RegisterRequest.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/data/api/dto/RegisterRequest.kt
@@ -12,7 +12,7 @@ data class RegisterRequest (
     val birthDate: String?,
 
     @SerializedName("userimg")
-    val image: String?,
+    val image: String? = null,
 
     val otp: String? = null
 )
\ No newline at end of file
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/MainActivity.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/MainActivity.kt
index 3877327..0500df0 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/MainActivity.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/MainActivity.kt
@@ -1,7 +1,11 @@
 package com.alya.ecommerce_serang.ui
 
 import android.os.Bundle
+import androidx.activity.enableEdgeToEdge
 import androidx.appcompat.app.AppCompatActivity
+import androidx.core.view.ViewCompat
+import androidx.core.view.WindowCompat
+import androidx.core.view.WindowInsetsCompat
 import androidx.core.view.isVisible
 import androidx.navigation.fragment.NavHostFragment
 import androidx.navigation.ui.setupWithNavController
@@ -25,7 +29,23 @@ class MainActivity : AppCompatActivity() {
         setContentView(binding.root)
 
         sessionManager = SessionManager(this)
-        apiService = ApiConfig.getApiService(sessionManager) // Inject SessionManager
+        apiService = ApiConfig.getApiService(sessionManager)
+
+        WindowCompat.setDecorFitsSystemWindows(window, false)
+
+        enableEdgeToEdge()
+
+        // Apply insets to your root layout
+        ViewCompat.setOnApplyWindowInsetsListener(binding.root) { view, windowInsets ->
+            val systemBars = windowInsets.getInsets(WindowInsetsCompat.Type.systemBars())
+            view.setPadding(
+                systemBars.left,
+                systemBars.top,
+                systemBars.right,
+                0
+            )
+            windowInsets
+        }
 
         setupBottomNavigation()
         observeDestinationChanges()
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/auth/RegisterActivity.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/auth/RegisterActivity.kt
index ec126d1..dbe2793 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/auth/RegisterActivity.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/auth/RegisterActivity.kt
@@ -1,5 +1,6 @@
 package com.alya.ecommerce_serang.ui.auth
 
+import android.app.DatePickerDialog
 import android.content.Intent
 import android.os.Bundle
 import android.util.Log
@@ -7,6 +8,9 @@ import android.widget.Toast
 import androidx.activity.enableEdgeToEdge
 import androidx.activity.viewModels
 import androidx.appcompat.app.AppCompatActivity
+import androidx.core.view.ViewCompat
+import androidx.core.view.WindowCompat
+import androidx.core.view.WindowInsetsCompat
 import com.alya.ecommerce_serang.data.api.dto.RegisterRequest
 import com.alya.ecommerce_serang.data.api.retrofit.ApiConfig
 import com.alya.ecommerce_serang.data.repository.Result
@@ -16,6 +20,9 @@ import com.alya.ecommerce_serang.ui.MainActivity
 import com.alya.ecommerce_serang.utils.BaseViewModelFactory
 import com.alya.ecommerce_serang.utils.SessionManager
 import com.alya.ecommerce_serang.utils.viewmodel.RegisterViewModel
+import java.text.SimpleDateFormat
+import java.util.Calendar
+import java.util.Locale
 
 class RegisterActivity : AppCompatActivity() {
     private lateinit var binding: ActivityRegisterBinding
@@ -38,10 +45,24 @@ class RegisterActivity : AppCompatActivity() {
             finish()
         }
 
+        WindowCompat.setDecorFitsSystemWindows(window, false)
+
         enableEdgeToEdge()
+
+        // Apply insets to your root layout
+        ViewCompat.setOnApplyWindowInsetsListener(binding.root) { view, windowInsets ->
+            val systemBars = windowInsets.getInsets(WindowInsetsCompat.Type.systemBars())
+            view.setPadding(
+                systemBars.left,
+                systemBars.top,
+                systemBars.right,
+                systemBars.bottom
+            )
+            windowInsets
+        }
+
         binding = ActivityRegisterBinding.inflate(layoutInflater)
         setContentView(binding.root)
-
         // Observe OTP state
         observeOtpState()
 
@@ -53,7 +74,7 @@ class RegisterActivity : AppCompatActivity() {
             val phone = binding.etNumberPhone.text.toString()
             val username = binding.etUsername.text.toString()
             val name = binding.etFullname.text.toString()
-            val image = "not yet"
+            val image = null
 
             val userData = RegisterRequest(name, email, password, username, phone, birthDate, image)
 
@@ -94,6 +115,9 @@ class RegisterActivity : AppCompatActivity() {
             startActivity(intent)
         }
 
+        binding.etBirthDate.setOnClickListener{
+            showDatePicker()
+        }
     }
 
     private fun observeOtpState() {
@@ -140,4 +164,21 @@ class RegisterActivity : AppCompatActivity() {
                 }
             }
     }
+
+    private fun showDatePicker() {
+        val calendar = Calendar.getInstance()
+        val year = calendar.get(Calendar.YEAR)
+        val month = calendar.get(Calendar.MONTH)
+        val day = calendar.get(Calendar.DAY_OF_MONTH)
+
+        DatePickerDialog(
+            this,
+            { _, selectedYear, selectedMonth, selectedDay ->
+                calendar.set(selectedYear, selectedMonth, selectedDay)
+                val sdf = SimpleDateFormat("dd-MM-yyyy", Locale.getDefault())
+                binding.etBirthDate.setText(sdf.format(calendar.time))
+            },
+            year, month, day
+        ).show()
+    }
 }
\ No newline at end of file
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/home/HomeFragment.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/home/HomeFragment.kt
index b9b6fc4..381ad69 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/home/HomeFragment.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/home/HomeFragment.kt
@@ -49,6 +49,7 @@ class HomeFragment : Fragment() {
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
         sessionManager = SessionManager(requireContext())
+
     }
 
     override fun onCreateView(
@@ -62,6 +63,7 @@ class HomeFragment : Fragment() {
     override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
         super.onViewCreated(view, savedInstanceState)
 
+
         initUi()
         setupRecyclerView()
         observeData()
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/product/DetailProductActivity.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/product/DetailProductActivity.kt
index bb10bdb..4be3e57 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/product/DetailProductActivity.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/product/DetailProductActivity.kt
@@ -9,8 +9,12 @@ import android.widget.Button
 import android.widget.ImageButton
 import android.widget.TextView
 import android.widget.Toast
+import androidx.activity.enableEdgeToEdge
 import androidx.activity.viewModels
 import androidx.appcompat.app.AppCompatActivity
+import androidx.core.view.ViewCompat
+import androidx.core.view.WindowCompat
+import androidx.core.view.WindowInsetsCompat
 import androidx.recyclerview.widget.LinearLayoutManager
 import com.alya.ecommerce_serang.BuildConfig.BASE_URL
 import com.alya.ecommerce_serang.R
@@ -57,6 +61,22 @@ class DetailProductActivity : AppCompatActivity() {
         sessionManager = SessionManager(this)
         apiService = ApiConfig.getApiService(sessionManager)
 
+        WindowCompat.setDecorFitsSystemWindows(window, false)
+
+        enableEdgeToEdge()
+
+        // Apply insets to your root layout
+        ViewCompat.setOnApplyWindowInsetsListener(binding.root) { view, windowInsets ->
+            val systemBars = windowInsets.getInsets(WindowInsetsCompat.Type.systemBars())
+            view.setPadding(
+                systemBars.left,
+                systemBars.top,
+                systemBars.right,
+                systemBars.bottom
+            )
+            windowInsets
+        }
+
         setupUI()
         setupObservers()
         loadData()
diff --git a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/ProfileFragment.kt b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/ProfileFragment.kt
index b527fd9..d1921f9 100644
--- a/app/src/main/java/com/alya/ecommerce_serang/ui/profile/ProfileFragment.kt
+++ b/app/src/main/java/com/alya/ecommerce_serang/ui/profile/ProfileFragment.kt
@@ -39,7 +39,6 @@ class ProfileFragment : Fragment() {
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
         sessionManager = SessionManager(requireContext())
-
     }
 
     override fun onCreateView(
diff --git a/app/src/main/res/color/bottom_nav_icon_color.xml b/app/src/main/res/color/bottom_nav_icon_color.xml
new file mode 100644
index 0000000..1da8b16
--- /dev/null
+++ b/app/src/main/res/color/bottom_nav_icon_color.xml
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:color="@color/bottom_navigation_icon_color_active" android:state_checked="true"/>
+    <item android:color="@color/bottom_navigation_icon_color_inactive" android:state_checked="false"/>
+</selector>
\ No newline at end of file
diff --git a/app/src/main/res/color/bottom_nav_text_color.xml b/app/src/main/res/color/bottom_nav_text_color.xml
new file mode 100644
index 0000000..481be1a
--- /dev/null
+++ b/app/src/main/res/color/bottom_nav_text_color.xml
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:color="@color/bottom_navigation_text_color_active" android:state_checked="true"/>
+    <item android:color="@color/bottom_navigation_text_color_inactive" android:state_checked="false"/>
+</selector>
\ No newline at end of file
diff --git a/app/src/main/res/drawable/bottom_nav_background.xml b/app/src/main/res/drawable/bottom_nav_background.xml
new file mode 100644
index 0000000..68362a6
--- /dev/null
+++ b/app/src/main/res/drawable/bottom_nav_background.xml
@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="utf-8"?>
+<shape xmlns:android="http://schemas.android.com/apk/res/android">
+    <solid android:color="@android:color/white"/>
+    <corners
+        android:topLeftRadius="20dp"
+        android:topRightRadius="20dp"/>
+    <stroke
+        android:width="1dp"
+        android:color="#E0E0E0"/>
+</shape>
\ No newline at end of file
diff --git a/app/src/main/res/drawable/outline_calendar_today_24.xml b/app/src/main/res/drawable/outline_calendar_today_24.xml
new file mode 100644
index 0000000..5ca556c
--- /dev/null
+++ b/app/src/main/res/drawable/outline_calendar_today_24.xml
@@ -0,0 +1,5 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android" android:height="24dp" android:tint="#211E1E" android:viewportHeight="24" android:viewportWidth="24" android:width="24dp">
+      
+    <path android:fillColor="@android:color/white" android:pathData="M20,3h-1L19,1h-2v2L7,3L7,1L5,1v2L4,3c-1.1,0 -2,0.9 -2,2v16c0,1.1 0.9,2 2,2h16c1.1,0 2,-0.9 2,-2L22,5c0,-1.1 -0.9,-2 -2,-2zM20,21L4,21L4,10h16v11zM20,8L4,8L4,5h16v3z"/>
+    
+</vector>
diff --git a/app/src/main/res/layout/activity_detail_product.xml b/app/src/main/res/layout/activity_detail_product.xml
index f9182d4..65458ad 100644
--- a/app/src/main/res/layout/activity_detail_product.xml
+++ b/app/src/main/res/layout/activity_detail_product.xml
@@ -5,7 +5,7 @@
     xmlns:tools="http://schemas.android.com/tools"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
-    android:background="@color/white"
+    android:theme="@style/Theme.Ecommerce_serang"
     tools:context=".ui.product.DetailProductActivity">
 
     <!-- Main Content -->
@@ -147,7 +147,8 @@
                         android:id="@+id/recyclerViewReviews"
                         android:layout_width="match_parent"
                         android:layout_height="wrap_content"
-                        android:layout_marginTop="8dp"
+                        android:layout_marginTop="4dp"
+                        android:layout_marginBottom="8dp"
                         app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
                         tools:itemCount="1"
                         tools:listitem="@layout/item_review" />
@@ -392,6 +393,7 @@
                         android:layout_width="match_parent"
                         android:layout_height="wrap_content"
                         android:layout_marginTop="16dp"
+                        android:layout_marginBottom="8dp"
                         android:orientation="horizontal"
                         app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"
                         tools:itemCount="3"
@@ -419,7 +421,6 @@
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:layout_gravity="bottom"
-        android:backgroundTint="@color/white"
         app:contentInsetStart="0dp">
 
         <LinearLayout
diff --git a/app/src/main/res/layout/activity_main.xml b/app/src/main/res/layout/activity_main.xml
index 0e10077..9c58777 100644
--- a/app/src/main/res/layout/activity_main.xml
+++ b/app/src/main/res/layout/activity_main.xml
@@ -6,38 +6,38 @@
     android:id="@+id/main"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
+    android:theme="@style/Theme.Ecommerce_serang"
     tools:context=".ui.MainActivity">
 
     <!-- NavHostFragment -->
     <androidx.fragment.app.FragmentContainerView
         android:id="@+id/nav_host_fragment"
-        android:layout_width="match_parent"
-        android:layout_height="match_parent"
-        app:layout_constraintTop_toTopOf="parent"
-        app:layout_constraintLeft_toLeftOf="parent"
-        app:layout_constraintRight_toRightOf="parent"
-        app:layout_constraintBottom_toTopOf="@id/bottom_navigation"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
         android:name="androidx.navigation.fragment.NavHostFragment"
+        app:layout_constraintTop_toTopOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintBottom_toTopOf="@id/bottom_navigation"
         app:defaultNavHost="true"
         app:navGraph="@navigation/nav_graph" />
 
-    <com.google.android.material.divider.MaterialDivider
-        android:id="@+id/divider"
-        android:layout_width="match_parent"
-        android:layout_height="1dp"
-        app:dividerColor="@color/gray_1"
-        app:layout_constraintBottom_toTopOf="@id/bottom_navigation" />
     <!-- BottomNavigationView -->
     <com.google.android.material.bottomnavigation.BottomNavigationView
         android:id="@+id/bottom_navigation"
         android:layout_width="0dp"
         android:layout_height="wrap_content"
+        android:background="@drawable/bottom_nav_background"
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintStart_toStartOf="parent"
         app:layout_constraintEnd_toEndOf="parent"
-        style="@style/Widget.Material3.BottomNavigationView"
         app:menu="@menu/bottom_navigation_menu"
-        app:itemIconTint="#489EC6"
-        app:itemIconSize="@dimen/m3_comp_navigation_bar_active_indicator_height" />
+        app:itemIconSize="32dp"
+        app:itemPaddingBottom="4dp"
+        app:itemTextAppearanceActive="@style/BottomNavigationTextStyle"
+        app:itemTextAppearanceInactive="@style/BottomNavigationTextStyle"
+        android:elevation="8dp"
+        app:itemIconTint="@color/bottom_nav_icon_color"
+        app:itemTextColor="@color/bottom_nav_text_color" />
 
-</androidx.constraintlayout.widget.ConstraintLayout>
+</androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/app/src/main/res/layout/activity_register.xml b/app/src/main/res/layout/activity_register.xml
index a23ce3e..6485770 100644
--- a/app/src/main/res/layout/activity_register.xml
+++ b/app/src/main/res/layout/activity_register.xml
@@ -5,7 +5,7 @@
     android:id="@+id/main"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
-    android:background="@color/white"
+    android:theme="@style/Theme.Ecommerce_serang"
     tools:context=".ui.auth.RegisterActivity">
 
     <LinearLayout
@@ -144,18 +144,24 @@
             android:textSize="18sp"
             android:text="@string/birth_date"/>
 
+
         <com.google.android.material.textfield.TextInputLayout
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
+            android:layout_marginTop="8dp"
             android:layout_marginBottom="12dp"
-            style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.ExposedDropdownMenu">
+            style="@style/SharpedBorderStyleOutline"
+            app:endIconMode="custom"
+            app:endIconDrawable="@drawable/outline_calendar_today_24">
 
-            <AutoCompleteTextView
+            <com.google.android.material.textfield.TextInputEditText
                 android:id="@+id/et_birth_date"
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
-                android:hint="@string/hint_birth_date"
-                android:inputType="date"/>
+                android:hint="Pilih tanggal"
+                android:focusable="false"
+                android:clickable="true"
+                android:minHeight="50dp"/>
         </com.google.android.material.textfield.TextInputLayout>
 
         <TextView
diff --git a/app/src/main/res/layout/fragment_home.xml b/app/src/main/res/layout/fragment_home.xml
index 1ce0c9b..be25e39 100644
--- a/app/src/main/res/layout/fragment_home.xml
+++ b/app/src/main/res/layout/fragment_home.xml
@@ -4,6 +4,7 @@
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     xmlns:app="http://schemas.android.com/apk/res-auto"
+    android:theme="@style/Theme.Ecommerce_serang"
     tools:context=".ui.home.HomeFragment">
 
     <include
@@ -36,6 +37,7 @@
                 android:layout_marginTop="4dp"
                 android:orientation="vertical"
                 app:layout_constraintTop_toTopOf="parent"
+                android:background="@drawable/banner_default"
                 tools:layout_editor_absoluteX="16dp" />
 
             <TextView
@@ -43,9 +45,10 @@
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:layout_marginStart="32dp"
-                android:layout_marginTop="24dp"
+                android:layout_marginTop="16dp"
                 android:text="@string/fragment_home_categories"
-                android:textColor="@color/black"
+                android:textColor="@color/blue_500"
+                android:fontFamily="@font/dmsans_bold"
                 android:textSize="22sp"
                 app:layout_constraintStart_toStartOf="parent"
                 app:layout_constraintTop_toBottomOf="@id/banners" />
@@ -58,8 +61,8 @@
                 android:layout_marginEnd="32dp"
                 android:text="@string/show_all"
                 android:textAllCaps="false"
-                android:textColor="@color/blue1"
-                android:textSize="16sp"
+                android:textColor="@color/blue_600"
+                android:textSize="14sp"
                 app:layout_constraintBaseline_toBaselineOf="@id/categoriesText"
                 app:layout_constraintEnd_toEndOf="parent" />
 
@@ -67,7 +70,7 @@
                 android:id="@+id/categories"
                 android:layout_width="match_parent"
                 android:layout_height="wrap_content"
-                android:layout_marginTop="19dp"
+                android:layout_marginTop="8dp"
                 android:clipChildren="false"
                 android:clipToPadding="false"
                 android:orientation="horizontal"
@@ -77,16 +80,15 @@
                 tools:layout_editor_absoluteX="0dp"
                 tools:listitem="@layout/item_category_home" />
 
-
-
             <TextView
                 android:id="@+id/new_products_text"
                 android:layout_width="wrap_content"
                 android:layout_height="wrap_content"
                 android:layout_marginStart="32dp"
-                android:layout_marginTop="24dp"
+                android:layout_marginTop="16dp"
                 android:text="@string/sold_product_text"
-                android:textColor="@color/black"
+                android:textColor="@color/blue_500"
+                android:fontFamily="@font/dmsans_bold"
                 android:textSize="22sp"
                 app:layout_constraintStart_toStartOf="parent"
                 app:layout_constraintTop_toBottomOf="@id/categories" />
@@ -98,7 +100,7 @@
                 android:layout_marginEnd="32dp"
                 android:text="@string/show_all"
                 android:textAllCaps="false"
-                android:textColor="@color/blue1"
+                android:textColor="@color/blue_600"
                 android:textSize="16sp"
                 app:layout_constraintBaseline_toBaselineOf="@id/new_products_text"
                 app:layout_constraintEnd_toEndOf="parent" />
diff --git a/app/src/main/res/layout/fragment_profile.xml b/app/src/main/res/layout/fragment_profile.xml
index afbd7ec..22363c9 100644
--- a/app/src/main/res/layout/fragment_profile.xml
+++ b/app/src/main/res/layout/fragment_profile.xml
@@ -5,6 +5,7 @@
     android:layout_height="match_parent"
     android:background="@color/white"
     xmlns:app="http://schemas.android.com/apk/res-auto"
+    android:theme="@style/Theme.Ecommerce_serang"
     tools:context=".ui.profile.ProfileFragment">
 
     <!-- Profile Header -->
@@ -320,12 +321,5 @@
         app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintTop_toTopOf="@id/tvLogout" />
 
-    <!-- Bottom Navigation -->
-    <com.google.android.material.bottomnavigation.BottomNavigationView
-        android:id="@+id/bottomNavigation"
-        android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        android:background="@color/white"
-        app:layout_constraintBottom_toBottomOf="parent" />
 
 </androidx.constraintlayout.widget.ConstraintLayout>
\ No newline at end of file
diff --git a/app/src/main/res/layout/view_search.xml b/app/src/main/res/layout/view_search.xml
index 2a2a3c9..3f7d5b6 100644
--- a/app/src/main/res/layout/view_search.xml
+++ b/app/src/main/res/layout/view_search.xml
@@ -12,6 +12,7 @@
         android:hint="@string/fragment_home_search"
         android:textColor="@color/soft_gray"
         android:textSize="16sp"
+        android:fontFamily="@font/dmsans_regular"
         android:layout_marginStart="8dp"
         android:drawablePadding="8dp"
         android:paddingHorizontal="25dp"
diff --git a/app/src/main/res/values/colors.xml b/app/src/main/res/values/colors.xml
index 8aa4f32..25b40eb 100644
--- a/app/src/main/res/values/colors.xml
+++ b/app/src/main/res/values/colors.xml
@@ -41,4 +41,9 @@
     <color name="gray_1">#E8ECF2</color>
     <color name="soft_gray">#7D8FAB</color>
     <color name="blue1">#489EC6</color>
+
+    <color name="bottom_navigation_icon_color_active">#489EC6</color>
+    <color name="bottom_navigation_icon_color_inactive">#8E8E8E</color>
+    <color name="bottom_navigation_text_color_active">#489EC6</color>
+    <color name="bottom_navigation_text_color_inactive">#8E8E8E</color>
 </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 06b23b1..dcf0226 100644
--- a/app/src/main/res/values/styles.xml
+++ b/app/src/main/res/values/styles.xml
@@ -25,4 +25,39 @@
         <item name="cornerRadius">8dp</item>
         <item name="backgroundTint">@color/blue_500</item>
     </style>
+
+    <style name="SharpedBorderStyleOutline">
+        <item name="boxStrokeColor">@color/black_300</item>
+        <item name="boxStrokeWidth">1dp</item>
+        <item name="boxCornerRadiusTopStart">4dp</item>
+        <item name="boxCornerRadiusTopEnd">4dp</item>
+        <item name="boxCornerRadiusBottomStart">4dp</item>
+        <item name="boxCornerRadiusBottomEnd">4dp</item>
+        <item name="android:textColorHint">@color/black_300</item>
+    </style>
+
+        <style name="CustomBottomNavActiveIndicator" parent="@style/Widget.Material3.BottomNavigationView.ActiveIndicator">
+            <item name="android:width">40dp</item>
+            <item name="android:height">4dp</item>
+            <item name="shapeAppearanceOverlay">@style/CustomActiveIndicatorShape</item>
+        </style>
+
+        <style name="CustomActiveIndicatorShape">
+            <item name="cornerSize">2dp</item>
+        </style>
+
+    <style name="BottomNavigationTextStyle" parent="TextAppearance.MaterialComponents.Caption">
+        <item name="android:textSize">14sp</item>
+        <item name="fontFamily">@font/dmsans_semibold</item>
+        <item name="android:paddingTop">8dp</item>
+        <item name="android:layout_marginTop">4dp</item>
+    </style>
+
+    <style name="BottomAppBar">
+        <item name="strokeColor">@color/light_gray</item>
+        <item name="strokeWidth">2dp</item>
+        <item name="color">@color/white</item>
+        <item name="cornerRadius">8dp</item>
+        <item name="backgroundTint">@color/white</item>
+    </style>
 </resources>
\ No newline at end of file
diff --git a/app/src/main/res/values/themes.xml b/app/src/main/res/values/themes.xml
index 0da93ba..24782af 100644
--- a/app/src/main/res/values/themes.xml
+++ b/app/src/main/res/values/themes.xml
@@ -1,16 +1,45 @@
 <resources>
     <!-- Base application theme. -->
     <style name="Theme.Ecommerce_serang" parent="Theme.Material3.Light.NoActionBar">
-        <!-- Customize your light theme here. -->
+        <!-- Primary Color Customization -->
         <item name="colorPrimary">@color/blue_500</item>
-        <item name="colorPrimaryDark">@color/white</item>
-        <item name="colorAccent">@color/black</item>
+        <item name="colorPrimaryVariant">@color/blue_600</item>
+        <item name="colorOnPrimary">@color/white</item>
+
+        <!-- Secondary Color Customization -->
+        <item name="colorSecondary">@color/blue_500</item>
+        <item name="colorSecondaryVariant">@color/blue_600</item>
+        <item name="colorOnSecondary">@color/white</item>
+
+        <!-- Surface and Background Colors -->
         <item name="colorSurface">@color/white</item>
         <item name="colorOnSurface">@color/black</item>
-        <item name="colorPrimaryContainer">@color/blue_500</item>
-        <item name="colorOnPrimaryContainer">@color/white</item>
+        <item name="android:colorBackground">@color/white</item>
+<!--        <item name="colorBackground">@color/white</item>-->
+
+        <!-- Container Colors -->
+        <item name="colorPrimaryContainer">@color/blue_50</item>
+        <item name="colorOnPrimaryContainer">@color/blue_500</item>
+
+        <!-- Status Bar and Navigation Bar -->
+
+        <!-- Remove Content Insets -->
         <item name="android:contentInsetStart">0dp</item>
         <item name="android:contentInsetLeft">0dp</item>
+
+        <!-- Bottom Navigation Specific -->
+        <item name="bottomNavigationStyle">@style/Widget.MaterialComponents.BottomNavigationView.Colored</item>
+        <item name="bottomAppBarStyle">@style/BottomAppBar</item>
+
+
+        <!-- Remove Purple Accent Color -->
+        <item name="colorAccent">@color/blue_500</item>
+        <item name="android:windowTranslucentStatus">true</item>
+        <item name="android:windowTranslucentNavigation">true</item>
+        <item name="android:windowDrawsSystemBarBackgrounds">true</item>
+        <item name="android:statusBarColor">@android:color/transparent</item>
+        <item name="android:navigationBarColor">@android:color/transparent</item>
+<!--        <item name="android:windowLayoutInDisplayCutoutMode">shortEdges</item>-->
     </style>
 
     <!-- Text Styles -->