For #23374 - Update Layer 1 and Layer 3 to match design system

app/src/main/java/org/mozilla/fenix/theme/FirefoxTheme.kt

@@ -41,9 +41,9 @@ object FirefoxTheme {
 }
 
 private val darkColorPalette = FirefoxColors(
-    layer1 = PhotonColors.DarkGrey80,
+    layer1 = PhotonColors.DarkGrey60,
     layer2 = PhotonColors.DarkGrey30,
-    layer3 = PhotonColors.DarkGrey60,
+    layer3 = PhotonColors.DarkGrey30,
     layerAccent = PhotonColors.Violet40,
     layerNonOpaque = PhotonColors.Violet50A32,
     scrim = PhotonColors.DarkGrey05A45,
@@ -98,9 +98,9 @@ private val darkColorPalette = FirefoxColors(
 )
 
 private val lightColorPalette = FirefoxColors(
-    layer1 = PhotonColors.LightGrey20,
+    layer1 = PhotonColors.LightGrey10,
     layer2 = PhotonColors.White,
-    layer3 = PhotonColors.LightGrey10,
+    layer3 = PhotonColors.LightGrey20,
     layerAccent = PhotonColors.Ink20,
     layerNonOpaque = PhotonColors.Violet70A12,
     scrim = PhotonColors.DarkGrey05A45,
@@ -217,13 +217,13 @@ class FirefoxColors(
 ) {
     // Layers
 
-    // Default Screen, Search, Frontlayer background
+    // Default Screen background, Frontlayer background, App Bar Top, App Bar Bottom, Frontlayer header
     var layer1 by mutableStateOf(layer1)
         private set
     // Card background, Menu background, Dialog, Banner
     var layer2 by mutableStateOf(layer2)
         private set
-    // App Bar Top, App Bar Bottom, Frontlayer header
+    // Search
     var layer3 by mutableStateOf(layer3)
         private set
     // App Bar Top (edit), Text Cursor, Selected Tab Check

app/src/main/res/values-night/colors.xml

@@ -6,12 +6,12 @@
     <!-- Design system color variables -->
 
     <!-- Layers -->
-    <!-- Default Screen, Search, Frontlayer background -->
+    <!-- Default Screen background, Frontlayer background, App Bar Top, App Bar Bottom, Frontlayer header -->
-    <color name="fx_mobile_layer_color_1">@color/photonDarkGrey80</color>
+    <color name="fx_mobile_layer_color_1">@color/photonDarkGrey60</color>
     <!-- Card background, Menu background, Dialog, Banner -->
     <color name="fx_mobile_layer_color_2">@color/photonDarkGrey30</color>
-    <!-- App Bar Top, App Bar Bottom, Frontlayer header -->
+    <!-- Search -->
-    <color name="fx_mobile_layer_color_3" tools:ignore="UnusedResources">@color/photonDarkGrey60</color>
+    <color name="fx_mobile_layer_color_3" tools:ignore="UnusedResources">@color/photonDarkGrey30</color>
     <!-- App Bar Top (edit), Text Cursor, Selected Tab Check -->
     <color name="fx_mobile_layer_color_accent">@color/photonViolet40</color>
     <!-- Selected tab -->

app/src/main/res/values/colors.xml

@@ -6,12 +6,12 @@
     <!-- Design system color variables -->
 
     <!-- Layers -->
-    <!-- Default Screen, Search, Frontlayer background -->
+    <!-- Default Screen background, Frontlayer background, App Bar Top, App Bar Bottom, Frontlayer header -->
-    <color name="fx_mobile_layer_color_1">@color/photonLightGrey20</color>
+    <color name="fx_mobile_layer_color_1">@color/photonLightGrey10</color>
     <!-- Card background, Menu background, Dialog, Banner -->
     <color name="fx_mobile_layer_color_2">@color/photonWhite</color>
-    <!-- App Bar Top, App Bar Bottom, Frontlayer header -->
+    <!-- Search -->
-    <color name="fx_mobile_layer_color_3" tools:ignore="UnusedResources">@color/photonLightGrey10</color>
+    <color name="fx_mobile_layer_color_3" tools:ignore="UnusedResources">@color/photonLightGrey20</color>
     <!-- App Bar Top (edit), Text Cursor, Selected Tab Check -->
     <color name="fx_mobile_layer_color_accent">@color/photonInk20</color>
     <!-- Selected tab -->