diff --git a/components/JobAccessoryItem/index.scss b/components/JobAccessoryItem/index.scss
index 7b2b069c..1c255ada 100644
--- a/components/JobAccessoryItem/index.scss
+++ b/components/JobAccessoryItem/index.scss
@@ -10,7 +10,11 @@
   width: 100%;
 
   &[data-state='checked'] {
-    background: var(--input-bg-hover);
+    background: var(--selected-item-bg);
+
+    &:hover {
+      background: var(--selected-item-bg-hover);
+    }
 
     h4 {
       color: var(--button-text-hover);
diff --git a/styles/themes.scss b/styles/themes.scss
index a97dde0d..d181dca2 100644
--- a/styles/themes.scss
+++ b/styles/themes.scss
@@ -16,6 +16,9 @@
   --accent-blue: #{$accent--blue--light};
   --accent-yellow: #{$accent--yellow--light};
 
+  --selected-item-bg: #{$selected--item--bg--light};
+  --selected-item-bg-hover: #{$selected--item--bg--light--hover};
+
   // Light - Menus
   --dialog-bg: #{$dialog--bg--light};
 
@@ -143,6 +146,9 @@
   --accent-blue: #{$accent--blue--dark};
   --accent-yellow: #{$accent--yellow--dark};
 
+  --selected-item-bg: #{$selected--item--bg--dark};
+  --selected-item-bg-hover: #{$selected--item--bg--dark--hover};
+
   // Dark - Dialogs
   --dialog-bg: #{$dialog--bg--dark};
 
diff --git a/styles/variables.scss b/styles/variables.scss
index 76e3cc4d..91aa81e1 100644
--- a/styles/variables.scss
+++ b/styles/variables.scss
@@ -83,6 +83,11 @@ $accent--blue--dark: #6195f4;
 $accent--yellow--light: #c89d39;
 $accent--yellow--dark: #f9cc64;
 
+$selected--item--bg--dark: #f9cc645d;
+$selected--item--bg--dark--hover: #fcc33f81;
+$selected--item--bg--light: #f9cc645d;
+$selected--item--bg--light--hover: #ecbc4c6f;
+
 // Colors -- Elements
 $wind-text-00: #023e28;
 $wind-text-10: #006a43;