Bug 1734297 - Don't use native <input> appearance on Windows dark mode. r=desktop-theme-reviewers,dao

Also, change XUL button borders to match HTML <input>s and <button>s.

Differential Revision: https://phabricator.services.mozilla.com/D127633

toolkit/themes/windows/global/button.css

@@ -16,7 +16,7 @@ button {
   color: ButtonText;
   background-color: ButtonFace;
   text-shadow: none;
-  border: 1px solid ThreeDDarkShadow;
+  border: 1px solid ThreeDLightShadow;
   padding: 2px 3px;
   /* TODO: In Windows 11 perhaps we want some border-radius */
 }

toolkit/themes/windows/global/global.css

@@ -196,6 +196,22 @@ html|input {
   margin: 2px 4px;
 }
 
+@media (-moz-toolbar-prefers-color-scheme: dark) {
+  html|input {
+    appearance: none;
+    /* HTML inputs have 2px border and 1px padding by default (via forms.css).
+     * So to keep the same size as in light mode, but make the border 1px,
+     * tweak the padding to be 2px. */
+    border-style: solid;
+    border-width: 1px;
+    padding: 2px;
+  }
+  html|input:focus-visible {
+    outline: none;
+    border-color: currentColor;
+  }
+}
+
 /* Notification popups */
 
 %include ../../shared/notification-popup.inc.css

toolkit/themes/windows/global/search-textbox.css

@@ -18,6 +18,16 @@
   color: FieldText;
 }
 
+@media (-moz-toolbar-prefers-color-scheme: dark) {
+  :host {
+    appearance: none;
+    border: 1px solid ThreeDLightShadow;
+  }
+  :host(:focus-within) {
+    border-color: currentColor;
+  }
+}
+
 html|input {
   border: none;
   padding: 0 1px;