1 files changed, 25 insertions, 6 deletions
diff --git a/bskyweb/templates/base.html b/bskyweb/templates/base.html
index 57ad064f8..50dbaa24b 100644
--- a/bskyweb/templates/base.html
+++ b/bskyweb/templates/base.html
@@ -39,30 +39,49 @@
       height: calc(100% + env(safe-area-inset-top));
     }
 
+    /* Remove autofill styles on Webkit */
+    input:-webkit-autofill,
+    input:-webkit-autofill:hover, 
+    input:-webkit-autofill:focus,
+    textarea:-webkit-autofill,
+    textarea:-webkit-autofill:hover,
+    textarea:-webkit-autofill:focus,
+    select:-webkit-autofill,
+    select:-webkit-autofill:hover,
+    select:-webkit-autofill:focus {
+      border: 0;
+      -webkit-text-fill-color: transparent;
+      -webkit-box-shadow: none;
+    }
+    /* Force left-align date/time inputs on iOS mobile */
+    input::-webkit-date-and-time-value {
+      text-align: left;
+    }
+
     /* Color theming */
     :root {
       --text: black;
       --background: white;
-      --backgroundLight: #F3F3F8;
+      --backgroundLight: hsl(211, 20%, 95%);
     }
     html.colorMode--dark {
       --text: white;
-      --background: black;
-      --backgroundLight: #26272D;
+      --background: hsl(211, 20%, 4%);
+      --backgroundLight: hsl(211, 20%, 20%);
       color-scheme: dark;
     }
     @media (prefers-color-scheme: light) {
       html.colorMode--system {
         --text: black;
         --background: white;
-        --backgroundLight: #F3F3F8;
+        --backgroundLight: hsl(211, 20%, 95%);
       }
     }
     @media (prefers-color-scheme: dark) {
       html.colorMode--system {
         --text: white;
-        --background: black;
-        --backgroundLight: #26272D;
+        --background: hsl(211, 20%, 4%);
+        --backgroundLight: hsl(211, 20%, 20%);
         color-scheme: dark;
       }
     }