fix time selector in dark mode

lib/karafka/web/pro/ui/views/explorer/explorer/partition/_time_selector.erb

@@ -1,14 +1,16 @@
 <%# This code is part of Karafka Pro, a commercial component not licensed under LGPL. %>
 <%# See LICENSE for details. %>
 
-<input
-  type="image"
-  src="<%= asset_path('images/calendar.svg') %>"
-  width="45"
-  height="32"
-  class="btn-action p-1 opacity-60"
-  id="offset-lookup-datepicker"
-  value=""
-  title="Select a point in time to browse the topic partition data"
-  data-target="<%= target %>"
-/>
+<div class="datepicker-input-wrapper">
+  <input
+    type="image"
+    src="<%= asset_path('images/calendar.svg') %>"
+    width="45"
+    height="32"
+    class="btn-action p-1 opacity-60"
+    id="offset-lookup-datepicker"
+    value=""
+    title="Select a point in time to browse the topic partition data"
+    data-target="<%= target %>"
+  />
+</div>

lib/karafka/web/ui/public/stylesheets/application.css

@@ -56,3 +56,15 @@ table td.commands-inline-3 {
 .drawer-side.collapsed:hover .btn-toggle-nav-collapsed::after {
   content: 'Expand';
 }
+
+.datepicker-input-wrapper {
+  margin-bottom: -5px;
+}
+
+[data-theme="dark"] .datepicker-input-wrapper input[type="image"]:not(:hover) {
+  filter: invert(1) brightness(0.7);
+}
+
+[data-theme="dark"] .datepicker-input-wrapper input[type="image"]:hover {
+  opacity: 1;
+}