diff --git a/css/base/adguard/adguard-base.css b/css/base/adguard/adguard-base.css
index c668d817..1fd3fc58 100644
--- a/css/base/adguard/adguard-base.css
+++ b/css/base/adguard/adguard-base.css
@@ -392,7 +392,7 @@ h6,
 }
 
 .service__icon {
-    color: #eee;
+    color: var(--text);
 }
 
 /* LOGS */
diff --git a/css/base/bazarr/bazarr-base.css b/css/base/bazarr/bazarr-base.css
index ac95715c..96afce11 100644
--- a/css/base/bazarr/bazarr-base.css
+++ b/css/base/bazarr/bazarr-base.css
@@ -133,7 +133,7 @@ label,
 .header-container input[type=text] {
     padding: 0;
     transition: none;
-    color: #fff;
+    color: var(--text-hover);
     border-radius: 0;
     border: none;
     border-bottom: 1px solid rgba(255, 255, 255, .3) !important;
@@ -142,13 +142,13 @@ label,
 
 .header-container input[type=text]:focus {
     box-shadow: none;
-    color: #fff;
+    color: var(--text-hover);
     background-color: transparent !important;
     border-color: rgb(var(--accent-color)) !important;
 }
 
 .form-control {
-    color: #FFF;
+    color: var(--text-hover);
     background-color: rgba(255, 255, 255, 0.08);
     border: 1px solid rgba(255, 255, 255, 0.08);
 }
@@ -158,14 +158,14 @@ label,
     border-color: rgba(255, 255, 255, 0.25) !important;
     outline: 0;
     box-shadow: none;
-    color: #fff;
+    color: var(--text-hover);
 }
 
 .form-control:disabled,
 .form-control[readonly] {
     background-color: rgb(255 255 255 / 15%);
     opacity: .7;
-    color: #fff;
+    color: var(--text-hover);
     border: 1px solid rgb(255 255 255 / 15%);
 }
 
@@ -175,11 +175,11 @@ label,
 }
 
 .form-group i {
-    color: #ffffff;
+    color: var(--text-hover);
 }
 
 .bootstrap-tagsinput {
-    color: #eee;
+    color: var(--text);
     background-color: rgba(0, 0, 0, .25) !important;
     border: 1px solid transparent !important;
 
@@ -484,7 +484,7 @@ hr {
 }
 
 .modal-content .badge-secondary {
-    color: #fff;
+    color: var(--text-hover);
     background-color: var(--accent-color);
     padding: 5px;
 }
@@ -498,13 +498,13 @@ hr {
     font-size: 1.5rem;
     font-weight: 700;
     line-height: 1;
-    color: #eee;
-    text-shadow: 0 1px 0 #eee;
+    color: var(--text);
+    text-shadow: 0 1px 0 var(--text);
     opacity: .5;
 }
 
 .close:hover {
-    color: #fff !important;
+    var(--text) !important;
     text-decoration: none;
 }
 
@@ -655,7 +655,7 @@ hr {
 }
 
 .custom-control-input:not(:disabled):active~.custom-control-label:before {
-    color: #fff;
+    color: var(--text-hover);
     background-color: rgb(var(--accent-color));
     border-color: rgb(var(--accent-color));
 }
@@ -727,7 +727,7 @@ input {
 .custom-selector .selector__control {
     background-color: rgba(0, 0, 0, 0.25);
     border-color: rgba(0, 0, 0, 0) !important;
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class$="-singleValue"],
@@ -762,13 +762,13 @@ input {
 
 .custom-selector .selector__option--is-focused {
     background-color: rgba(var(--accent-color), .2);
-    color: #fff;
+    color: var(--text-hover);
 }
 
 .custom-selector .selector__option--is-focused:active,
 .custom-selector .selector__option--is-focused:focus {
     background-color: rgba(var(--accent-color), .2);
-    color: #fff;
+    color: var(--text-hover);
 }
 
 .custom-selector .selector__option--is-selected {
diff --git a/css/base/bitwarden/bitwarden-base.css b/css/base/bitwarden/bitwarden-base.css
index cf753f7c..bb2ae99f 100644
--- a/css/base/bitwarden/bitwarden-base.css
+++ b/css/base/bitwarden/bitwarden-base.css
@@ -130,7 +130,7 @@ html[class*="theme_"] .card-header,
 
 html[class*="theme_"] .card-header {
     background-color: rgb(0 0 0 / 45%);
-    color: #fff;
+    color: var(--text-hover);
 }
 
 .card {
@@ -164,7 +164,7 @@ html[class*="theme_"] .password-number {
 }
 
 html[class*="theme_"] .password-letter {
-    color: white;
+    color: var(--text-hover);
 }
 
 html[class*="theme_"] app-vault-groupings .card .card-body a,
@@ -215,7 +215,7 @@ html[class*="theme_"] .close {
 
 .close,
 .close:hover {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 .close:focus {
@@ -256,7 +256,7 @@ html[class*="theme_"] .close {
 
 .btn-primary,
 .swal2-popup .swal2-actions button.swal2-confirm {
-    color: #fff;
+    color: var(--text-hover);
     background-color: var(--button-color);
     border-color: var(--button-color);
 }
@@ -318,7 +318,7 @@ html[class*="theme_"] .navbar .dropdown-menu .dropdown-item-text {
 html[class*="theme_"] .dropdown-menu,
 html[class*="theme_"] .dropdown-item {
     background: #1f1f1f;
-    color: #fff;
+    color: var(--text-hover);
 }
 
 html[class*="theme_"] .dropdown-item,
@@ -349,7 +349,7 @@ html[class*="theme_"] app-org-vault-groupings .card #search,
 html[class*="theme_"] .groupings .card #search {
     background-color: transparent;
     border-color: rgb(var(--accent-color));
-    color: #fff;
+    color: var(--text-hover);
 }
 
 /* SETTINGS */
@@ -561,7 +561,7 @@ html[class*="theme_"] .org-nav .nav-tabs a:not(.active) {
 }
 
 app-vault-groupings .card .card-body a:hover.text-muted {
-    color: #fff !important;
+    color: var(--text-hover) !important;
     opacity: 1 !important;
 }
 
@@ -656,7 +656,7 @@ html[class*="theme_"] .groupings .card .card-body a {
 
 .page-item.active .page-link {
     z-index: 3;
-    color: #fff;
+    color: var(--text-hover);
     background-color: var(--button-color);
     border-color: var(--button-color);
 }
diff --git a/css/base/deluge/deluge-base.css b/css/base/deluge/deluge-base.css
index 9f7c391a..915924f4 100644
--- a/css/base/deluge/deluge-base.css
+++ b/css/base/deluge/deluge-base.css
@@ -28,7 +28,7 @@
  }
 
  input {
-     color: #FFF !important;
+     color: var(--text-hover) !important;
  }
 
  /* scroller */
@@ -78,7 +78,7 @@
  }
 
  .x-item-disabled {
-     color: #aaaaaa;
+     color: var(--text-muted)
  }
 
  .x-item-disabled * {
@@ -86,16 +86,16 @@
  }
 
  .x-splitbar-proxy {
-     background-color: #aaa;
+     background-color: var(--text)
  }
 
  .x-color-palette a {
-     border-color: #fff;
+     border-color: var(--text-hover)
  }
 
  .x-color-palette a:hover,
  .x-color-palette a.x-color-palette-sel {
-     border-color: #CFCFCF;
+     border-color: var(--text);
      background-color: #eaeaea;
  }
 
@@ -1337,7 +1337,7 @@
  }
 
  .x-pivotgrid .x-grid3-row-headers table td {
-     background: #EEE url(../images/default/grid/grid3-rowheader.gif) repeat-x left top;
+     background: var(--text)  url(../images/default/grid/grid3-rowheader.gif) repeat-x left top;
      border-left: 1px solid;
      border-right: 1px solid;
      border-left-color: #EEE;
@@ -1539,12 +1539,12 @@
  .x-date-left,
  .x-date-right {
      //background-image: url(../images/gray/shared/hd-sprite.gif);
-     color: #fff;
+     color: var(--text-hover);
      font: bold 11px 'Roboto', "sans serif", tahoma, verdana, helvetica;
  }
 
  .x-date-middle .x-btn .x-btn-text {
-     color: #fff;
+    color: var(--text-hover);
  }
 
  .x-panel-tbar .x-btn-text {
@@ -1577,7 +1577,7 @@
  }
 
  .x-date-inner td {
-     border-color: #fff;
+     border-color: var(--text)
  }
 
  .x-date-inner a {
@@ -1644,7 +1644,7 @@
 
  .x-date-mp-btns button {
      background-color: #4E565F;
-     color: #fff;
+     color: var(--text-hover);
      border-color: #C0C0C0 #434343 #434343 #C0C0C0;
      font: normal 11px 'Roboto', arial, helvetica, tahoma, sans-serif;
  }
@@ -2143,7 +2143,7 @@
  }
 
  .x-window-tl .x-window-header {
-     color: #ffffff;
+     var(--text-hover);
      font: bold 11px 'Roboto', tahoma, arial, verdana, sans-serif;
  }
 
diff --git a/css/base/duplicacy/duplicacy-base.css b/css/base/duplicacy/duplicacy-base.css
index 00a671f6..379e1563 100644
--- a/css/base/duplicacy/duplicacy-base.css
+++ b/css/base/duplicacy/duplicacy-base.css
@@ -240,7 +240,7 @@ label {
     cursor: default;
     background-color: rgba(0, 0, 0, .25);
     border: 1px solid rgba(255, 255, 255, .25);
-    border-bottom-color: #eee;
+    border-bottom-color: var(--text);
     border-radius: 6px 6px 0 0;
 }
 
@@ -513,7 +513,7 @@ div>div>div.modal-footer>button.btn.btn-default.pull-left,
 .btn-danger.btn-fill {
     border-color: #f05050;
     background-color: #f05050;
-    color: #eee;
+    color: var(--text);
 }
 
 div>div>div.modal-footer>button.btn.btn-default.pull-left:hover,
@@ -523,25 +523,25 @@ div>div>div.modal-footer>button.btn.btn-default.pull-left:focus,
 .btn-danger.btn-fill:hover,
 .btn-danger.btn-fill:focus {
     border-color: #ec2626;
-    color: #fff;
+    color: var(--text-hover);
     background-color: #ec2626;
 }
 
 div.bootbox.modal.fade.bootbox-confirm.in>div>div>div.modal-footer>button.btn.btn-default {
     border-color: #f05050;
     background-color: #f05050;
-    color: #eee;
+    color: var(--text);
 }
 
 div.bootbox.modal.fade.bootbox-confirm.in>div>div>div.modal-footer>button.btn.btn-default:hover,
 div.bootbox.modal.fade.bootbox-confirm.in>div>div>div.modal-footer>button.btn.btn-default:focus {
     border-color: #ec2626;
-    color: #fff;
+    color: var(--text-hover);
     background-color: #ec2626;
 }
 
 .close {
-    color: #fff
+    var(--text-hover);
 }
 
 .navbar .navbar-nav>li>a.btn-success,
diff --git a/css/base/emby/emby-base.css b/css/base/emby/emby-base.css
index beb78531..b4ea5322 100644
--- a/css/base/emby/emby-base.css
+++ b/css/base/emby/emby-base.css
@@ -237,7 +237,7 @@ html {
 
     .dialog-blur,
     .toast {
-        color: #fff;
+        color: var(--text-hover);
         background: rgba(56, 56, 56, .76);
         -webkit-backdrop-filter: blur(2.5em) saturate(1.8);
         backdrop-filter: blur(2.5em) saturate(1.8);
@@ -278,7 +278,7 @@ html {
 
 .emby-select-tv-withcolor:focus {
     background-color: rgb(var(--theme-primary-color)) !important;
-    color: #fff !important
+    color: var(--text-hover) !important
 }
 
 .checkboxLabel {
@@ -361,7 +361,7 @@ html {
 
 .alphaPickerButton-tv:focus {
     background-color: rgb(var(--theme-primary-color));
-    color: #fff !important
+    color: var(--text-hover) !important
 }
 
 .detailTableBodyRow-shaded:nth-child(even) {
@@ -459,7 +459,7 @@ html {
 .emby-button-focusscale:focus,
 .emby-button-focusscale:focus .detailButton-icon {
     background: rgb(var(--theme-primary-color));
-    color: #fff
+    color: var(--text-hover)
 }
 
 .emby-tab-button {
@@ -568,7 +568,7 @@ html {
 .channelCell:focus,
 .programCell:focus {
     background-color: rgb(var(--theme-primary-color));
-    color: #fff
+    color: var(--text-hover)
 }
 
 .guide-programTextIcon {
@@ -688,7 +688,7 @@ html {
 }
 
 .scrollbuttoncontainer {
-    color: #fff;
+    color: var(--text-hover);
     background: rgba(20, 20, 20, .5)
 }
 
@@ -715,7 +715,7 @@ html {
 
 .dragging-over.full-drop-target {
     background: rgb(var(--theme-primary-color)) !important;
-    color: #fff !important
+    color: var(--text-hover) !important
 }
 
 .dragging-over-top:before {
diff --git a/css/base/filebrowser/filebrowser-base.css b/css/base/filebrowser/filebrowser-base.css
index a4dd3a49..2a15beff 100644
--- a/css/base/filebrowser/filebrowser-base.css
+++ b/css/base/filebrowser/filebrowser-base.css
@@ -47,7 +47,7 @@ input:focus:-ms-input-placeholder {
 }
 
 .message {
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 #login {
@@ -204,7 +204,7 @@ body {
 }
 
 .action {
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 #listing.list .item {
@@ -514,7 +514,7 @@ input[type=submit]:hover {
 
 .button--flat:hover {
     background: var(--dark-red);
-    color: #FFF;
+    color: var(--text-hover);
     margin-left: 5px;
 }
 
diff --git a/css/base/flood/flood-base.css b/css/base/flood/flood-base.css
index c63f5330..9f8d81f9 100644
--- a/css/base/flood/flood-base.css
+++ b/css/base/flood/flood-base.css
@@ -100,7 +100,7 @@ p,
 .input,
 .inverse .input {
     background: rgba(255, 255, 255, .05);
-    color: #fff;
+    color: var(--text-hover);
     border: 1px solid #0000;
     box-shadow: 0 1px 1px rgba(210, 216, 222, 0), 0 1px 3px 1px rgba(210, 216, 222, 0);
 }
@@ -304,7 +304,7 @@ p,
 .error {
     background: #f34570;
     border-radius: 3px;
-    color: #fff;
+    color: var(--text-hover);
     padding: 8px 12px;
     transition: opacity .25s;
 }
@@ -547,7 +547,7 @@ p,
     background: rgba(var(--accent-color), .25);
     border-bottom: 1px solid rgba(var(--accent-color), .3);
     border-top: 1px solid rgba(var(--accent-color), .3);
-    color: #eee;
+    color: var(--text);
     padding-right: 45px;
 }
 
@@ -563,7 +563,7 @@ p,
 }
 
 .search .icon {
-    fill: white;
+    fill: var(--text-hover);
 }
 
 .dark .sidebar__diskusage .progress-bar__fill,
@@ -577,7 +577,7 @@ p,
 }
 
 .torrent--is-selected.torrent--is-stopped .progress-bar__icon .icon {
-    color: #ffffff;
+    color: var(--text-hover);
 }
 
 .torrent--is-selected.torrent--is-stopped .progress-bar__fill {
diff --git a/css/base/gaps/gaps-base.css b/css/base/gaps/gaps-base.css
index a7bd7773..54ce6d34 100644
--- a/css/base/gaps/gaps-base.css
+++ b/css/base/gaps/gaps-base.css
@@ -104,7 +104,7 @@ label {
 }
 
 .alert-heading {
-    color: white !important;
+    color: var(--text-hover) !important;
 }
 
 /* Header */
@@ -386,7 +386,7 @@ select {
     -ms-flex-pack: center;
     justify-content: center;
     overflow: hidden;
-    color: #fff;
+    color: var(--text-hover);
     text-align: center;
     white-space: nowrap;
     background-color: rgb(var(--accent-color), .15);
diff --git a/css/base/gitea/gitea-base.css b/css/base/gitea/gitea-base.css
index 02c05f73..304c0176 100644
--- a/css/base/gitea/gitea-base.css
+++ b/css/base/gitea/gitea-base.css
@@ -546,7 +546,7 @@ input:hover,
 textarea:hover {
     border-color: rgb(255 255 255 / 20%);
     background: rgb(0 0 0 / .25);
-    color: #fff;
+    color: var(--text-hover);
 }
 
 .ui.dropdown .menu>.item {
@@ -563,7 +563,7 @@ textarea:hover {
 
 .ui.selection.dropdown {
     background: rgb(0 0 0 / .25);
-    color: #fff;
+    color: var(--text-hover);
     border-color: rgb(255 255 255 / 10%);
 }
 
@@ -611,7 +611,7 @@ textarea:hover {
 }
 
 .ui.negative.message p {
-    color: white !important;
+    color: var(--text-hover) !important;
     box-shadow: none !important;
 }
 
@@ -621,7 +621,7 @@ textarea:hover {
 }
 
 .ui.positive.message p {
-    color: white !important;
+    color: var(--text-hover) !important;
 }
 
 /* DASHBOARD */
@@ -1012,7 +1012,7 @@ a.ui.card:hover {
 
 /* ISSUES */
 .CodeMirror-cursor {
-    border-left: 1px solid #fff;
+    border-left: 1px solid var(--text)
 }
 
 .CodeMirror,
@@ -1027,7 +1027,7 @@ a.ui.card:hover {
 
 .editor-toolbar a,
 .editor-toolbar button {
-    color: #ffffff !important;
+    color: var(--text-hover) !important;
 }
 
 .editor-toolbar {
@@ -1103,7 +1103,7 @@ a.ui.card:hover {
 .repository.view.issue .comment-list .timeline-item .badge {
     background-color: rgb(var(--accent-color));
     border: 2px solid rgb(var(--accent-color));
-    color: #fff;
+    color: var(--text-hover);
 }
 
 .issue.list>.item .desc .overdue {
@@ -1370,7 +1370,7 @@ a.ui.basic.label:hover,
 }
 
 .repo-title {
-    color: #ffffff;
+    color: var(--text-hover);
 }
 
 /* LABELS */
@@ -1418,7 +1418,7 @@ a.ui.labels .label:hover {
     margin: -6px -10px -4px 0;
     padding: 5px 4px 5px 6px;
     border: 0;
-    border-left: 1px solid #fff;
+    border-left: 1px solid var(--text-hover);
     border-top-left-radius: 0;
     border-bottom-left-radius: 0;
 }
diff --git a/css/base/grafana/grafana-base.css b/css/base/grafana/grafana-base.css
index 337e8057..a26fb18f 100644
--- a/css/base/grafana/grafana-base.css
+++ b/css/base/grafana/grafana-base.css
@@ -152,7 +152,7 @@ p {
     -moz-background-size: auto, cover !important;
     -o-background-size: auto, cover !important;
     background-color: rgba(0, 0, 0, .0) !important;
-    color: #FFFFFF !important;
+    color: var(--text-hover) !important;
 }
 
 .login-branding {
@@ -170,11 +170,11 @@ p {
 
 .card-item-sub-name,
 .card-item-type {
-    color: #FFF !important;
+    color: var(--text-hover) !important;
 }
 
 .gf-form--has-input-icon .gf-form-input-icon {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 .gf-tabs-link.active,
@@ -197,12 +197,12 @@ p {
 
 .layout-selector button {
     background: rgba(0, 0, 0, 0.25);
-    color: #ffffff;
+    color: var(--text-hover);
 }
 
 .layout-selector button.active {
     background-color: rgba(0, 0, 0, 0.45);
-    color: #ffffff;
+    color: var(--text-hover);
 }
 
 /* Configuration menu - Teams */
@@ -302,7 +302,7 @@ p {
 .icon-circle:hover .fa:hover,
 .icon-circle:hover .gicon:hover,
 .icon-circle:hover .icon-gf:hover {
-    color: #ffffff;
+    color: var(--text-hover);
     opacity: 1;
 }
 
@@ -323,7 +323,7 @@ p {
 }
 
 .navbar-page-btn {
-    color: #FFFFFF !important;
+    color: var(--text-hover) !important;
 }
 
 /* dropdown menu */
@@ -374,7 +374,7 @@ p {
 }
 
 .search-section__header {
-    color: #ffffff !important;
+    color: var(--text-hover) !important;
 }
 
 .navbar-page-btn__folder {
@@ -405,11 +405,11 @@ p {
 }
 
 .dashboard-settings__aside-header {
-    color: #ffffff !important;
+    color: var(--text-hover) !important;
 }
 
 .dashboard-settings__nav-item {
-    color: #ffffff !important;
+    color: var(--text-hover) !important;
 }
 
 .bootstrap-tagsinput {
@@ -435,7 +435,7 @@ p {
 
 .gf-form-switch__checkbox {
     border: none;
-    background: #ffffff;
+    background: var(--text-hover);
 }
 
 .gf-form-select-box__option {
@@ -450,7 +450,7 @@ p {
 }
 
 .gf-form-select-box__option.gf-form-select-box__option--is-focused {
-    color: #fff;
+    color: var(--text-hover);
     -o-border-image: -o-linear-gradient(rgb(var(--accent-color)) 30%, rgb(var(--accent-color)) 99%);
     border-image: -webkit-gradient(linear, left top, left bottom, color-stop(30%, rgb(var(--accent-color))), color-stop(99%, rgb(var(--accent-color))));
     border-image: -webkit-linear-gradient(rgb(var(--accent-color)) 30%, rgb(var(--accent-color)) 99%);
@@ -490,17 +490,17 @@ p {
     padding: 7.4px 10px !important;
     background-color: rgba(0, 0, 0, 0.25) !important;
     border: none !important;
-    color: #FFFFFF !important;
+    color: var(--text-hover) !important;
 }
 
 /* Variable input box */
 .gf-form-input {
-    color: #FFFFFF !important;
+    color: var(--text-hover) !important;
     border: none !important;
 }
 
 .gf-form-input:focus {
-    color: #FFF !important;
+    color: var(--text-hover) !important;
     box-shadow: none !important;
 }
 
@@ -510,7 +510,7 @@ p {
 }
 
 .gf-form-select-wrapper .gf-form-select-icon+.gf-form-input option {
-    color: #fff;
+    color: var(--text-hover);
     background: #1f1f1f;
 }
 
@@ -520,7 +520,7 @@ p {
 
 /* NAVBAR BUTTONS */
 .navbar-button {
-    color: #FFF !important;
+    color: var(--text-hover) !important;
     background-color: rgba(0, 0, 0, 0.25) !important;
     background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25)) !important;
     border: none !important;
@@ -561,18 +561,18 @@ p {
 
 /* Panel text color*/
 div.flot-text {
-    color: #FFF !important;
+    color: var(--text-hover) !important;
 }
 
 /* panel loading circle*/
 .panel-loading {
-    color: #FFF !important;
+    color: var(--text-hover) !important;
 }
 
 /* panel resize arrow */
 .theme-dark .react-grid-item>.react-resizable-handle:after {
-    border-right: 2px solid #fff !important;
-    border-bottom: 2px solid #fff !important;
+    border-right: 2px solid var(--text-hover) !important;
+    border-bottom: 2px solid var(--text-hover) !important;
 }
 
 /* table panel background color */
@@ -705,7 +705,7 @@ div>.scrollbar-view>div>[class*="css-"],
 }
 
 .toolbar__main {
-    color: #ffffff;
+    color: var(--text-hover);
     background-color: rgba(0, 0, 0, 0.15);
     border: transparent;
 }
@@ -729,17 +729,17 @@ div>.scrollbar-view>div>[class*="css-"],
 /* buttons  
 .btn-inverse {
 border-color: #b56d16 !important;
-    color: #fff !important;
+    color: var(--text-hover) !important;
     background-color: #cc7b19 !important;
     -webkit-transition: background-color .1s !important;
     transition: background-color .1s !important;
 	}
 	.btn-inverse.active, .btn-inverse.disabled, .btn-inverse:active, .btn-inverse:focus, .btn-inverse:hover, .btn-inverse[disabled] {
-		color: #fff;
+		color: var(--text-hover);
     background-color: #e59029 !important;
 }
 .btn-outline-disabled {
-    color: #fff;
+    color: var(--text-hover);
 }*/
 
 .btn-inverse {
@@ -782,7 +782,7 @@ border-color: #b56d16 !important;
 
 /* Explore */
 .query-transaction {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 .query-type-toggle .btn.active {
@@ -831,7 +831,7 @@ border-color: #b56d16 !important;
     -webkit-box-shadow: none;
     box-shadow: none;
     border-bottom: 1px solid #d8d9da;
-    color: #eee;
+    color: var(--text);
 }
 
 .modal-body,
@@ -844,7 +844,7 @@ border-color: #b56d16 !important;
     -webkit-background-size: auto, cover !important;
     -moz-background-size: auto, cover !important;
     -o-background-size: auto, cover !important;
-    color: #eee;
+    color: var(--text);
 }
 
 
@@ -901,12 +901,12 @@ button[class$="-button"]:active,
 }
 
 .css-1d9e5zy-button {
-    color: #fff;
+    color: var(--text-hover);
     background: var(--button-color)
 }
 
 .css-1d9e5zy-button:hover {
-    color: #fff;
+    color: var(--text-hover);
     background: var(--button-color-hover)
 }
 
@@ -1069,7 +1069,7 @@ body>grafana-app>div>div>react-container>div>div>div.view>div>div.page-container
 
 .css-17abkeq,
 .css-5ak73y {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 
@@ -1083,7 +1083,7 @@ body>grafana-app>div>div>react-container>div>div>div.view>div>div.page-container
 
 .css-cxwxzk-Label-description,
 .css-n370st {
-    color: #eee;
+    color: var(--text);
 }
 
 .css-10pj50r,
@@ -1297,13 +1297,13 @@ input:checked+.gf-form-switch__slider {
 
 /*Placeholder text*/
 ::placeholder {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 :-ms-input-placeholder {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 ::-webkit-input-placeholder {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
\ No newline at end of file
diff --git a/css/base/grafana/organizr-dashboard.css b/css/base/grafana/organizr-dashboard.css
index c45ccb39..c7eeaea0 100644
--- a/css/base/grafana/organizr-dashboard.css
+++ b/css/base/grafana/organizr-dashboard.css
@@ -20,7 +20,7 @@ body {
     background: linear-gradient(180deg,#ffffff00 10px,#ffffff00 100px) !important;
 }
 div.flot-text {
-  color: #FFF !important;
+  color: var(--text-hover) !important;
 }
 /* Loading page */
 .theme-dark, .theme-light, .preloader {
@@ -56,7 +56,7 @@ div.flot-text {
     left: 0px !important;
 }
 .navbar-page-btn {
-    color: #FFF !important;
+    color: var(--text-hover) !important;
 }
 
 /* Panel fullscreen navbar */
@@ -112,7 +112,7 @@ div.flot-text {
     box-shadow: none;
     background: rgba(255, 255, 255, 0.15);
     border: 1px solid #00000000;
-    color: #fff;
+    color: var(--text-hover);
 }
 /* Variable label color */
 .template-variable {
@@ -123,10 +123,10 @@ div.flot-text {
 .gf-form-label {
     background-color: rgba(0, 0, 0, 0.25) !important;
 	   border: none !important;
-     color: #FFF;
+     color: var(--text-hover);
 }
 .gf-form-input:focus {
-    color: #FFF !important;
+    color: var(--text-hover) !important;
     background-color: #262626 !important;
     border: none !important;
     box-shadow: none !important;
@@ -153,7 +153,7 @@ div.flot-text {
 
 /* NAVBAR BUTTONS */
 .navbar-button {
-    color: #FFF !important;
+    color: var(--text-hover) !important;
     background-color: rgba(0, 0, 0, 0.25) !important;
     background-image: linear-gradient(180deg,rgba(0, 0, 0, 0.25),rgba(0, 0, 0, 0.25)) !important;
     border: none !important;
@@ -188,18 +188,18 @@ background-color: transparent;
 
 /* Panel text color*/
 div.flot-text {
-    color: #FFF !important;
+    color: var(--text-hover) !important;
 }
 
 /* panel loading circle*/
 .panel-loading {
-    color: #FFF !important;
+    color: var(--text-hover) !important;
 }
 
 /* panel resize arrow */
 .theme-dark .react-grid-item>.react-resizable-handle:after {
-    border-right: 2px solid #fff !important;
-    border-bottom: 2px solid #fff !important;
+    border-right: 2px solid var(--text-hover) !important;
+    border-bottom: 2px solid var(--text-hover) !important;
 }
 
 /* table panel background color */
@@ -310,8 +310,8 @@ background: var(--button-color-hover) !important;
 background-color: var(--button-color-hover) !important;
 box-shadow: none !important;
 } 
-.css-1d9e5zy-button {color: #fff; background: var(--button-color)}
-.css-1d9e5zy-button:hover {color: #fff; background: var(--button-color-hover)}
+.css-1d9e5zy-button {color: var(--text-hover); background: var(--button-color)}
+.css-1d9e5zy-button:hover {color: var(--text-hover); background: var(--button-color-hover)}
 
 /*INPUT*/
 input:focus {box-shadow: none !important;}
@@ -429,7 +429,7 @@ margin: 10px 0px 0px;
 .css-1as70ku, .css-u5zjuh {
 background: rgba(0, 0, 0, .25);}
 .css-17abkeq, .css-5ak73y  {
-color: #fff;
+color: var(--text-hover);
 }
 
 
@@ -594,6 +594,6 @@ border-top: 3px solid var(--accent-color);
 background: hsla(0,0%,100%,.15) !important;
 }
 /*Placeholder text*/
-::placeholder {color: #fff !important;}
-:-ms-input-placeholder {color: #fff !important;}
-::-webkit-input-placeholder {color: #fff !important;}
\ No newline at end of file
+::placeholder {color: var(--text-hover) !important;}
+:-ms-input-placeholder {color: var(--text-hover) !important;}
+::-webkit-input-placeholder {color: var(--text-hover) !important;}
\ No newline at end of file
diff --git a/css/base/guacamole/guacamole-base.css b/css/base/guacamole/guacamole-base.css
index 27bd19c0..e06e0d2d 100644
--- a/css/base/guacamole/guacamole-base.css
+++ b/css/base/guacamole/guacamole-base.css
@@ -179,7 +179,7 @@ input[type=email],
 input[type=number],
 input[type=password],
 textarea {
-    color: white !important;
+    color: var(--text-hover) !important;
     background: rgba(0, 0, 0, 0.25) !important;
 }
 
@@ -415,7 +415,7 @@ textarea {
 .clipboard,
 .clipboard-service-target {
     background: rgba(0, 0, 0, 0.25);
-    color: white;
+    color: var(--text-hover);
 }
 
 /* NOTIFICATION BOX */
@@ -428,7 +428,7 @@ textarea {
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    color: white;
+    color: var(--text-hover);
 }
 
 .notification {
@@ -440,16 +440,16 @@ textarea {
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    color: white;
+    color: var(--text-hover);
 }
 
 /* SETTINGS */
 .page-tabs .page-list li a[href]:visited {
-    color: white;
+    color: var(--text-hover);
 }
 
 .page-tabs .page-list li a[href] {
-    color: white;
+    color: var(--text-hover);
 }
 
 .page-tabs .page-list li a[href]:hover {
@@ -577,7 +577,7 @@ form:not(.inline) fieldset {
 }
 
 label span {
-    color: white !important;
+    color: var(--text-hover) !important;
 }
 
 input[type=radio] {
diff --git a/css/base/jackett/jackett-base.css b/css/base/jackett/jackett-base.css
index da57858a..ff885471 100644
--- a/css/base/jackett/jackett-base.css
+++ b/css/base/jackett/jackett-base.css
@@ -94,13 +94,13 @@ hr {
 .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
 .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,
 .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
 .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,
 .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
-    color: #fff !important;
+    color: var(--text-hover) !important;
     background-color: rgba(255, 255, 255, 0.15);
 }
 
@@ -143,7 +143,7 @@ a:hover {
     background: rgba(255, 255, 255, 0.08);
     border: none;
     outline: none;
-    color: #fff;
+    color: var(--text-hover);
 }
 
 table.dataTable.cell-border tbody tr:first-child th,
@@ -314,7 +314,7 @@ fieldset[disabled] .form-control {
 }
 
 .close {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 .btn-default {
@@ -402,14 +402,14 @@ fieldset[disabled] .btn-primary:hover {
 }
 
 .input-group-addon {
-    color: #fff;
+    color: var(--text-hover);
     background-color: rgba(0, 0, 0, 0.25);
     border: 1px solid #0000;
 
 }
 
 .alert-info {
-    color: #ffffff;
+    color: var(--text-hover);
     background: var(--modal-bg-color);
     background-repeat: repeat, no-repeat;
     background-attachment: fixed, fixed;
diff --git a/css/base/jellyfin/jellyfin-base.css b/css/base/jellyfin/jellyfin-base.css
index d2cbca28..5bef3117 100644
--- a/css/base/jellyfin/jellyfin-base.css
+++ b/css/base/jellyfin/jellyfin-base.css
@@ -241,7 +241,7 @@ html {
 
     .dialog-blur,
     .toast {
-        color: #fff;
+        color: var(--text-hover);
         background: rgba(56, 56, 56, .76);
         -webkit-backdrop-filter: blur(2.5em) saturate(1.8);
         backdrop-filter: blur(2.5em) saturate(1.8);
@@ -702,7 +702,7 @@ html {
 }
 
 .scrollbuttoncontainer {
-    color: #fff;
+    color: var(--text-hover);
     background: rgba(20, 20, 20, .5)
 }
 
@@ -771,13 +771,13 @@ html {
 }
 
 .cardImageIcon {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 .dialog .inputLabelFocused,
 .selectLabelFocused,
 .textareaLabelFocused {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 
diff --git a/css/base/kitana/kitana-base.css b/css/base/kitana/kitana-base.css
index 08b2376a..4043bada 100644
--- a/css/base/kitana/kitana-base.css
+++ b/css/base/kitana/kitana-base.css
@@ -93,7 +93,7 @@ label {
 
 /* DROPDOWN MENU */
 .dropdown-menu {
-    color: #fff;
+    color: var(--text-hover);
     background: var(--modal-bg-color);
     background-repeat: repeat, no-repeat;
     background-attachment: fixed, fixed;
@@ -225,7 +225,7 @@ ul li:hover {
 }
 
 .custom-control-input:not(:disabled):active~.custom-control-label::before {
-    color: #fff;
+    color: var(--text-hover);
     background-color: #97b3d2;
     border-color: #97b3d2
 }
diff --git a/css/base/librespeed/librespeed-base.css b/css/base/librespeed/librespeed-base.css
index 880784b9..e5dbc293 100644
--- a/css/base/librespeed/librespeed-base.css
+++ b/css/base/librespeed/librespeed-base.css
@@ -101,7 +101,7 @@ a:-webkit-any-link:hover {
 
 input {
     font-family: "Roboto", sans-serif;
-    color: white;
+    color: var(--text-hover);
     background-color: rgba(0, 0, 0, 0.25) !important;
     -webkit-rtl-ordering: logical;
     Font-size: 16px;
diff --git a/css/base/lidarr/lidarr-base.css b/css/base/lidarr/lidarr-base.css
index eab46b40..9f8ee204 100644
--- a/css/base/lidarr/lidarr-base.css
+++ b/css/base/lidarr/lidarr-base.css
@@ -112,7 +112,7 @@ a:hover {
 }
 
 [class*="LoadingIndicator-ripple-"] {
-    border: 2px solid #fff;
+    border: 2px solid var(--text-hover);
 }
 
 /* MODAL */
@@ -152,18 +152,18 @@ a:hover {
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    color: #fff;
+    color: var(--text-hover);
     border-top: 1px solid rgb(var(--accent-color));
 }
 
 [class*="ModalContent-closeButton-"]:hover {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 /* INPUT */
 [class*="TagInput-internalInput-"] {
     background-color: transparent;
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="SelectInput-select-"] {
@@ -211,7 +211,7 @@ a:hover {
 
 /* LIDARR SPECIFIC */
 [class*="ArtistSearchInput-sectionTitle-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="ArtistSearchInput-containerOpen-"] [class*="ArtistSearchInput-artistContainer-"] {
@@ -224,7 +224,7 @@ a:hover {
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    color: #fff !important;
+    color: var(--text-hover) !important;
     box-shadow: 0 0 10px 1px transparent !important;
 }
 
@@ -405,7 +405,7 @@ a:hover {
 [class*="ArtistDetailsSeason-albumCount-"],
 [class*="ArtistDetails-metadataMessage-"],
 [class*="ArtistDetailsSeason-albumCount-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="ArtistDetailsSeason-albums-"] {
@@ -444,7 +444,7 @@ a:hover {
 
 /*ARTIST ALBUM PAGE*/
 [class*="AlbumDetailsMedium-mediumNumber-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="AlbumDetailsMedium-medium-"] {
@@ -473,7 +473,7 @@ a:hover {
 [class*="ArtistIndexBanner-title-"],
 [class*="ArtistIndexBannerInfo-info-"] {
     background-color: rgba(0, 0, 0, .25);
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="Tooltip-tooltip-"][class*="Tooltip-inverse-"],
@@ -484,7 +484,7 @@ a:hover {
 [class*="Tooltip-tooltipContainer-"],
 [class*="Tooltip-tooltip-"][class*="Tooltip-default-"] {
     background: #1f1f1f;
-    color: #eee;
+    color: var(--text);
 }
 /* 
 @supports (backdrop-filter: blur(1em)) or (-webkit-backdrop-filter:blur(1em)) {
@@ -515,7 +515,7 @@ a:hover {
 }
 
 [class*="EpisodeTitleLink-link-"]:hover {
-    color: #ffffff;
+    color: var(--text-hover);
     text-decoration: none;
 }
 
@@ -669,7 +669,7 @@ a:hover {
 
 /* ALPHABET JUMP BAR */
 [class*="PageJumpBar-jumpBar-"] {
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 /* SEARCH BAR */
@@ -679,12 +679,12 @@ a:hover {
 [class*="CheckInput-isIndeterminate-"] {
     border: none;
     background-color: rgba(255, 255, 255, 0.08);
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 [class*="ArtistSearchInput-container-"] [class*="Input-input-"] {
     background: transparent;
-    border-bottom: solid 1px #fff;
+    border-bottom: solid 1px var(--text-hover);
 }
 
 [class*="ArtistSearchInput-container-"] [class*="Input-input-"]:focus {
@@ -693,20 +693,20 @@ a:hover {
 }
 
 [class*="ArtistSearchResult-alternateTitle-"] {
-    color: #ffffff;
+    color: var(--text-hover);
     font-size: 12px;
 }
 
 [class*="Input-input-"]:focus {
     outline: 0;
-    border-color: #fff;
+    border-color: var(--text-hover);
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.25);
 }
 
 [class*="TagInput-input-"][class*="TagInput-isFocused-"] {
     outline: 0;
-    border-color: #fff;
+    border-color: var(--text-hover);
     box-shadow: none;
 }
 
@@ -722,7 +722,7 @@ a:hover {
 }
 
 [class*="AddNewArtistSearchResult-year-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="AddNewArtistSearchResult-searchResult-"],
@@ -740,7 +740,7 @@ a:hover {
 }
 
 [class*="RootFolderSelectInputSelectedValue-freeSpace-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="RootFolderSelectInputOption-freeSpace-"],
@@ -759,7 +759,7 @@ a:hover {
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    color: #FFF;
+    color: var(--text-hover);
     border: 1px solid transparent;
 }
 
@@ -810,7 +810,7 @@ input:focus:-ms-input-placeholder {
 /* IMPORT */
 /* Text color */
 [class*="ImportArtistSelectFolder-header-"] {
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 [class*="ExpandingFileDetails-fileDetails-"] {
@@ -823,7 +823,7 @@ input:focus:-ms-input-placeholder {
 [class*="ImportArtistSelectArtist-button-"] {
     border: none;
     background-color: rgba(0, 0, 0, 0.25) !important;
-    color: #fff;
+    color: var(--text-hover);
 }
 
 
@@ -841,7 +841,7 @@ input:focus:-ms-input-placeholder {
 /*Title*/
 
 [class*="PageJumpBarItem-jumpBarItem-"]:hover {
-    color: #fff;
+    color: var(--text-hover);
     background: hsla(0, 0%, 100%, .08);
 }
 
@@ -854,12 +854,12 @@ input:focus:-ms-input-placeholder {
 [class*="PageContentFooter-contentFooter-"] {
     border: none;
     background-color: rgba(0, 0, 0, .25);
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 /* CALENDAR */
 [class*="CircularProgressBar-circularProgressBarContainer-"] svg circle {
-    stroke: white !important;
+    stroke: var(--text-hover) !important;
 }
 
 [class*="CalendarEvent-downloaded-"] {
@@ -1010,7 +1010,7 @@ input:focus:-ms-input-placeholder {
 
 
 [class*="-cloneButton-"][class*="IconButton-button-"]:hover {
-    color: white;
+    color: var(--text-hover);
 }
 
 [class*="Card-card-"]:hover {
@@ -1029,7 +1029,7 @@ input:focus:-ms-input-placeholder {
 [class*="LanguageProfileItem-languageProfileItem-"] {
     border: none;
     background-color: rgba(0, 0, 0, .25);
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 [class*="QualityProfileItemGroup-qualityProfileItemGroup-"][class*="QualityProfileItemGroup-editGroups-"] {
@@ -1040,7 +1040,7 @@ input:focus:-ms-input-placeholder {
 [class*="KeyValueListInputItem-valueInput-"] {
     border: none;
     background: transparent;
-    color: white;
+    color: var(--text-hover);
 }
 
 [class*="QualityProfileFormatItem-qualityProfileFormatItem-"] {
@@ -1146,7 +1146,7 @@ input[type=email],
 input[type=password] {
     border: none;
     background-color: rgba(255, 255, 255, 0.08);
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 .button {
@@ -1158,13 +1158,13 @@ input[type=password] {
 .button:hover {
     border-color: var(--button-color-hover);
     background-color: var(--button-color-hover);
-    color: #fff;
+    color: var(--text-hover);
     text-decoration: none;
 }
 
 .form-input:focus {
     outline: 0;
-    border-color: #fff;
+    border-color: var(--text-hover);
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.25);
 }
@@ -1195,7 +1195,7 @@ input[type=password] {
 [class*="ArtistIndexHeader-latestAlbum-"]:hover,
 [class*="ArtistIndexHeader-actions-"]:hover {
     background-color: rgba(0, 0, 0, .25);
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 /* Fix rating border*/
@@ -1209,7 +1209,7 @@ input[type=password] {
 [class*="AlbumStudioAlbum-tracks-"] {
     border: none;
     background-color: rgba(0, 0, 0, 0.25);
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="AlbumStudioAlbum-missingWanted-"] {
@@ -1222,6 +1222,6 @@ input[type=password] {
 
 /* CONNECTIONS */
 [class*="Label-danger-"][class*="Label-outline-"] {
-    color: #FFF;
+    color: var(--text-hover);
     background-color: #f05050;
 }
\ No newline at end of file
diff --git a/css/base/logarr/logarr-base.css b/css/base/logarr/logarr-base.css
index 1bcf00c1..a78c502b 100644
--- a/css/base/logarr/logarr-base.css
+++ b/css/base/logarr/logarr-base.css
@@ -20,7 +20,7 @@ body {
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    color: #FFFFFF !important;
+    color: var(--text-hover) !important;
 }
 
 /* Scrollbar */
@@ -121,7 +121,7 @@ body.fade-out {
 .nav-item,
 .filesize,
 .path {
-    color: #ffffff;
+    color: var(--text-hover);
 }
 
 #username:hover,
@@ -131,7 +131,7 @@ body.fade-out {
 
 #categoryFilter,
 #auto-update {
-    color: white !important;
+    color: var(--text-hover) !important;
     background-color: transparent !important;
     box-shadow: none;
     border-radius: 0px;
@@ -204,7 +204,7 @@ body.fade-out {
 /* Text Color */
 .alpaca-control-label,
 .alpaca-control.radio {
-    color: white !important;
+    color: var(--text-hover) !important;
 }
 
 .alpaca-form-buttons-container {
@@ -212,11 +212,11 @@ body.fade-out {
 }
 
 .Rtable-cell {
-    color: white !important;
+    color: var(--text-hover) !important;
 }
 
 #colorkey {
-    color: white !important;
+    color: var(--text-hover) !important;
 }
 
 .settingstitle {
@@ -224,7 +224,7 @@ body.fade-out {
 }
 
 #reginfo {
-    color: white !important;
+    color: var(--text-hover) !important;
 }
 
 #infodata {
@@ -323,14 +323,14 @@ input:valid {
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    color: white !important;
+    color: var(--text-hover) !important;
     border: 1px solid transparent !important;
     box-shadow: 0.5rem 0.5rem 1rem rgb(15, 15, 15, 0.45) !important;
 }
 
 .modaltextloading,
 .modalloadingspinner {
-    color: #FFF !important;
+    color: var(--text-hover) !important;
 }
 
 .container {
@@ -364,7 +364,7 @@ input:valid {
 }
 
 #servicetitle {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 .btnoffline,
@@ -395,16 +395,16 @@ input:valid {
 
 .btn-group>.btn-group:not(:first-child)>.btn,
 .btn-group>.btn:not(:first-child) {
-    color: white !important;
+    color: var(--text-hover) !important;
 }
 
 .btn-group>.btn:first-child {
-    color: white !important;
+    color: var(--text-hover) !important;
 }
 
 #time {
     background-color: rgba(0, 0, 0, .15) !important;
-    color: #fff !important;
+    color: var(--text-hover) !important;
     box-shadow: none;
 }
 
@@ -414,15 +414,15 @@ input:valid {
 }
 
 #textslider {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 .dtg {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 .datemin {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 #center {
@@ -448,7 +448,7 @@ input:valid {
 .servicetile,
 .servicetile:hover,
 .servicetile:focus {
-    color: #ffffff;
+    color: var(--text-hover);
     text-shadow: none !important;
     text-decoration: none !important;
     outline: 0;
@@ -461,7 +461,7 @@ input:valid {
 }
 
 .servicetile {
-    color: #ffffff;
+    color: var(--text-hover);
     text-shadow: none !important;
     text-decoration: none !important;
     outline: 0;
@@ -481,12 +481,12 @@ input:valid {
 
 #clock {
     background-color: rgba(0, 0, 0, .15) !important;
-    color: #fff !important;
+    color: var(--text-hover) !important;
     box-shadow: none;
 }
 
 .date {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 #summary {
@@ -506,12 +506,12 @@ input:valid {
 }
 
 .pace .pace-activity {
-    border-top-color: #FFF !important;
-    border-left-color: #FFF !important;
+    border-top-color: var(--text-hover) !important;
+    border-left-color: var(--text-hover) !important;
 }
 
 .footer {
-    color: white !important;
+    color: var(--text-hover) !important;
 }
 
 .footer:hover {
@@ -549,17 +549,17 @@ input:valid {
 .modalimgpath,
 .modaltext,
 #uploadbutton {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 .file-upload {
     background-color: var(--button-color) !important;
-    color: white !important;
+    color: var(--button-text) !important;
 }
 
 .file-upload:hover {
     background-color: var(--button-color-hover) !important;
-    color: white !important;
+    color: var(--button-text) !important;
 }
 
 @media only screen and (max-width: 775px) {
@@ -575,7 +575,7 @@ input:valid {
 @media only screen and (max-width: 768px) {
     #dateRight {
         background-color: rgba(0, 0, 0, .15) !important;
-        color: #fff !important;
+        color: var(--text-hover) !important;
         box-shadow: none;
     }
 }
\ No newline at end of file
diff --git a/css/base/monitorr/monitorr-base.css b/css/base/monitorr/monitorr-base.css
index 04fe97f2..78a7868f 100644
--- a/css/base/monitorr/monitorr-base.css
+++ b/css/base/monitorr/monitorr-base.css
@@ -12,7 +12,7 @@
 
 
 #footer:after {
-    color: white;
+    color: var(--text-hover);
     content: "theme.park v2.0";
 }
 
@@ -25,7 +25,7 @@ body {
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    color: #FFFFFF !important;
+    color: var(--text-hover) !important;
 }
 
 /* Scrollbar */
@@ -86,7 +86,7 @@ body::-webkit-scrollbar-thumb:hover {
 /* Text Color */
 .alpaca-control-label,
 .alpaca-control.radio {
-    color: white !important;
+    color: var(--text-hover) !important;
 }
 
 .alpaca-form-buttons-container {
@@ -94,11 +94,11 @@ body::-webkit-scrollbar-thumb:hover {
 }
 
 .Rtable-cell {
-    color: white !important;
+    color: var(--text-hover) !important;
 }
 
 #colorkey {
-    color: white !important;
+    color: var(--text-hover) !important;
 }
 
 .settingstitle {
@@ -106,7 +106,7 @@ body::-webkit-scrollbar-thumb:hover {
 }
 
 #reginfo {
-    color: white !important;
+    color: var(--text-hover) !important;
 }
 
 #infodata {
@@ -185,14 +185,14 @@ body::-webkit-scrollbar-thumb:hover {
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    color: white !important;
+    color: var(--text-hover) !important;
     border: 1px solid transparent !important;
     box-shadow: 0.5rem 0.5rem 1rem rgb(15, 15, 15, 0.45) !important;
 }
 
 .modaltextloading,
 .modalloadingspinner {
-    color: #FFF !important;
+    color: var(--text-hover) !important;
 }
 
 .container {
@@ -226,7 +226,7 @@ body::-webkit-scrollbar-thumb:hover {
 }
 
 #servicetitle {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 .btnoffline,
@@ -255,16 +255,16 @@ body::-webkit-scrollbar-thumb:hover {
 
 .btn-group>.btn-group:not(:first-child)>.btn,
 .btn-group>.btn:not(:first-child) {
-    color: white !important;
+    color: var(--text-hover) !important;
 }
 
 .btn-group>.btn:first-child {
-    color: white !important;
+    color: var(--text-hover) !important;
 }
 
 #time {
     background-color: rgba(0, 0, 0, .15) !important;
-    color: #fff !important;
+    color: var(--text-hover) !important;
     box-shadow: none;
 }
 
@@ -274,15 +274,15 @@ body::-webkit-scrollbar-thumb:hover {
 }
 
 #textslider {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 .dtg {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 .datemin {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 #center {
@@ -308,7 +308,7 @@ body::-webkit-scrollbar-thumb:hover {
 .servicetile,
 .servicetile:hover,
 .servicetile:focus {
-    color: #ffffff;
+    color: var(--text-hover);
     text-shadow: none !important;
     text-decoration: none !important;
     outline: 0;
@@ -321,7 +321,7 @@ body::-webkit-scrollbar-thumb:hover {
 }
 
 .servicetile {
-    color: #ffffff;
+    color: var(--text-hover);
     text-shadow: none !important;
     text-decoration: none !important;
     outline: 0;
@@ -341,12 +341,12 @@ body::-webkit-scrollbar-thumb:hover {
 
 #clock {
     background-color: rgba(0, 0, 0, .15) !important;
-    color: #fff !important;
+    color: var(--text-hover) !important;
     box-shadow: none;
 }
 
 .date {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 #summary {
@@ -366,12 +366,12 @@ body::-webkit-scrollbar-thumb:hover {
 }
 
 .pace .pace-activity {
-    border-top-color: #FFF !important;
-    border-left-color: #FFF !important;
+    border-top-color: var(--text-hover) !important;
+    border-left-color: var(--text-hover) !important;
 }
 
 .footer {
-    color: white !important;
+    color: var(--text-hover) !important;
 }
 
 .footer:hover {
@@ -409,17 +409,17 @@ body::-webkit-scrollbar-thumb:hover {
 .modalimgpath,
 .modaltext,
 #uploadbutton {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 .file-upload {
     background-color: var(--button-color) !important;
-    color: white !important;
+    color: var(--text-hover) !important;
 }
 
 .file-upload:hover {
     background-color: var(--button-color-hover) !important;
-    color: white !important;
+    color: var(--text-hover) !important;
 }
 
 @media only screen and (max-width: 775px) {
diff --git a/css/base/monitorr/organizr-dashboard.css b/css/base/monitorr/organizr-dashboard.css
index d506caf1..766cbee3 100644
--- a/css/base/monitorr/organizr-dashboard.css
+++ b/css/base/monitorr/organizr-dashboard.css
@@ -45,7 +45,7 @@ body {
 }
 
 #servicetitle {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 .btnoffline,
@@ -61,7 +61,7 @@ body {
 
 #time {
     background-color: rgba(0, 0, 0, .15) !important;
-    color: #fff !important;
+    color: var(--text-hover) !important;
     box-shadow: none;
 }
 
@@ -71,15 +71,15 @@ body {
 }
 
 #textslider {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 .dtg {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 .datemin {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 #center {
@@ -138,12 +138,12 @@ body {
 
 #clock {
     background-color: rgba(0, 0, 0, .15) !important;
-    color: #fff !important;
+    color: var(--text-hover) !important;
     box-shadow: none;
 }
 
 .date {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 #summary {
diff --git a/css/base/mylar3/mylar3-base.css b/css/base/mylar3/mylar3-base.css
index 050a931e..6b3ba80e 100644
--- a/css/base/mylar3/mylar3-base.css
+++ b/css/base/mylar3/mylar3-base.css
@@ -628,7 +628,7 @@ input[type="radio"] {
 ::-moz-selection,
 ::selection {
     background: grey;
-    color: #fff;
+    var(--text-hover);
     text-shadow: none;
 }
 
@@ -821,7 +821,7 @@ ul#nav li a {
     color: rgb(var(--accent-color));
     display: block;
     padding: 7px 15px;
-    -text-shadow: 1px 1px 0px #FFF;
+    text-shadow: 1px 1px 0px var(--text);
     text-transform: capitalize;
     border: 1px solid transparent;
     font-family: "Trebuchet MS", Helvetica, Arial, sans-serif;
@@ -966,7 +966,7 @@ footer div {
     -moz-box-shadow: 0px 0px 2px #aaaaaa;
     -webkit-box-shadow: 0px 0px 2px #aaaaaa;
     -o-box-shadow: 0px 0px 2px #aaaaaa;
-    box-shadow: 0px 0px 2px #fff;
+    box-shadow: 0px 0px 2px var(--text);
     padding: 7px 10px;
     position: fixed;
     text-align: center;
@@ -1187,7 +1187,7 @@ div#searchbar .mini-icon {
 .checkbox.inline>input {
     margin-right: 5px;
     margin-left: 0;
-    color: #ffffff;
+    color: var(--text-hover);
 }
 
 .Skipped {
@@ -1234,7 +1234,7 @@ div#searchbar .mini-icon {
     font-size: 14px;
     font-weight: bold;
     margin-bottom: 10px;
-    -text-shadow: 1px 1px 0 #FFFFFF;
+    -text-shadow: 1px 1px 0 var(--text-hover);
 }
 
 .comictable tr td:last-child {
@@ -1250,7 +1250,7 @@ div#searchbar .mini-icon {
     font-size: 16px;
     font-weight: bold;
     margin-bottom: 10px;
-    -text-shadow: 1px 1px 0 #FFFFFF;
+    -text-shadow: 1px 1px 0 var(--text-hover);
 }
 
 .configtable tr td:last-child {
@@ -1318,8 +1318,8 @@ div#artistheader {
 }
 
 div#artistheader #artistImg {
-    background: #ffffff url("../../../images/loader_black.gif") center no-repeat;
-    border: 5px solid #FFF;
+    background: var(--text-hover) url("../../../images/loader_black.gif") center no-repeat;
+    border: 5px solid var(--text-hover);
     -moz-box-shadow: 1px 1px 2px 0 #555555;
     -webkit-box-shadow: 1px 1px 2px 0 #555555;
     -o-box-shadow: 1px 1px 2px 0 #555555;
@@ -2070,8 +2070,8 @@ div#artistheader h2 a {
 }
 
 #searchresults_table #artistImg {
-    background: url("../../../images/loader_black.gif") no-repeat scroll center center #ffffff;
-    border: 3px solid #FFFFFF;
+    background: url("../../../images/loader_black.gif") no-repeat scroll center center var(--text-hover);
+    border: 3px solid var(--text-hover);
     box-shadow: 1px 1px 2px 0 #555555;
     float: left;
     height: 50px;
@@ -2114,7 +2114,7 @@ div#artistheader h2 a {
 #searchresults_table td#score .bar .score {
     height: 14px;
     color: #343434;
-    color: #FFF;
+    color: var(--text-hover);
     font-size: 11px;
     vertical-align: middle;
     line-height: normal;
@@ -2875,7 +2875,7 @@ table tr td#status a {
     background: var(--modal-bg-color);
     padding: 5px;
     border: 2px solid rgba(221, 221, 221, 0);
-    color: white;
+    color: var(--text-hover);
     font-size: 1.2em;
     position: absolute;
     top: 20%;
diff --git a/css/base/netdata/netdata-base.css b/css/base/netdata/netdata-base.css
index 1946f5e6..52912d82 100644
--- a/css/base/netdata/netdata-base.css
+++ b/css/base/netdata/netdata-base.css
@@ -98,12 +98,12 @@ a:hover,
 }
 
 .navbar-default .navbar-brand {
-    color: #ffffff !important;
+    color: var(--text-hover) !important;
 }
 
 .navbar-default .navbar-brand:hover,
 .navbar-default .navbar-brand:focus {
-    color: #ffffff !important;
+    color: var(--text-hover) !important;
     background-color: rgba(0, 0, 0, .25) !important;
 }
 
@@ -111,7 +111,7 @@ a:hover,
 .navbar-inverse .navbar-nav>li>a {
     border-right: 1px solid rgba(0, 0, 0, 0) !important;
     border-left: 1px solid rgba(0, 0, 0, 0) !important;
-    color: #ffffff !important;
+    color: var(--text-hover) !important;
 }
 
 .nav-tabs>li.active>a,
@@ -303,7 +303,7 @@ table {
 .close,
 .close:hover,
 .close:focus {
-    color: #ffffff !important;
+    color: var(--text-hover) !important;
 }
 
 /* System Overview */
@@ -353,7 +353,7 @@ code {
 .easyPieChartTitle,
 .easyPieChartLabel,
 .easyPieChartUnits {
-    color: #ffffff !important;
+    color: var(--text-hover) !important;
 }
 
 .netdata-legend-value,
@@ -361,12 +361,12 @@ code {
 .netdata-legend-toolbox-button,
 .dygraph-axis-label {
     background-color: rgba(0, 0, 0, 0) !important;
-    color: #ffffff !important;
+    color: var(--text-hover) !important;
 }
 
 .netdata-legend-resize-handler {
     background-color: rgba(0, 0, 0, 0) !important;
-    color: #ffffff !important;
+    color: var(--text-hover) !important;
 }
 
 .netdata-legend-name-table-line {
diff --git a/css/base/nzbget/nzbget-base.css b/css/base/nzbget/nzbget-base.css
index cd2f5f9d..93c212c6 100644
--- a/css/base/nzbget/nzbget-base.css
+++ b/css/base/nzbget/nzbget-base.css
@@ -183,7 +183,7 @@ tr.checked:nth-child(odd) .progress {
 
 .bar-text-left,
 .bar-text-right {
-    color: #fff;
+    var(--text-hover);
 }
 
 /* NAVBAR */
@@ -382,7 +382,7 @@ div.check:hover {
 #ConfigData>div:nth-child(5)>div>button {
     text-shadow: unset;
     background: rgba(0, 0, 0, 0.25);
-    color: white;
+    color: var(--text-hover);
 }
 
 #ConfigData>div:nth-child(3)>div>button:hover,
@@ -390,7 +390,7 @@ div.check:hover {
 #ConfigData>div:nth-child(5)>div>button:hover {
     text-shadow: unset;
     background: hsla(0, 0%, 100%, .08);
-    color: white;
+    color: var(--text-hover);
 }
 
 #ConfigData input.btn.btn-primary {
@@ -408,24 +408,24 @@ div.check:hover {
 
 #Config_ViewButton {
     background: rgba(0, 0, 0, 0.25);
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 #Config_ViewButton:hover {
     background: hsla(0, 0%, 100%, .08);
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 #DownloadsEditDialog input.btn.btn-primary {
     background: var(--button-color) !important;
     text-shadow: unset;
-    color: white;
+    color: var(--button-text);
 }
 
 #HistoryEdit_ParamData input.btn.btn-primary {
     background: var(--button-color) !important;
     text-shadow: unset;
-    color: white;
+    color: var(--button-text);
 }
 
 .btn {
@@ -606,16 +606,16 @@ label {
 }
 
 span.help-option-title {
-    color: #eee;
+    color: var(--text);
 }
 
 .help-block,
 .help-inline {
-    color: #eee;
+    color: var(--text);
 }
 
 .confirm-help-block {
-    color: #eee;
+    color: var(--text);
     font-size: 13px;
     line-height: 16px;
     margin-bottom: 0;
@@ -633,7 +633,7 @@ span.help-option-title {
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
     background-color: transparent;
-    color: #FFFFFF !important;
+    color: var(--text-hover) !important;
     border: none;
 }
 
diff --git a/css/base/nzbhydra2/nzbhydra2-base.css b/css/base/nzbhydra2/nzbhydra2-base.css
index 215390f7..82b4959a 100644
--- a/css/base/nzbhydra2/nzbhydra2-base.css
+++ b/css/base/nzbhydra2/nzbhydra2-base.css
@@ -424,7 +424,7 @@ hr {
 .alert-warning {
     background: rgba(255, 255, 255, 0.25);
     border-color: transparent;
-    color: #fff;
+    color: var(--text-hover);
 }
 
 .panel-default>.panel-heading {
@@ -465,7 +465,7 @@ table {
 }
 
 .search-result-tbody {
-    color: white;
+    color: var(--text-hover);
 }
 
 pre {
diff --git a/css/base/ombi/ombi-base.css b/css/base/ombi/ombi-base.css
index 84d28908..368f78f8 100644
--- a/css/base/ombi/ombi-base.css
+++ b/css/base/ombi/ombi-base.css
@@ -37,7 +37,7 @@ html, body, .wizard-background, .content-container, #main-container\ dark > mat-
 }
 
 .container-alert {
-    color: #fff;
+    color: var(--text-hover);
     background-color: rgb(0 0 0 / 50%) !important;
     border-color: rgb(var(--accent-color)) !important;
 }
@@ -130,7 +130,7 @@ a:hover {
 
 .sidenav-container .sidenav {
     background: var(--modal-bg-color) !important;
-    color: #fff;
+    color: var(--text-hover);
     font-family: Montserrat, sans-serif;
     width: 16rem;
 }
@@ -231,7 +231,7 @@ a:hover {
     background: rgb(255 255 255 / 8%) !important;
     border: 1px solid rgb(255 255 255 / 10%) !important;
     border-radius: 30px;
-    color: #fff;
+    color: var(--text-hover);
     margin-bottom: 10px;
     margin-right: 30px;
 }
@@ -528,7 +528,7 @@ button.admin-cog {
 }
 
 .grow:hover {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 /* FORMS */
diff --git a/css/base/organizr/organizr-base.css b/css/base/organizr/organizr-base.css
index da7905fe..052b2028 100644
--- a/css/base/organizr/organizr-base.css
+++ b/css/base/organizr/organizr-base.css
@@ -694,7 +694,7 @@ th.fc-day-header.fc-widget-header.fc-today {
 #plex-login-heading>a,
 #recoverform>div:nth-child(1)>div>h3,
 #recoverform>div:nth-child(1)>div>p {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 #login-username-Input::placeholder,
@@ -710,7 +710,7 @@ label[for="checkbox-login"] {
 
 #to-recover:hover,
 label[for="checkbox-login"]:hover {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 #organizr-login-collapse>div>div.form-group.text-center.m-t-20.m-b-0>div>button,
@@ -718,7 +718,7 @@ label[for="checkbox-login"]:hover {
 #leave-recover,
 #form-lockscreen>div.form-group.text-center>div>button {
     background: rgb(255 255 255 / 15%) !important;
-    color: #eee !important;
+    color: var(--text)  !important;
     border-radius: 25px;
     border: none;
 }
@@ -731,7 +731,7 @@ label[for="checkbox-login"]:hover {
         background-color: rgba(0, 0, 0, 0.45) !important;
         -webkit-backdrop-filter: blur(10px);
         backdrop-filter: blur(10px);
-        color: white !important;
+        color: var(--text-hover)  !important;
     }
 }
 
@@ -771,7 +771,7 @@ label[for="checkbox-login"]:hover {
 /*2FA animation header*/
 .panel-warning .panel-heading,
 .panel-yellow .panel-heading {
-    color: #fff;
+    color: var(--text-hover);
     border-radius: 3px;
     background-color: rgba(0, 0, 0, 0.3);
     border-color: #00000000;
@@ -807,7 +807,7 @@ label[for="checkbox-login"]:hover {
 }
 
 #form-lockscreen>div:nth-child(1)>div>div>h3 {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 .login-sidebar .white-box {
@@ -921,7 +921,7 @@ label[for="checkbox-login"]:hover {
 
 #splashScreen .flexbox:last-of-type .bg-danger {
     background: transparent !important;
-    color: #fff !important;
+    color: var(--text-hover) !important;
     border: 0 !important;
     border-radius: 100px;
     height: 0px !important;
@@ -986,7 +986,7 @@ label[for="checkbox-login"]:hover {
 }
 
 .splash-badge {
-    color: #fff;
+    color: var(--text-hover);
     width: 80px !important;
     height: 80px;
     font-size: 60px;
@@ -1010,12 +1010,12 @@ label[for="checkbox-login"]:hover {
 
 .color-table.info-table thead th {
     background-color: rgba(61, 33, 33, 0.25);
-    color: #fff;
+    color: var(--text-hover);
 }
 
 .bg-success.text-inverse {
     background-color: rgba(255, 255, 255, 0.15) !important;
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 .panel-blue a,
@@ -1106,7 +1106,7 @@ label[for="checkbox-login"]:hover {
 .icon-control-play,
 .icon-screen-desktop,
 .icon-control-pause {
-    color: white !important;
+    color: var(--text-hover)  !important;
 }
 
 .label-info {
@@ -1134,7 +1134,7 @@ label[for="checkbox-login"]:hover {
 .panel-black .panel-heading,
 .panel-inverse .panel-heading {
     border-color: transparent;
-    color: #fff;
+    color: var(--text-hover);
     background: var(--modal-bg-color);
     background-repeat: repeat, no-repeat;
     background-attachment: fixed, fixed;
@@ -1437,8 +1437,8 @@ a:hover,
 
 .el-element-overlay .el-card-item .el-overlay-1 .el-info>li a:hover {
     background: transparent;
-    color: white !important;
-    border: white !important;
+    color: var(--text-hover)  !important;
+    border: var(--text-hover)  !important;
 }
 
 .progress-bar-info {
@@ -1478,7 +1478,7 @@ a:hover,
 
 .bg-inverse .healthPosition h3,
 .bg-inverse .healthPosition h5 {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 #homepageOrderhealthchecks .card-body {
@@ -1505,12 +1505,12 @@ a:hover,
 }
 
 .homepage-tautulli-card .cardCountType {
-    color: #eee;
+    color: var(--text);
 }
 
 .homepage-tautulli-card .tautulliRank,
 .homepage-tautulli-card .tautulliSeparator {
-    color: #eee;
+    color: var(--text);
 }
 
 .homepage-tautulli-card .bg-img-cont {
@@ -2398,7 +2398,7 @@ h6 .small,
 h6 small,
 tbody,
 th {
-    color: #ffffff;
+    color: var(--text-hover);
 }
 
 .bootstrap-tagsinput,
@@ -2466,19 +2466,19 @@ input:active:not(select),
 
 .cp-container .cp-pills li a {
     padding: 5px;
-    color: #FFF;
+    color: var(--text-hover);
     text-decoration: none;
 }
 
 .cp-container .cp-pills li a.active,
 .cp-container .cp-pills li a:hover {
     background-color: #2cabe3;
-    color: #fff
+    color: #fff;
 }
 
 .jq-icon-info {
     background-color: rgba(71, 68, 68, 0.93);
-    color: #FFF;
+    color: var(--text-hover);
     border-color: #bce8f1;
 }
 
diff --git a/css/base/petio/petio-base.css b/css/base/petio/petio-base.css
index 98fe48ed..c1f0acca 100644
--- a/css/base/petio/petio-base.css
+++ b/css/base/petio/petio-base.css
@@ -230,7 +230,7 @@ p a:hover,
 }
 
 .request-status {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 .filter--action {
@@ -243,11 +243,11 @@ p a:hover,
 }
 
 .console--item {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 code {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 .color-green,
@@ -297,7 +297,7 @@ code {
 }
 
 .push-msg--item {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 
@@ -370,7 +370,7 @@ code {
 .requests--status__cinema,
 .requests--status__blue,
 .requests--status__manual {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 .myrequests--item--details .detail-steps--item__active {
@@ -387,7 +387,7 @@ code {
 }
 
 .request-count {
-    color: #fff;
+    color: var(--text-hover);
     background: rgba(var(--accent-color), .8);
 }
 
@@ -477,7 +477,7 @@ a.rbc-show-more {
 }
 
 .calendar--event p {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 /* PLACEHOLDER TEXT */
diff --git a/css/base/plpp/plpp-base.css b/css/base/plpp/plpp-base.css
index eb81cc7a..0edf3862 100644
--- a/css/base/plpp/plpp-base.css
+++ b/css/base/plpp/plpp-base.css
@@ -228,7 +228,7 @@ table,
 
 .pagination>li>a,
 .pagination>li>span {
-    color: #ffffff;
+    color: var(--text-hover);
     background-color: rgba(0, 0, 0, 0.25);
     border: transparent;
 }
@@ -280,5 +280,5 @@ div.modal-body,
 }
 
 .modal-header .close:hover {
-    color: #fff;
+    color: var(--text-hover);
 }
\ No newline at end of file
diff --git a/css/base/portainer/portainer-base.css b/css/base/portainer/portainer-base.css
index 5cc29919..3d8baaa4 100644
--- a/css/base/portainer/portainer-base.css
+++ b/css/base/portainer/portainer-base.css
@@ -13,8 +13,8 @@
 @import url("/css/defaults/placeholders.css");
 
 :root {
-    --text-json-tree-branch-preview-color: #eee;
-    --text-json-tree-leaf-color: #eee;
+    --text-json-tree-branch-preview-color: var(--text);
+    --text-json-tree-leaf-color: var(--text);
     }
 
 /* Scrollbar */
@@ -555,13 +555,13 @@ output {
 /* STACKS */
 .CodeMirror {
     background: rgba(255, 255, 255, 0.10);
-    color: white;
+    color: var(--text-hover);
 }
 
 .CodeMirror-gutters {
     border-right: 1px solid rgba(255, 255, 255, 0.25);
     background-color: rgba(0, 0, 0, 0.25);
-    caret-color: white;
+    caret-color: var(--text-hover);
 }
 
 .CodeMirror-linenumber {
@@ -582,7 +582,7 @@ output {
 .nav-tabs>li.active>a,
 .nav-tabs>li.active>a:focus,
 .nav-tabs>li.active>a:hover {
-    color: #fff;
+    color: var(--text-hover);
     cursor: default;
     background-color: rgba(255, 255, 255, 0.15);
     border: 1px solid #ddd0;
@@ -606,14 +606,14 @@ output {
 
 /* LOGS */
 .log_viewer {
-    color: #fff;
+    color: var(--text-hover);
     background-color: rgba(255, 255, 255, 0.1);
     border: 1px solid transparent;
 }
 
 /* JSON TREE */
 json-tree {
-    color: #eee;
+    color: var(--text);
 }
 
 json-tree .key {
@@ -622,7 +622,7 @@ json-tree .key {
 }
 
 pre {
-    color: #fff;
+    color: var(--text-hover);
     background-color: rgba(255, 255, 255, .1);
     border: 1px solid transparent;
 }
diff --git a/css/base/prowlarr/prowlarr-base.css b/css/base/prowlarr/prowlarr-base.css
index 00b45811..46a52f28 100644
--- a/css/base/prowlarr/prowlarr-base.css
+++ b/css/base/prowlarr/prowlarr-base.css
@@ -111,7 +111,7 @@ a:hover {
 }
 
 [class*="LoadingIndicator-ripple-"] {
-    border: 2px solid #fff;
+    border: 2px solid var(--text-hover);
 }
 
 /* MODAL */
@@ -149,18 +149,18 @@ a:hover {
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    color: #fff;
+    color: var(--text-hover);
     border-top: 1px solid rgb(var(--accent-color));
 }
 
 [class*="ModalContent-closeButton-"]:hover {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 /* INPUT */
 [class*="TagInput-internalInput-"] {
     background-color: transparent;
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="SelectInput-select-"] {
@@ -210,7 +210,7 @@ a:hover {
 
 /* RADARR SPECIFIC */
 [class*="IndexerSearchInput-sectionTitle-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="IndexerSearchInput-containerOpen-"] [class*="IndexerSearchInput-movieContainer-"] {
@@ -223,7 +223,7 @@ a:hover {
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    color: #fff !important;
+    color: var(--text-hover) !important;
     box-shadow: 0 0 10px 1px transparent !important;
 }
 
@@ -347,7 +347,7 @@ a:hover {
 }
 
 [class*="MonitorToggleButton-toggleButton-"] {
-    color: #dadada;
+    color: var(--text-hover);
 }
 
 
@@ -364,7 +364,7 @@ a:hover {
 }
 
 [class*="MovieDetailsSeason-seasonNumber-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="MovieDetailsSeason-collapseButtonContainer-"] {
@@ -383,7 +383,7 @@ a:hover {
 }
 
 .Table-table-2C3O8 {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="Tooltip-tooltip-"][class*="Tooltip-inverse-"],
@@ -425,7 +425,7 @@ a:hover {
 }
 
 [class*="EpisodeTitleLink-link-"]:hover {
-    color: #ffffff;
+    color: var(--text-hover);
     text-decoration: none;
 }
 
@@ -589,7 +589,7 @@ a:hover {
 
 /* ALPHABET JUMP BAR */
 [class*="PageJumpBar-jumpBar-"] {
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 /* MINI RIGHT SCROLL BAR */
@@ -668,7 +668,7 @@ a:hover {
 [class*="CheckInput-isIndeterminate-"] {
     border: none;
     background-color: rgba(255, 255, 255, 0.08);
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="IndexerSearchInput-container-"] [class*="Input-input-"] {
@@ -682,17 +682,17 @@ a:hover {
 }
 
 [class*="IndexerSearchResult-alternateTitle-"] {
-    color: #ffffff;
+    color: var(--text-hover);
     font-size: 12px;
 }
 
 [class*="AddNewMovieSearchResult-year-"] {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 [class*="Input-input-"]:focus {
     outline: 0;
-    border-color: #fff;
+    border-color: var(--text-hover);
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.25);
 }
@@ -721,12 +721,12 @@ a:hover {
 }
 
 [class*="AddNewmovieModalContent-year-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="RootFolderSelectInputSelectedValue-movieFolder-"],
 [class*="RootFolderSelectInputSelectedValue-freeSpace-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="RootFolderSelectInputOption-freeSpace-"],
@@ -798,7 +798,7 @@ input:focus:-ms-input-placeholder {
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    color: white;
+    color: var(--text-hover);
 }
 
 [class*="ImportMovieSearchResult-movie-"]:hover {
@@ -825,7 +825,7 @@ input:focus:-ms-input-placeholder {
 }
 
 [class*="AddListMovieOverview-link-"]:hover {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="AddListMovieOverview-content-"]:hover {
@@ -833,14 +833,14 @@ input:focus:-ms-input-placeholder {
 }
 
 [class*="PageJumpBarItem-jumpBarItem-"]:hover {
-    color: #fff;
+    color: var(--text-hover);
     background: hsla(0, 0%, 100%, .08);
 }
 
 /*Posters*/
 [class*="AddListMoviePoster-title-"] {
     background-color: rgba(255, 255, 255, 0.08);
-    color: #fff;
+    color: var(--text-hover);
 }
 
 /* MASS EDITOR */
@@ -848,7 +848,7 @@ input:focus:-ms-input-placeholder {
 [class*="PageContentFooter-contentFooter-"] {
     border: none;
     background-color: rgba(0, 0, 0, .25);
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 /* CALENDAR */
@@ -930,7 +930,7 @@ input:focus:-ms-input-placeholder {
 [class*="CalendarEvent-movieTitle-"],
 [class*="CalendarEvent-episodeInfo-"],
 [class*="CalendarEvent-airTime-"] {
-    color: #ffffff !important;
+    color: var(--text-hover) !important;
 }
 
 [class*="CalendarEvent-movieInfo-"] {
@@ -946,7 +946,7 @@ input:focus:-ms-input-placeholder {
 }
 
 [class*="CalendarEventGroup-movieTitle-"] {
-    color: #ffffff !important;
+    color: var(--text-hover) !important;
 }
 
 [class*="CalendarEventGroup-airTime-"] {
@@ -1019,7 +1019,7 @@ input:focus:-ms-input-placeholder {
 
 
 [class*="-cloneButton-"][class*="IconButton-button-"]:hover {
-    color: white;
+    color: var(--text-hover);
 }
 
 [class*="Card-card-"]:hover,
@@ -1046,7 +1046,7 @@ input:focus:-ms-input-placeholder {
 [class*="LanguageProfileItem-languageProfileItem-"] {
     border: none;
     background-color: rgba(0, 0, 0, .25);
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 [class*="QualityProfileItemGroup-qualityProfileItemGroup-"][class*="QualityProfileItemGroup-editGroups-"] {
@@ -1061,7 +1061,7 @@ input:focus:-ms-input-placeholder {
 [class*="KeyValueListInputItem-valueInput-"] {
     border: none;
     background: transparent;
-    color: white;
+    color: var(--text-hover);
 }
 
 [class*="QualityProfileFormatItem-qualityProfileFormatItem-"] {
@@ -1145,7 +1145,7 @@ input[type=email],
 input[type=password] {
     border: none;
     background-color: rgba(255, 255, 255, 0.08);
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 .button {
@@ -1157,13 +1157,13 @@ input[type=password] {
 .button:hover {
     border-color: var(--button-color-hover);
     background-color: var(--button-color-hover);
-    color: #fff;
+    color: var(--button-text-hover);
     text-decoration: none;
 }
 
 .form-input:focus {
     outline: 0;
-    border-color: #fff;
+    border-color: var(--text-hover);
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.25);
 }
diff --git a/css/base/qbittorrent/qbittorrent-base.css b/css/base/qbittorrent/qbittorrent-base.css
index 760cd5ff..56205d07 100644
--- a/css/base/qbittorrent/qbittorrent-base.css
+++ b/css/base/qbittorrent/qbittorrent-base.css
@@ -514,7 +514,7 @@ ul.filterList li:hover:before {
 
 .progressbar_light {
   background: rgba(0, 0, 0, 0.25) !important;
-  color: #fff !important;
+  color: var(--text-hover) !important;
 }
 
 .progressbar_wrapper {
@@ -1223,7 +1223,7 @@ input[type="submit"i]:hover {
   font-weight: 900;
   display: inline-block;
   margin-right: 5px;
-  color: white;
+  color: var(--text-hover);
   opacity: 0;
 }
 
@@ -1251,7 +1251,7 @@ input[type="submit"i]:hover {
   font-weight: 900;
   display: inline-block;
   margin-right: 5px;
-  color: white;
+  color: var(--text-hover);
   opacity: 0;
 }
 
@@ -1279,7 +1279,7 @@ input[type="submit"i]:hover {
   font-weight: 900;
   display: inline-block;
   margin-right: 5px;
-  color: white;
+  color: var(--text-hover);
   opacity: 0;
 }
 
@@ -1323,7 +1323,7 @@ input[type="submit"i]:hover {
   font-weight: 900;
   display: inline-block;
   margin-right: 5px;
-  color: white;
+  color: var(--text-hover);
   opacity: 0;
 }
 
@@ -1334,7 +1334,7 @@ input[type="submit"i]:hover {
   font-weight: 900;
   display: inline-block;
   margin-right: 5px;
-  color: white;
+  color: var(--text-hover);
   opacity: 0;
 }
 
@@ -1362,7 +1362,7 @@ input[type="submit"i]:hover {
   font-weight: 900;
   display: inline-block;
   margin-right: 5px;
-  color: white;
+  color: var(--text-hover);
   opacity: 0;
 }
 
diff --git a/css/base/radarr/radarr-base.css b/css/base/radarr/radarr-base.css
index 06dfdcfe..3079431b 100644
--- a/css/base/radarr/radarr-base.css
+++ b/css/base/radarr/radarr-base.css
@@ -112,7 +112,7 @@ a:hover {
 }
 
 [class*="LoadingIndicator-ripple-"] {
-    border: 2px solid #fff;
+    border: 2px solid var(--text-hover);
 }
 
 /* MODAL */
@@ -150,18 +150,18 @@ a:hover {
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    color: #fff;
+    color: var(--text-hover);
     border-top: 1px solid rgb(var(--accent-color));
 }
 
 [class*="ModalContent-closeButton-"]:hover {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 /* INPUT */
 [class*="TagInput-internalInput-"] {
     background-color: transparent;
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="SelectInput-select-"] {
@@ -209,7 +209,7 @@ a:hover {
 
 /* RADARR SPECIFIC */
 [class*="MovieSearchInput-sectionTitle-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="MovieSearchInput-containerOpen-"] [class*="MovieSearchInput-movieContainer-"] {
@@ -222,7 +222,7 @@ a:hover {
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    color: #fff !important;
+    color: var(--text-hover) !important;
     box-shadow: 0 0 10px 1px transparent !important;
 }
 
@@ -356,7 +356,7 @@ a:hover {
 }
 
 [class*="MonitorToggleButton-toggleButton-"] {
-    color: #dadada;
+    color: var(--text-hover);
 }
 
 
@@ -373,7 +373,7 @@ a:hover {
 }
 
 [class*="MovieDetailsSeason-seasonNumber-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="MovieDetailsSeason-collapseButtonContainer-"] {
@@ -430,7 +430,7 @@ a:hover {
 }
 
 [class*="EpisodeTitleLink-link-"]:hover {
-    color: #fff;
+    color: var(--text-hover);
     text-decoration: none;
 }
 
@@ -599,7 +599,7 @@ a:hover {
 
 /* ALPHABET JUMP BAR */
 [class*="PageJumpBar-jumpBar-"] {
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 /* MINI RIGHT SCROLL BAR */
@@ -679,7 +679,7 @@ a:hover {
 [class*="CheckInput-isIndeterminate-"] {
     border: none;
     background-color: rgba(255, 255, 255, 0.08);
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="MovieSearchInput-container-"] [class*="Input-input-"] {
@@ -693,17 +693,17 @@ a:hover {
 }
 
 [class*="MovieSearchResult-alternateTitle-"] {
-    color: #fff;
+    color: var(--text-hover);
     font-size: 12px;
 }
 
 [class*="AddNewMovieSearchResult-year-"] {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 [class*="Input-input-"]:focus {
     outline: 0;
-    border-color: #fff;
+    border-color: var(--text-hover);
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.25);
 }
@@ -738,12 +738,12 @@ a:hover {
 }
 
 [class*="AddNewmovieModalContent-year-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="RootFolderSelectInputSelectedValue-movieFolder-"],
 [class*="RootFolderSelectInputSelectedValue-freeSpace-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="RootFolderSelectInputOption-freeSpace-"],
@@ -815,7 +815,7 @@ input:focus:-ms-input-placeholder {
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    color: white;
+    color: var(--text-hover);
 }
 
 [class*="ImportMovieSearchResult-movie-"]:hover {
@@ -848,7 +848,7 @@ input:focus:-ms-input-placeholder {
 }
 
 [class*="AddListMovieOverview-link-"]:hover {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="AddListMovieOverview-content-"]:hover {
@@ -856,14 +856,14 @@ input:focus:-ms-input-placeholder {
 }
 
 [class*="PageJumpBarItem-jumpBarItem-"]:hover {
-    color: #fff;
+    color: var(--text-hover);
     background: hsla(0, 0%, 100%, .08);
 }
 
 /*Posters*/
 [class*="AddListMoviePoster-title-"] {
     background-color: rgba(255, 255, 255, 0.08);
-    color: #fff;
+    color: var(--text-hover);
 }
 
 /* MASS EDITOR */
@@ -871,12 +871,12 @@ input:focus:-ms-input-placeholder {
 [class*="PageContentFooter-contentFooter-"] {
     border: none;
     background-color: rgba(0, 0, 0, .25);
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 /* CALENDAR */
 [class*="CircularProgressBar-circularProgressBarContainer-"] svg circle {
-    stroke: white !important;
+    stroke: var(--text-hover) !important;
 }
 
 [class*="CalendarEvent-downloaded-"] {
@@ -986,7 +986,7 @@ input:focus:-ms-input-placeholder {
 [class*="CalendarEvent-episodeInfo-"],
 [class*="CalendarEvent-airTime-"],
 [class*="CalendarEvent-link-"] {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 [class*="CalendarEvent-event-"] {
@@ -998,7 +998,7 @@ input:focus:-ms-input-placeholder {
 }
 
 [class*="CalendarEventGroup-movieTitle-"] {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 [class*="CalendarEventGroup-airTime-"] {
@@ -1076,7 +1076,7 @@ input:focus:-ms-input-placeholder {
 
 
 [class*="-cloneButton-"][class*="IconButton-button-"]:hover {
-    color: white;
+    color: var(--text-hover);
 }
 
 [class*="Card-card-"]:hover {
@@ -1095,7 +1095,7 @@ input:focus:-ms-input-placeholder {
 [class*="LanguageProfileItem-languageProfileItem-"] {
     border: none;
     background-color: rgba(0, 0, 0, .25);
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 [class*="QualityProfileItemGroup-qualityProfileItemGroup-"][class*="QualityProfileItemGroup-editGroups-"] {
@@ -1106,7 +1106,7 @@ input:focus:-ms-input-placeholder {
 [class*="KeyValueListInputItem-valueInput-"] {
     border: none;
     background: transparent;
-    color: white;
+    color: var(--text-hover);
 }
 
 [class*="QualityProfileFormatItem-qualityProfileFormatItem-"] {
@@ -1187,7 +1187,7 @@ input[type=email],
 input[type=password] {
     border: none;
     background-color: rgba(255, 255, 255, 0.08);
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 .button {
@@ -1199,13 +1199,13 @@ input[type=password] {
 .button:hover {
     border-color: var(--button-color-hover);
     background-color: var(--button-color-hover);
-    color: #fff;
+    color: var(--button-text-hover);
     text-decoration: none;
 }
 
 .form-input:focus {
     outline: 0;
-    border-color: #fff;
+    border-color: var(--text-hover);
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.25);
 }
diff --git a/css/base/readarr/readarr-base.css b/css/base/readarr/readarr-base.css
index 67dfc0fc..eb137b57 100644
--- a/css/base/readarr/readarr-base.css
+++ b/css/base/readarr/readarr-base.css
@@ -111,7 +111,7 @@ a:hover {
 }
 
 [class*="LoadingIndicator-ripple-"] {
-    border: 2px solid #fff;
+    border: 2px solid var(--text-hover);
 }
 
 /* MODAL */
@@ -151,18 +151,18 @@ a:hover {
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    color: #fff;
+    color: var(--text-hover);
     border-top: 1px solid rgb(var(--accent-color));
 }
 
 [class*="ModalContent-closeButton-"]:hover {
-    color: #fff;
+    color: var(--button-text-hover);
 }
 
 /* INPUT */
 [class*="TagInput-internalInput-"] {
     background-color: transparent;
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="SelectInput-select-"] {
@@ -210,7 +210,7 @@ a:hover {
 
 /* LIDARR SPECIFIC */
 [class*="AuthorSearchInput-sectionTitle-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="AuthorSearchInput-containerOpen-"] [class*="AuthorSearchInput-authorContainer-"] {
@@ -223,7 +223,7 @@ a:hover {
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    color: #fff !important;
+    color: var(--text-hover) !important;
     box-shadow: 0 0 10px 1px transparent !important;
 }
 
@@ -404,7 +404,7 @@ a:hover {
 [class*="AuthorDetailsSeason-albumCount-"],
 [class*="AuthorDetails-metadataMessage-"],
 [class*="AuthorDetailsSeason-albumCount-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 .fa-search:hover {
@@ -422,7 +422,7 @@ a:hover {
 }
 
 [class*="MonitorToggleButton-toggleButton-"] {
-    color: #dadada;
+    color: var(--text-hover);
 }
 
 [class*="ProtocolLabel-torrent-"] {
@@ -439,7 +439,7 @@ a:hover {
 
 /*ARTIST ALBUM PAGE*/
 [class*="AlbumDetailsMedium-mediumNumber-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="AlbumDetailsMedium-medium-"] {
@@ -468,7 +468,7 @@ a:hover {
 [class*="AuthorIndexBanner-title-"],
 [class*="AuthorIndexBannerInfo-info-"] {
     background-color: rgba(0, 0, 0, .25);
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="Tooltip-tooltip-"][class*="Tooltip-inverse-"],
@@ -510,7 +510,7 @@ a:hover {
 }
 
 [class*="EpisodeTitleLink-link-"]:hover {
-    color: #ffffff;
+    color: var(--text-hover);
     text-decoration: none;
 }
 
@@ -674,7 +674,7 @@ a:hover {
 
 /* ALPHABET JUMP BAR */
 [class*="PageJumpBar-jumpBar-"] {
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 /* SEARCH BAR */
@@ -683,12 +683,12 @@ a:hover {
 [class*="CheckInput-isIndeterminate-"] {
     border: none;
     background-color: rgba(255, 255, 255, 0.08);
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="AuthorSearchInput-input-"][class*="Input-input-"] {
     background: transparent;
-    border-bottom: solid 1px #fff;
+    border-bottom: solid 1px var(--text-hover);
 }
 
 [class*="AuthorSearchInput-input-"][class*="Input-input-"]:focus {
@@ -697,20 +697,20 @@ a:hover {
 }
 
 [class*="AuthorSearchResult-alternateTitle-"] {
-    color: #ffffff;
+    color: var(--text-hover);
     font-size: 12px;
 }
 
 [class*="Input-input-"]:focus {
     outline: 0;
-    border-color: #fff;
+    border-color: var(--text-hover);
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.25);
 }
 
 [class*="TagInput-input-"][class*="TagInput-isFocused-"] {
     outline: 0;
-    border-color: #fff;
+    border-color: var(--text-hover);
     box-shadow: none;
 }
 
@@ -726,7 +726,7 @@ a:hover {
 }
 
 [class*="AddNewAuthorSearchResult-year-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="AddNewAuthorSearchResult-searchResult-"],
@@ -744,7 +744,7 @@ a:hover {
 }
 
 [class*="RootFolderSelectInputSelectedValue-freeSpace-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="RootFolderSelectInputOption-freeSpace-"] {
@@ -762,7 +762,7 @@ a:hover {
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    color: #FFF;
+    color: var(--text-hover);
     border: 1px solid transparent;
 }
 
@@ -813,7 +813,7 @@ input:focus:-ms-input-placeholder {
 /* IMPORT */
 /* Text color */
 [class*="ImportAuthorSelectFolder-header-"] {
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 [class*="ExpandingFileDetails-fileDetails-"] {
@@ -826,7 +826,7 @@ input:focus:-ms-input-placeholder {
 [class*="ImportAuthorSelectAuthor-button-"] {
     border: none;
     background-color: rgba(0, 0, 0, 0.25) !important;
-    color: #fff;
+    color: var(--text-hover);
 }
 
 
@@ -844,7 +844,7 @@ input:focus:-ms-input-placeholder {
 /*Title*/
 
 [class*="PageJumpBarItem-jumpBarItem-"]:hover {
-    color: #fff;
+    color: var(--text-hover);
     background: hsla(0, 0%, 100%, .08);
 }
 
@@ -857,12 +857,12 @@ input:focus:-ms-input-placeholder {
 [class*="PageContentFooter-contentFooter-"] {
     border: none;
     background-color: rgba(0, 0, 0, .25);
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 /* CALENDAR */
 [class*="CircularProgressBar-circularProgressBarContainer-"] svg circle {
-    stroke: white !important;
+    stroke: var(--text-hover) !important;
 }
 
 [class*="CalendarEvent-downloaded-"]:not([class*="AgendaEvent-"]) {
@@ -919,7 +919,7 @@ input:focus:-ms-input-placeholder {
 
 [class*="DayOfWeek-dayOfWeek-"] {
     background-color: hsla(0, 0%, 100%, .08);
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="CalendarDay-dayOfMonth-"] {
@@ -930,19 +930,19 @@ input:focus:-ms-input-placeholder {
 [class*="CalendarDay-isToday-"],
 [class*="DayOfWeek-isToday-"] {
     background-color: hsla(0, 0%, 100%, .25) !important;
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="CalendarEvent-authorName-"] a,
 [class*="CalendarEvent-authorName-"],
 [class*="CalendarEvent-bookTitle-"] a,
 [class*="CalendarEvent-bookTitle-"]{
-color: #eee !important;
+color: var(--text-hover) !important;
 }
 
 [class*="CalendarEvent-authorName-"] a:hover,
 [class*="CalendarEvent-bookTitle-"]  a:hover{
-color: #fff !important;
+color: var(--text-hover) !important;
 }
 
 [class*="CalendarEvent-event-"] {
@@ -1031,7 +1031,7 @@ color: #fff !important;
 
 
 [class*="-cloneButton-"][class*="IconButton-button-"]:hover {
-    color: white;
+    color: var(--text-hover);
 }
 
 [class*="Card-card-"]:hover {
@@ -1050,7 +1050,7 @@ color: #fff !important;
 [class*="LanguageProfileItem-languageProfileItem-"] {
     border: none;
     background-color: rgba(0, 0, 0, .25);
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 [class*="QualityProfileItemGroup-qualityProfileItemGroup-"][class*="QualityProfileItemGroup-editGroups-"] {
@@ -1061,7 +1061,7 @@ color: #fff !important;
 [class*="KeyValueListInputItem-valueInput-"] {
     border: none;
     background: transparent;
-    color: white;
+    color: var(--text-hover);
 }
 
 [class*="QualityProfileFormatItem-qualityProfileFormatItem-"] {
@@ -1171,7 +1171,7 @@ input[type=email],
 input[type=password] {
     border: none;
     background-color: rgba(255, 255, 255, 0.08);
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 .button {
@@ -1183,13 +1183,13 @@ input[type=password] {
 .button:hover {
     border-color: var(--button-color-hover);
     background-color: var(--button-color-hover);
-    color: #fff;
+    color: var(--button-text-hover);
     text-decoration: none;
 }
 
 .form-input:focus {
     outline: 0;
-    border-color: #fff;
+    border-color: var(--text-hover);
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.25);
 }
@@ -1227,7 +1227,7 @@ input[type=password] {
 
 /*Author Page*/
 [class*="AuthorDetails-tab-"] {
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 [class*="AuthorIndexBanner-title-"] {
@@ -1287,11 +1287,11 @@ input[type=password] {
 }
 
 [class*="AuthorDetailsSeries-bookTypeLabel-"] {
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 [class*="AuthorDetailsSeries-bookCount-"] {
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 /*Search Tab*/
@@ -1314,5 +1314,5 @@ input[type=password] {
 
 /*Specific Book Page*/
 [class*="BookDetails-tab-"] {
-    color: #FFF;
+    color: var(--text-hover);
 }
diff --git a/css/base/requestrr/requestrr-base.css b/css/base/requestrr/requestrr-base.css
index 966cbd1e..ebaf9f48 100644
--- a/css/base/requestrr/requestrr-base.css
+++ b/css/base/requestrr/requestrr-base.css
@@ -110,7 +110,7 @@ h6,
 }
 
 #sidenav-main>div>div>ul.mb-md-3.navbar-nav>li:nth-child(3)>a>i {
-    color: white !important;
+    color: var(--text-hover) !important;
 }
 
 .card-profile-image img,
@@ -278,7 +278,7 @@ h6,
 
 .btn-default,
 .btn-default:hover {
-    color: #fff;
+    color: var(--text-hover);
     background-color: rgba(255, 255, 255, 0.25);
     border-color: transparent;
 }
@@ -286,14 +286,14 @@ h6,
 .btn-default:not(:disabled):not(.disabled).active,
 .btn-default:not(:disabled):not(.disabled):active,
 .show>.btn-default.dropdown-toggle {
-    color: #fff;
+    color: var(--text-hover);
     background-color: rgba(0, 0, 0, 0.26);
     border-color: transparent;
 }
 
 .btn-default.disabled,
 .btn-default:disabled {
-    color: #fff;
+    color: var(--text-hover);
     background-color: rgba(255, 255, 255, 0.15);
     border-color: transparent;
     opacity: .5;
diff --git a/css/base/rutorrent/rutorrent-base.css b/css/base/rutorrent/rutorrent-base.css
index 41fa04c3..5949da0e 100644
--- a/css/base/rutorrent/rutorrent-base.css
+++ b/css/base/rutorrent/rutorrent-base.css
@@ -172,7 +172,7 @@ ul.CMenu li a.exp:hover {
 }
 
 ul.CMenu li a.sel {
-    color: #ffffff;
+    color: var(--text-hover);
     background: rgba(0, 0, 0, 0.15);
 }
 
@@ -197,7 +197,7 @@ ul.CMenu li:hover ul li a:hover {
 }
 
 ul.CMenu li ul li a.dis {
-    color: #fff
+    color: var(--text-hover);
 }
 
 ul.CMenu li ul li a.dis:hover {
@@ -398,12 +398,12 @@ div select {
 }
 
 a {
-    color: #fff;
+    color: var(--link-color);
     font-family: 'Roboto'
 }
 
 .flot-text {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 .flot-overlay {
@@ -562,7 +562,7 @@ div#gcont table {
 }
 
 div.graph_tab {
-    color: #FFF;
+    color: var(--text-hover);
     border-color: transparent;
     background-color: rgba(0, 0, 0, 0.25)
 }
@@ -712,7 +712,7 @@ div#tdetails {
     padding: 0;
     margin: 0;
     background-color: transparent;
-    color: #fff;
+    color: var(--text-hover);
     border-top-right-radius: 0px;
     border-top-left-radius: 0px;
 }
@@ -748,7 +748,7 @@ div#VDivider:hover {
 }
 
 div#tcreate textarea#trackers {
-    color: #fff;
+    color: var(--text-hover);
     border: none !important;
     background: rgba(0, 0, 0, 0.25);
     border-radius: 2px;
@@ -758,7 +758,7 @@ div#tcreate textarea#trackers {
 input[type="text"],
 input[type="password"],
 select {
-    color: #fff;
+    color: var(--text-hover);
     border: none;
     background: rgba(0, 0, 0, 0.25) url(/resources/rutorrent/headers.png) repeat-x scroll 0 -138px;
     border-radius: 2px;
@@ -769,7 +769,7 @@ input[type="text"][disabled],
 input[type="password"][disabled],
 input[type="file"][disabled],
 select[disabled] {
-    color: #fff;
+    color: var(--text-hover);
     border: none;
     background: rgba(0, 0, 0, 0.08) url(/resources/rutorrent/headers.png) repeat scroll 0 0 !important;
     border-radius: 2px;
@@ -789,7 +789,7 @@ textarea {
 #lookat,
 #message,
 #FS_downlink {
-    color: #fff;
+    color: var(--text-hover);
     border: none !important;
     background: rgba(0, 0, 0, 0.25);
     border-radius: 2px
@@ -885,7 +885,7 @@ ul#tabbar li.selected a {
 }
 
 .tabbar li a:hover {
-    color: #fff;
+    color: var(--text-hover);
     background: none;
     border: none
 }
@@ -893,7 +893,7 @@ ul#tabbar li.selected a {
 .tabbar li.selected a {
     background: none;
     border: none;
-    border-bottom: 2px solid #fff;
+    border-bottom: 2px solid var(--text-hover);
     color: #ececec;
     font-weight: 700;
     margin: 0 2px 0 0;
@@ -1139,7 +1139,7 @@ div#lcont div.std:nth-child(2n+1) {
 
 #stup_total,
 #stdown_total {
-    color: #fff
+    color: var(--text-hover);
 }
 
 span#ds,
@@ -1157,7 +1157,7 @@ span#ul {
 }
 
 span.det {
-    color: #fff
+    color: var(--text-hover);
 }
 
 .stable-head table tr td {
@@ -1363,7 +1363,7 @@ div.stable-body table tbody tr.even:nth-child(2n+1) td {
 }
 
 .stable-body tr.selected span.meter-value {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 .meter-text {
@@ -1423,7 +1423,7 @@ div.stable-body table tbody tr.even:nth-child(2n+1) td {
 #meter-disk-text,
 #qmeter-disk-text,
 #meter-band-text {
-    color: #fff;
+    color: var(--text-hover);
     text-shadow: 0px 0px 2px #000;
     position: relative;
     text-align: left;
@@ -1453,7 +1453,7 @@ div.stable-body table tbody tr.even:nth-child(2n+1) td {
     position: absolute;
     left: 65px;
     top: 0px;
-    color: #fff;
+    color: var(--text-hover);
     text-shadow: 0px 0px 2px #000;
     font-size: 11px;
     font-family: Ubuntu;
@@ -1472,7 +1472,7 @@ div.stable-body table tbody tr.even:nth-child(2n+1) td {
 /* #meter-cpu-td {}*/
 
 div.graph_tab {
-    color: #FFF;
+    color: var(--text-hover);
     border-color: transparent;
 }
 
@@ -1573,7 +1573,7 @@ div#dlgAddRSS div.dlg-header {
 
 .CellF {
     background-color: #000;
-    color: #fff;
+    color: var(--text-hover);
 }
 
 #tCellNotSupported {
@@ -1717,7 +1717,7 @@ div#tchat div.dlg-header {
     border: none !important;
     background-color: #6F6F6F !important;
     border-radius: 2px !important;
-    color: #fff !important
+    color: var(--text-hover) !important
 }
 
 div#logoff {
@@ -1735,7 +1735,7 @@ div#logoffDlg div.dlg-header {
 .noty_alert,
 .noty_success {
     color: #000000;
-    text-shadow: 0 -1px 0 #ffffff
+    text-shadow: 0 -1px 0 var(--text-hover)
 }
 
 .retrackers {
@@ -1746,7 +1746,7 @@ div#logoffDlg div.dlg-header {
     font-family: Tahoma, Arial, Helvetica, sans-serif;
     cursor: text;
     background: rgba(0, 0, 0, 0.25) !important;
-    color: #fff !important;
+    color: var(--text-hover) !important;
     outline: none !important;
 }
 
@@ -1760,13 +1760,13 @@ div#logoffDlg div.dlg-header {
 #dlgEditRatioRules .lf_rru li input.TextboxFocus,
 #dlgEditRules .lf_rur li input.TextboxFocus {
     background-color: rgb(255 255 255 / 25%);
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 #dlgEditRatioRules .lf_rru li input.TextboxNormal,
 #dlgEditRules .lf_rur li input.TextboxNormal {
     background-color: rgb(255 255 255 / .08) !important;
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 .autodl-listbox {
diff --git a/css/base/sabnzbd/sabnzbd-base.css b/css/base/sabnzbd/sabnzbd-base.css
index 59893be5..1ac8ffdf 100644
--- a/css/base/sabnzbd/sabnzbd-base.css
+++ b/css/base/sabnzbd/sabnzbd-base.css
@@ -411,7 +411,7 @@ svg.peity polyline {
 .btn-default.fileBrowser:hover,
 .btn-default.fileBrowser:focus,
 .btn-default.fileBrowser:active {
-  color: #fff !important;
+  color: var(--button-text-hover) !important;
   background-color: var(--button-color-hover) !important;
   border-color: transparent !important;
 }
@@ -450,7 +450,7 @@ svg.peity polyline {
 }
 
 .btn-default.patternKey:hover {
-  color: #fff !important;
+  color: var(--button-text-hover) !important;
   background-color: var(--button-color-hover);
   border-color: transparent;
 }
@@ -564,7 +564,7 @@ tr td.row-extra-text,
 
 .progress strong,
 .progress i {
-  color: #fff;
+  color: var(--text-hover);
 }
 
 .progress {
@@ -663,7 +663,7 @@ tr td.row-extra-text,
 }
 
 .form-control {
-  color: white;
+  color: var(--text-hover);
   background-color: rgb(0 0 0 / 25%);
 }
 
@@ -680,7 +680,7 @@ tr td.row-extra-text,
 .history-queue-swicher .nav-tabs>li.active>a {
   border-bottom: 1px solid transparent;
   border: 1px solid transparent;
-  color: #fff !important;
+  color: var(--text-hover) !important;
 }
 
 .history-queue-swicher .nav {
@@ -903,7 +903,7 @@ input[type="week"]:focus {
 
 input[type="date"] {
   background: transparent;
-  color: white;
+  color: var(--text-hover);
 }
 
 input[type="date"]::-webkit-calendar-picker-indicator {
@@ -944,7 +944,7 @@ input[type="date"]::-webkit-calendar-picker-indicator {
 }
 
 .Servers .ct-label {
-  color: white;
+  color: var(--text-hover);
 }
 
 .Servers .ct-series-a .ct-point {
@@ -1073,12 +1073,12 @@ select[disabled]:hover {
 }
 
 #modal-options .tab-content h4 {
-  color: white;
+  color: var(--text-hover);
 }
 
 #modal-options .options-switch label,
 #modal-options #options-orphans .process-all-orphaned {
-  color: white;
+  color: var(--text-hover);
 }
 
 #modal-options #options-status small {
@@ -1168,7 +1168,7 @@ fieldset[disabled] .form-control {
 #content a:active,
 #content a:visited,
 #serverResponse {
-  color: #eee;
+  color: var(--text);
 }
 
 /* interface configuration */
diff --git a/css/base/sonarr/sonarr-base.css b/css/base/sonarr/sonarr-base.css
index 7da389a0..fba7688e 100644
--- a/css/base/sonarr/sonarr-base.css
+++ b/css/base/sonarr/sonarr-base.css
@@ -115,7 +115,7 @@ a:hover {
 }
 
 [class*="LoadingIndicator-ripple-"] {
-    border: 2px solid #fff;
+    border: 2px solid var(--text-hover);
 }
 
 /* MODAL */
@@ -153,7 +153,7 @@ a:hover {
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    color: #fff;
+    color: var(--text-hover);
     border-top: 1px solid rgb(var(--accent-color));
 }
 
@@ -166,13 +166,13 @@ a:hover {
 [class*="EpisodeSummary-infoTitle-"],
 [class*="EpisodeDetailsModalContent-tab-"],
 [class*="DescriptionListItemTitle-title-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 /* INPUT */
 [class*="TagInput-internalInput-"] {
     background-color: transparent;
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="SelectInput-select-"] {
@@ -220,7 +220,7 @@ a:hover {
 
 /* SONARR SPECIFIC */
 [class*="SeriesSearchInput-sectionTitle-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="SeriesSearchInput-containerOpen-"] [class*="SeriesSearchInput-seriesContainer-"] {
@@ -233,7 +233,7 @@ a:hover {
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    color: #fff !important;
+    color: var(--text-hover) !important;
     box-shadow: 0 0 10px 1px transparent !important;
 }
 
@@ -385,7 +385,7 @@ a:hover {
 }
 
 [class*="SeriesDetailsSeason-seasonNumber-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="SeriesDetailsSeason-collapseButtonContainer-"] {
@@ -599,7 +599,7 @@ a:hover {
 
 /* ALPHABET JUMP BAR */
 [class*="PageJumpBar-jumpBar-"] {
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 /* MINI RIGHT SCROLL BAR */
@@ -677,12 +677,12 @@ a:hover {
 [class*="CheckInput-isIndeterminate-"] {
     border: none;
     background-color: rgba(255, 255, 255, 0.08);
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="SeriesSearchInput-container-"] [class*="Input-input-"] {
     background: transparent;
-    border-bottom: solid 1px #fff;
+    border-bottom: solid 1px var(--text-hover);
 }
 
 [class*="SeriesSearchInput-container-"] [class*="Input-input-"]:focus {
@@ -691,20 +691,20 @@ a:hover {
 }
 
 [class*="SeriesSearchResult-alternateTitle-"] {
-    color: #ffffff;
+    color: var(--text-hover)
     font-size: 12px;
 }
 
 [class*="Input-input-"]:focus {
     outline: 0;
-    border-color: #fff;
+    border-color: var(--text-hover);
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.25);
 }
 
 [class*="TagInput-input-"][class*="TagInput-isFocused-"] {
     outline: 0;
-    border-color: #fff;
+    border-color: var(--text-hover);
     box-shadow: none;
 }
 
@@ -763,12 +763,12 @@ input:focus:-ms-input-placeholder {
 }
 
 [class*="AddNewSeriesSearchResult-year-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="RootFolderSelectInputSelectedValue-seriesFolder-"],
 [class*="RootFolderSelectInputSelectedValue-freeSpace-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="RootFolderSelectInputOption-freeSpace-"],
@@ -808,7 +808,7 @@ input:focus:-ms-input-placeholder {
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    color: white;
+    color: var(--text-hover);
 }
 
 [class*="ImportSeriesTitle-year-"] {
@@ -820,7 +820,7 @@ input:focus:-ms-input-placeholder {
 [class*="PageContentFooter-contentFooter-"] {
     border: none;
     background-color: rgba(0, 0, 0, .25);
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 /* SEASON PASS */
@@ -836,7 +836,7 @@ input:focus:-ms-input-placeholder {
 
 /* CALENDAR */
 [class*="CircularProgressBar-circularProgressBarContainer-"] svg circle {
-    stroke: white !important;
+    stroke: var(--text-hover) !important;
 }
 
 [class*="CalendarEvent-downloaded-"] {
@@ -936,7 +936,7 @@ input:focus:-ms-input-placeholder {
 [class*="CalendarEvent-episodeInfo-"],
 [class*="CalendarEvent-airTime-"],
 [class*="Legend-legend-"] [class*="LegendItem-legendItem-"] {
-    color: #ffffff !important;
+    color: var(--text-hover) !important;
 }
 
 [class*="CalendarEvent-event-"] {
@@ -948,15 +948,15 @@ input:focus:-ms-input-placeholder {
 }
 
 [class*="CalendarEventGroup-seriesTitle-"] {
-    color: #ffffff !important;
+    color: var(--text-hover) !important;
 }
 
 [class*="CalendarEventGroup-airTime-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="CalendarEventGroup-episodeInfo-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 /* calendar agenda */
@@ -1018,7 +1018,7 @@ input:focus:-ms-input-placeholder {
 }
 
 [class*="-cloneButton-"][class*="IconButton-button-"]:hover {
-    color: white;
+    color: var(--text-hover);
 }
 
 [class*="Card-card-"]:hover {
@@ -1037,7 +1037,7 @@ input:focus:-ms-input-placeholder {
 [class*="LanguageProfileItem-languageProfileItem-"] {
     border: none;
     background-color: rgba(0, 0, 0, .25);
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 [class*="QualityProfileItemGroup-qualityProfileItemGroup-"][class*="QualityProfileItemGroup-editGroups-"] {
@@ -1048,7 +1048,7 @@ input:focus:-ms-input-placeholder {
 [class*="KeyValueListInputItem-valueInput-"] {
     border: none;
     background: transparent;
-    color: white;
+    color: var(--text-hover);
 }
 
 [class*="QualityDefinitions-sizeLimitHelpText-"] {
@@ -1107,7 +1107,7 @@ input[type=email],
 input[type=password] {
     border: none;
     background-color: rgba(255, 255, 255, 0.08);
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 .button {
@@ -1119,13 +1119,13 @@ input[type=password] {
 .button:hover {
     border-color: var(--button-color-hover);
     background-color: var(--button-color-hover);
-    color: #fff;
+    color: var(--button-text-hover);
     text-decoration: none;
 }
 
 .form-input:focus {
     outline: 0;
-    border-color: #fff;
+    border-color: var(--text-hover);
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.25);
 }
diff --git a/css/base/tautulli/tautulli-base.css b/css/base/tautulli/tautulli-base.css
index 87bb33e9..3487eb3a 100644
--- a/css/base/tautulli/tautulli-base.css
+++ b/css/base/tautulli/tautulli-base.css
@@ -72,7 +72,7 @@ h6,
 }
 
 .list-unstyled {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 .text-muted,
@@ -101,7 +101,7 @@ a.no-highlight:hover,
 #newsletter-config-modal span.newsletter_id,
 #plexpy-mobile-devices-table .friendly_name,
 #mobile-device-config-modal span.notifier_id {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 /* Navbar */
@@ -206,15 +206,15 @@ select,
 }
 
 .dashboard-activity-metadata-subtitle-container {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 .dashboard-recent-media-metacontainer h3.text-muted a {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 .dashboard-recent-media-metacontainer h3.text-muted {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 /* Buttons */
@@ -334,7 +334,7 @@ input[type="search"]:focus,
 input[type="tel"]:focus,
 input[type="color"]:focus,
 .uneditable-input:focus {
-    color: #fff;
+    color: var(--text-hover);
     background: rgba(0, 0, 0, 0.25);
 }
 
@@ -402,7 +402,7 @@ table.display thead tr:hover {
 }
 
 .card-handle {
-    color: #fff;
+    color: var(--text-hover);
     background-color: rgba(0, 0, 0, 0.25);
 }
 
@@ -412,14 +412,14 @@ table.display thead tr:hover {
 }
 
 .stacked-configs>li>span {
-    color: #FFF;
+    color: var(--text-hover);
     border-left: 2px solid rgba(0, 0, 0, 0.25);
     border-top: 1px solid rgba(255, 255, 255, 0.08);
 }
 
 .stacked-configs>li>span:hover,
 .stacked-configs>li>span:focus {
-    color: #fff;
+    color: var(--text-hover);
     background-color: rgba(255, 255, 255, 0.08);
 }
 
@@ -485,7 +485,7 @@ span>a.active,
 }
 
 .modal-body li {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 .modal-body {
@@ -573,7 +573,7 @@ span>a.active,
 }
 
 .accordion li .link {
-    color: #fff;
+    color: var(--text-hover);
     border-bottom: 1px solid rgba(255, 255, 255, 0.08);
 }
 
@@ -619,7 +619,7 @@ span>a.active,
 }
 
 .login-container .remember-group {
-    color: #eee;
+    color: var(--text);
 }
 
 #login-methods>li.open>div {
@@ -628,13 +628,13 @@ span>a.active,
 
 /* Buttons */
 .btn-bright {
-    color: #fff;
+    color: var(--button-text);
     background-color: var(--button-color);
     box-shadow: inset 0 1px 0 var(--button-color);
 }
 
 .btn-bright:hover {
-    color: #fff;
+    color: var(--button-text-hover);
     background-color: var(--button-color-hover);
     box-shadow: inset 0 1px 0 var(--button-color-hover);
 }
@@ -643,7 +643,7 @@ span>a.active,
 .btn-bright.active,
 .open>.dropdown-toggle.btn-bright,
 #menu_link_show_advanced_settings.active {
-    color: #fff;
+    color: var(--button-text-hover);
     background-color: var(--button-color-hover);
     box-shadow: inset 0 1px 0 var(--button-color-hover);
 }
@@ -657,7 +657,7 @@ span>a.active,
 .btn-bright:active.focus,
 .btn-bright.active.focus,
 .open>.dropdown-toggle.btn-bright.focus {
-    color: #fff;
+    color: var(--button-text-hover);
     background-color: var(--button-color-hover);
     box-shadow: inset 0 1px 0 var(--button-color-hover);
 }
@@ -667,7 +667,7 @@ span>a.active,
 .btn-dark:focus,
 .btn-dark.focus,
 .btn-dark:active:focus {
-    color: #fff;
+    color: var(--button-text-hover);
     background-color: var(--button-color-hover) !important;
     opacity: .8;
 }
diff --git a/css/base/transmission/transmission-base.css b/css/base/transmission/transmission-base.css
index 7016ba45..f413bdc3 100644
--- a/css/base/transmission/transmission-base.css
+++ b/css/base/transmission/transmission-base.css
@@ -317,7 +317,7 @@ div.dialog_container div.dialog_window {
 
 div.dialog_container div.dialog_window h2.dialog_heading,
 div#upload_container div.dialog_window div.dialog_message label {
-    color: #dedede
+    color: var(--text)  
 }
 
 input {
@@ -332,7 +332,7 @@ input {
 }
 
 div.dialog_container div.dialog_window div.dialog_message {
-    color: #dedede;
+    color: var(--text);
 }
 
 /* Button*/
@@ -421,20 +421,20 @@ div.dialog_container div.dialog_window a:active {
     border: 1px solid transparent;
     background: rgba(255, 255, 255, .1) !important;
     font-weight: normal;
-    color: #dedede;
+    color: var(--text);
 }
 
 .ui-state-active a,
 .ui-state-active a:link,
 .ui-state-active a:visited {
-    color: #dedede;
+    color: var(--text);
     text-decoration: none;
 }
 
 .ui-state-default a,
 .ui-state-default a:link,
 .ui-state-default a:visited {
-    color: #dedede;
+    color: var(--text);
     text-decoration: none;
 }
 
@@ -444,7 +444,7 @@ div.dialog_container div.dialog_window a:active {
     border: 1px solid transparent;
     background: rgba(0, 0, 0, 0.25);
     font-weight: normal;
-    color: #dedede;
+    color: var(--text);
 }
 
 .ui-tabs .ui-tabs-nav li.ui-tabs-active {
@@ -487,7 +487,7 @@ div#torrent_inspector div.inspector_torrent_file_list_entry_name,
 div#torrent_inspector ul.tier_list .tracker_activity,
 div#torrent_inspector ul.tier_list table,
 div#torrent_inspector div.tracker_host {
-    color: #dedede;
+    color: var(--text);
 }
 
 /*Info button*/
@@ -913,7 +913,7 @@ div.torrent_footer #turtle-button.selected:before {
     content: "\f3fd";
     font-weight: 900;
     display: inline-block;
-    color: white;
+    color: var(--text-hover);
 }
 
 /* Compact Icon */
@@ -959,7 +959,7 @@ div.torrent_footer #compact-button.selected:before {
 /*Compact mode*/
 ul.torrent_list li.torrent div.torrent_name.paused,
 ul.torrent_list li.torrent.compact div.torrent_name {
-    color: #dedede;
+    color: var(--text);
 }
 
 /* Settings menu */
diff --git a/css/base/uptime-kuma/uptime-kuma-base.css b/css/base/uptime-kuma/uptime-kuma-base.css
index 77b4d133..e0d1f21f 100644
--- a/css/base/uptime-kuma/uptime-kuma-base.css
+++ b/css/base/uptime-kuma/uptime-kuma-base.css
@@ -327,7 +327,7 @@ td {
 .multiselect__option--selected,
 .dark .multiselect__option--selected {
     background: rgba(0, 0, 0, .45);
-    color: #fff;
+    color: var(--text-hover);
     font-weight: 700;
 }
 
diff --git a/css/base/vuetorrent/vuetorrent-base.css b/css/base/vuetorrent/vuetorrent-base.css
index 8f5b6a77..c5a31673 100644
--- a/css/base/vuetorrent/vuetorrent-base.css
+++ b/css/base/vuetorrent/vuetorrent-base.css
@@ -226,8 +226,8 @@ p,
 }
 
 .v-application .accent .v-icon__svg {
-    color: white !important;
-    fill: white !important;
+    color: var(--text-hover) !important;
+    fill: var(--text-hover) !important;
 }
 .v-application .deep-purple.accent-4 {
     background-color: rgb(var(--accent-color))!important;
@@ -375,7 +375,7 @@ p,
 .torrent-done-color .v-chip.stalled,
 .torrent-done-color .v-chip.metadata,
 .torrent-done-color .v-chip.moving {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 /* DROPDOWN */
@@ -458,5 +458,5 @@ p,
 }
 
 .v-speed-dial__list .v-icon__svg {
-    fill: #fff;
+    fill: var(--text-hover);
 }
\ No newline at end of file
diff --git a/css/base/webtools/webtools-base.css b/css/base/webtools/webtools-base.css
index 2f9297f9..98eb4e8e 100644
--- a/css/base/webtools/webtools-base.css
+++ b/css/base/webtools/webtools-base.css
@@ -27,7 +27,7 @@ a,
 }
 
 a:hover {
-    color: #fff;
+    color: var(--link-color-hover);
 }
 
 #content:before {
diff --git a/css/base/whisparr/whisparr-base.css b/css/base/whisparr/whisparr-base.css
index 06dfdcfe..2e682246 100644
--- a/css/base/whisparr/whisparr-base.css
+++ b/css/base/whisparr/whisparr-base.css
@@ -112,7 +112,7 @@ a:hover {
 }
 
 [class*="LoadingIndicator-ripple-"] {
-    border: 2px solid #fff;
+    border: 2px solid var(--text-hover);
 }
 
 /* MODAL */
@@ -150,18 +150,18 @@ a:hover {
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    color: #fff;
+    color: var(--text-hover);
     border-top: 1px solid rgb(var(--accent-color));
 }
 
 [class*="ModalContent-closeButton-"]:hover {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 /* INPUT */
 [class*="TagInput-internalInput-"] {
     background-color: transparent;
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="SelectInput-select-"] {
@@ -209,7 +209,7 @@ a:hover {
 
 /* RADARR SPECIFIC */
 [class*="MovieSearchInput-sectionTitle-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="MovieSearchInput-containerOpen-"] [class*="MovieSearchInput-movieContainer-"] {
@@ -222,7 +222,7 @@ a:hover {
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    color: #fff !important;
+    color: var(--text-hover) !important;
     box-shadow: 0 0 10px 1px transparent !important;
 }
 
@@ -373,7 +373,7 @@ a:hover {
 }
 
 [class*="MovieDetailsSeason-seasonNumber-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="MovieDetailsSeason-collapseButtonContainer-"] {
@@ -430,7 +430,7 @@ a:hover {
 }
 
 [class*="EpisodeTitleLink-link-"]:hover {
-    color: #fff;
+    color: var(--text-hover);
     text-decoration: none;
 }
 
@@ -599,7 +599,7 @@ a:hover {
 
 /* ALPHABET JUMP BAR */
 [class*="PageJumpBar-jumpBar-"] {
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 /* MINI RIGHT SCROLL BAR */
@@ -679,12 +679,12 @@ a:hover {
 [class*="CheckInput-isIndeterminate-"] {
     border: none;
     background-color: rgba(255, 255, 255, 0.08);
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="MovieSearchInput-container-"] [class*="Input-input-"] {
     background: transparent;
-    border-bottom: solid 1px #fff;
+    border-bottom: solid 1px var(--text-hover);
 }
 
 [class*="MovieSearchInput-container-"] [class*="Input-input-"]:focus {
@@ -693,24 +693,24 @@ a:hover {
 }
 
 [class*="MovieSearchResult-alternateTitle-"] {
-    color: #fff;
+    color: var(--text-hover);
     font-size: 12px;
 }
 
 [class*="AddNewMovieSearchResult-year-"] {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 [class*="Input-input-"]:focus {
     outline: 0;
-    border-color: #fff;
+    border-color: var(--text-hover);
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.25);
 }
 
 [class*="TagInput-input-"][class*="TagInput-isFocused-"] {
     outline: 0;
-    border-color: #fff;
+    border-color: var(--text-hover);
     box-shadow: none;
 }
 
@@ -738,12 +738,12 @@ a:hover {
 }
 
 [class*="AddNewmovieModalContent-year-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="RootFolderSelectInputSelectedValue-movieFolder-"],
 [class*="RootFolderSelectInputSelectedValue-freeSpace-"] {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="RootFolderSelectInputOption-freeSpace-"],
@@ -815,7 +815,7 @@ input:focus:-ms-input-placeholder {
     -webkit-background-size: auto, cover;
     -moz-background-size: auto, cover;
     -o-background-size: auto, cover;
-    color: white;
+    color: var(--text-hover);
 }
 
 [class*="ImportMovieSearchResult-movie-"]:hover {
@@ -848,7 +848,7 @@ input:focus:-ms-input-placeholder {
 }
 
 [class*="AddListMovieOverview-link-"]:hover {
-    color: #fff;
+    color: var(--text-hover);
 }
 
 [class*="AddListMovieOverview-content-"]:hover {
@@ -856,14 +856,14 @@ input:focus:-ms-input-placeholder {
 }
 
 [class*="PageJumpBarItem-jumpBarItem-"]:hover {
-    color: #fff;
+    color: var(--text-hover);
     background: hsla(0, 0%, 100%, .08);
 }
 
 /*Posters*/
 [class*="AddListMoviePoster-title-"] {
     background-color: rgba(255, 255, 255, 0.08);
-    color: #fff;
+    color: var(--text-hover);
 }
 
 /* MASS EDITOR */
@@ -871,12 +871,12 @@ input:focus:-ms-input-placeholder {
 [class*="PageContentFooter-contentFooter-"] {
     border: none;
     background-color: rgba(0, 0, 0, .25);
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 /* CALENDAR */
 [class*="CircularProgressBar-circularProgressBarContainer-"] svg circle {
-    stroke: white !important;
+    stroke: var(--text-hover) !important;
 }
 
 [class*="CalendarEvent-downloaded-"] {
@@ -986,7 +986,7 @@ input:focus:-ms-input-placeholder {
 [class*="CalendarEvent-episodeInfo-"],
 [class*="CalendarEvent-airTime-"],
 [class*="CalendarEvent-link-"] {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 [class*="CalendarEvent-event-"] {
@@ -998,7 +998,7 @@ input:focus:-ms-input-placeholder {
 }
 
 [class*="CalendarEventGroup-movieTitle-"] {
-    color: #fff !important;
+    color: var(--text-hover) !important;
 }
 
 [class*="CalendarEventGroup-airTime-"] {
@@ -1076,7 +1076,7 @@ input:focus:-ms-input-placeholder {
 
 
 [class*="-cloneButton-"][class*="IconButton-button-"]:hover {
-    color: white;
+    color: var(--text-hover);
 }
 
 [class*="Card-card-"]:hover {
@@ -1095,7 +1095,7 @@ input:focus:-ms-input-placeholder {
 [class*="LanguageProfileItem-languageProfileItem-"] {
     border: none;
     background-color: rgba(0, 0, 0, .25);
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 [class*="QualityProfileItemGroup-qualityProfileItemGroup-"][class*="QualityProfileItemGroup-editGroups-"] {
@@ -1106,7 +1106,7 @@ input:focus:-ms-input-placeholder {
 [class*="KeyValueListInputItem-valueInput-"] {
     border: none;
     background: transparent;
-    color: white;
+    color: var(--text-hover);
 }
 
 [class*="QualityProfileFormatItem-qualityProfileFormatItem-"] {
@@ -1187,7 +1187,7 @@ input[type=email],
 input[type=password] {
     border: none;
     background-color: rgba(255, 255, 255, 0.08);
-    color: #FFF;
+    color: var(--text-hover);
 }
 
 .button {
@@ -1199,13 +1199,13 @@ input[type=password] {
 .button:hover {
     border-color: var(--button-color-hover);
     background-color: var(--button-color-hover);
-    color: #fff;
+    color: var(--button-text-hover);
     text-decoration: none;
 }
 
 .form-input:focus {
     outline: 0;
-    border-color: #fff;
+    border-color: var(--text-hover);
     box-shadow: none;
     background-color: rgba(255, 255, 255, 0.25);
 }
diff --git a/css/base/xbackbone/xbackbone-base.css b/css/base/xbackbone/xbackbone-base.css
index 32e4c347..b4cca0d5 100644
--- a/css/base/xbackbone/xbackbone-base.css
+++ b/css/base/xbackbone/xbackbone-base.css
@@ -330,13 +330,13 @@ a:hover {
 
 /* FORMS */
 .form-control {
-    color: #fff;
+    color: var(--text-hover);
     background-color: rgba(0, 0, 0, .15);
     border: 1px solid rgba(0, 0, 0, .15);
 }
 
 .form-control:focus {
-    color: #fff;
+    color: var(--text-hover);
     background: #1f1f1f;
     border-color: rgba(255, 255, 255, .15);
     outline: 0;
@@ -344,7 +344,7 @@ a:hover {
 }
 
 textarea.form-control:focus {
-    color: #fff;
+    color: var(--text-hover);
     background: rgba(0, 0, 0, .35);
     border-color: rgba(255, 255, 255, .15);
     outline: 0;