Update highlights for navigators

Author: satya164

src/css/custom.css

@@ -862,9 +862,9 @@ article {
   & .video-player {
     vertical-align: top;
     margin: var(--ifm-leading) 0;
-    outline: 1px solid rgba(0, 0, 0, 0.08);
-    outline-offset: -1px;
-    box-shadow: var(--ifm-global-shadow-lw);
+    box-shadow:
+      inset 0 0 0 1px rgba(0, 0, 0, 0.08),
+      var(--ifm-global-shadow-lw);
     border-radius: var(--ifm-global-radius);
   }
 
@@ -1123,15 +1123,24 @@ code {
     position: relative;
     border-radius: var(--ifm-global-radius);
     overflow: hidden;
-    outline: 1px solid rgba(0, 0, 0, 0.08);
-    outline-offset: -1px;
     box-shadow: var(--ifm-global-shadow-lw);
     transition: var(--ifm-transition-fast) var(--ifm-transition-timing-default);
 
+    &::after {
+      content: '';
+      position: absolute;
+      inset: 0;
+      border-radius: inherit;
+      box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08);
+      pointer-events: none;
+    }
+
     &:hover {
-      box-shadow:
-        0 0 0 1px rgba(0, 0, 0, 0.05),
-        var(--ifm-global-shadow-md);
+      box-shadow: var(--ifm-global-shadow-md);
+
+      &::after {
+        box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.12);
+      }
     }
 
     & > .video-player {