Fix dark theme bugs

Updates #5375

Squashed commit of the following:

commit 40666b010697381e11b3a36d9c2ed1c1507f27ed
Author: Arseny Lisin <a.lisin@adguard.com>
Date:   Tue Jan 31 18:34:06 2023 +0200

    Review fix

commit 44f3d6095bc9b426e8142f8c9d915a1441f3d791
Author: Arseny Lisin <a.lisin@adguard.com>
Date:   Tue Jan 31 17:02:38 2023 +0200

    Clear

commit 44274ba54c9ff2bd2caf5fa69bf06c587f8858e5
Author: Arseny Lisin <a.lisin@adguard.com>
Date:   Tue Jan 31 13:25:01 2023 +0200

    Clear

commit 8b48c523cbbe3f73160331a9c516388c7965a7a2
Author: Arseny Lisin <a.lisin@adguard.com>
Date:   Tue Jan 31 12:14:37 2023 +0200

    Review fix

commit 3b8cd94cdd8d3fc90cdc27053964489414055cc9
Author: Arseny Lisin <a.lisin@adguard.com>
Date:   Mon Jan 30 16:13:15 2023 +0200

    Fix query log popup bg

commit 14d4c87164200f7c918bac02c9cc5f1cffb83932
Author: Arseny Lisin <a.lisin@adguard.com>
Date:   Mon Jan 30 15:03:06 2023 +0200

    revert icons

commit 98b042726e1510f85c9cf5a4caba2d56885f120b
Author: Arseny Lisin <a.lisin@adguard.com>
Date:   Mon Jan 30 14:45:35 2023 +0200

    Fix dark theme bugs

client/src/components/Logs/Cells/IconTooltip.css

@@ -5,7 +5,7 @@
     border-radius: 4px !important;
     pointer-events: auto !important;
     background-color: var(--ctrl-bgcolor);
-    color: var(--scolor);
+    color: var(--mcolor);
     z-index: 102;
     overflow-y: auto;
     max-height: 100%;

client/src/components/Logs/Logs.css

@@ -24,6 +24,12 @@
     --option-border-radius: 4px;
 }
 
+[data-theme="dark"] {
+    --red: rgba(223, 56, 18, 0.25);
+    --green-pale: rgba(103, 178, 121, 0.25);
+    --yellow: rgba(247, 181, 0, 0.2);
+}
+
 .logs__text {
     padding: 0 1px;
     text-overflow: ellipsis;
@@ -36,6 +42,14 @@
     line-height: 1.5rem;
 }
 
+[data-theme="dark"] .logs__text a {
+    color: var(--gray-f3);
+}
+
+[data-theme="dark"] .logs__text a:hover {
+    color: var(--gray-f3);
+}
+
 .logs__text--bold {
     font-weight: 600;
 }
@@ -66,6 +80,10 @@
     border-radius: 4px;
 }
 
+[data-theme=dark] .icon--selected {
+    opacity: 0.75;
+}
+
 .text-pre {
     white-space: pre-wrap !important;
     overflow-wrap: break-word;
@@ -205,6 +223,12 @@
     position: relative;
 }
 
+@media screen and (min-width: 1025px) {
+    .logs__cell--client {
+        width: 13rem;
+    }
+}
+
 .logs__cell--header__container > .logs__cell--header__item {
     border-right: 0;
     font-size: 1rem;
@@ -340,6 +364,10 @@
     overflow: hidden;
 }
 
+[data-theme="dark"] .tooltip-custom__container .button-action--arrow-option:not(:disabled):hover {
+    background: var(--ctrl-dropdown-bgcolor-focus);
+}
+
 .button-action--arrow-option-container {
     overflow: visible;
     transform-origin: left;
@@ -482,6 +510,10 @@
     color: var(--green79);
 }
 
+[data-theme="dark"] .logs__question.icon--lightgray {
+    color: var(--gray-f3);
+}
+
 @media (max-width: 1024px) {
     .logs__question {
         display: none;
@@ -491,3 +523,8 @@
 .logs__modal {
     max-width: 720px;
 }
+
+.logs__modal-wrap {
+    padding: 1rem 1.5rem;
+    background-color: var(--card-bgcolor);
+}

client/src/components/Logs/index.js

@@ -195,11 +195,11 @@ const Logs = () => {
             onRequestClose={closeModal}
             style={{
                 content: {
-                    width: '100%',
+                    width: 'calc(100% - 32px)',
                     height: 'fit-content',
                     left: '50%',
                     top: 47,
-                    padding: '1rem 1.5rem 1rem',
+                    padding: '0',
                     maxWidth: '720px',
                     transform: 'translateX(-50%)',
                 },