diff --git a/assets/js/hooks/cell_editor/live_editor/codemirror/theme.js b/assets/js/hooks/cell_editor/live_editor/codemirror/theme.js
index 394bed45b..2354113be 100644
--- a/assets/js/hooks/cell_editor/live_editor/codemirror/theme.js
+++ b/assets/js/hooks/cell_editor/live_editor/codemirror/theme.js
@@ -348,6 +348,7 @@ function buildEditorTheme(colors, { dark }) {
         alignItems: "center",
         flexWrap: "wrap",
         padding: "8px",
+        background: colors.background,
 
         "& br": {
           content: '" "',
@@ -358,12 +359,20 @@ function buildEditorTheme(colors, { dark }) {
         "& .cm-textfield": {
           borderRadius: "4px",
           border: `1px solid ${colors.border}`,
+
+          "&:focus": {
+            outline: "none",
+          },
         },
 
         "& .cm-button": {
           borderRadius: "4px",
           background: colors.backgroundLightest,
           border: "none",
+
+          "&:focus-visible": {
+            outline: `1px solid ${colors.text}`,
+          },
         },
 
         "& label:first-of-type": {
@@ -388,6 +397,10 @@ function buildEditorTheme(colors, { dark }) {
             backgroundColor: colors.backgroundLightest,
             borderColor: "transparent",
           },
+
+          "&:focus-visible": {
+            outline: `1px solid ${colors.text}`,
+          },
         },
 
         '& button[name="close"]': {