fix(dropdown): hardcoded bg color in dark mode (temp) (#1059)

* fix: temporary fix - hardcoded dark mode bg color in dropdwon

* test: update visual tests

* fix: simulate hover opacity, update tests

* fix: format

packages/components/src/components/dropdown/dropdown.css

@@ -135,6 +135,7 @@ scale-dropdown {
   border-color: var(--border-color-hover);
   background-color: var(--telekom-color-ui-outlined-fill-hovered);
 }
+
 .dropdown:not(.dropdown--disabled).dropdown--status-error
   .input__dropdown:hover {
   border-color: var(--telekom-color-functional-danger-hovered);
@@ -226,3 +227,25 @@ scale-dropdown {
   color: var(--color-disabled);
   background: var(--background-disabled);
 }
+
+/* Tokens exceptionally hard-coded, instead of using the component variables,
+to fix bug in Firefox/Windows, see https://github.com/telekom/scale/issues/1018) */
+[data-mode='dark'] .dropdown .input__dropdown {
+  background-color: var(--telekom-color-background-canvas);
+}
+
+[data-mode='dark']
+  .dropdown:not(.dropdown--disabled):not(.dropdown--status-error)
+  .input__dropdown:hover {
+  background-color: #1b1b1b;
+}
+
+[data-mode='dark']
+  .dropdown:not(.dropdown--disabled).dropdown--status-error
+  .input__dropdown:hover {
+  background-color: #1b1b1b;
+}
+
+[data-mode='dark'] .dropdown--disabled .input__dropdown {
+  background-color: var(--telekom-color-background-canvas);
+}