Repository: syncthing/syncthing (language: go)

Issue:
Firefox, dark theme: device ID is hard to read
### What happened?

Actions -> Show ID -> ID is slightly hard to read because it is printed in grey on black.

Screenshot:

![2024-10-05 20 10 50](https://github.com/user-attachments/assets/674df126-aea7-4fe7-a7cd-ba75b03e9689)

Cf. ##6115.

The remedy would be to use a whiter foreground font.

### Syncthing version

v1.27.12

### Platform & operating system

Two Linux PCs, one Windows PC

### Browser version

Firefox (release version) and Firefox ESR

### Relevant log output

_No response_

EDIT: The theme set _within_ Syncthing is 'Default' on some of the affected PCs and 'Dark' on the other.


Discussion / hints:

Fix patch:
diff --git a/gui/black/assets/css/theme.css b/gui/black/assets/css/theme.css
index 1e280a952a0..ae3e5652570 100644
--- a/gui/black/assets/css/theme.css
+++ b/gui/black/assets/css/theme.css
@@ -224,7 +224,6 @@ code.ng-binding{
 }
 
 .well, .form-control[readonly="readonly"], .popover { /* read-only fields*/
-    color: #666 !important;
     border-color: #444 !important;
     background-color: #111 !important;
 }
diff --git a/gui/dark/assets/css/theme.css b/gui/dark/assets/css/theme.css
index 26ab0f89821..0876bb08a81 100644
--- a/gui/dark/assets/css/theme.css
+++ b/gui/dark/assets/css/theme.css
@@ -228,7 +228,6 @@ code.ng-binding{
 }
 
 .well, .form-control[readonly="readonly"], .popover { /* read-only fields*/
-    color: #666 !important;
     border-color: #424242 !important;
     background-color: #3B3B3B !important;
 }
@@ -289,4 +288,4 @@ code.ng-binding{
 /* Remote Devices 'connection type'-icon color set to #aaa */
 .reception {
     filter: invert(77%) sepia(0%) saturate(724%) hue-rotate(146deg) brightness(91%) contrast(85%);
-}
\ No newline at end of file
+}
diff --git a/gui/default/syncthing/device/idqrModalView.html b/gui/default/syncthing/device/idqrModalView.html
index c988ae299c7..2398c9b301c 100644
--- a/gui/default/syncthing/device/idqrModalView.html
+++ b/gui/default/syncthing/device/idqrModalView.html
@@ -1,6 +1,6 @@
 <modal id="idqr" status="info" icon="fas fa-qrcode" heading="{{'Device Identification' | translate}} - {{deviceName(currentDevice)}}" large="yes" closeable="yes">
   <div class="modal-body text-center">
-    <div class="well well-sm text-monospace select-on-click">{{currentDevice.deviceID}}</div>
+    <div class="well well-sm text-monospace select-on-click"><strong>{{currentDevice.deviceID}}</strong></div>
     <div ng-if="currentDevice.deviceID">
       <img class="img-thumbnail" ng-src="qr/?text={{currentDevice.deviceID}}" height="328" width="328" alt="{{'QR code' | translate}}" />
       <div class="btn-group-vertical" style="vertical-align: top;">


Test patch: