ui: Minor CSS tweaks (#10295)

ui/packages/consul-ui/app/components/app-view/layout.scss

@@ -4,7 +4,7 @@
   align-items: center;
   white-space: nowrap;
   position: relative;
-  z-index: 4;
+  z-index: 5;
 }
 %app-view-actions {
   display: flex;

ui/packages/consul-ui/app/styles/routes/dc/services/index.scss

@@ -8,9 +8,18 @@ html[data-route^='dc.services.instance'] .app-view > header dl {
 html[data-route^='dc.services.instance'] .app-view > header dt {
   font-weight: $typo-weight-bold;
 }
+html[data-route^='dc.services.instance'] .tab-nav {
+  border-top: $decor-border-100;
+}
+html[data-route^='dc.services.instance'] .tab-section section:not(:last-child) {
+  border-bottom: $decor-border-100;
+}
+html[data-route^='dc.services.instance'] .tab-nav,
+html[data-route^='dc.services.instance'] .tab-section section:not(:last-child) {
+  border-color: var(--gray-200);
+}
 html[data-route^='dc.services.instance'] .tab-section section:not(:last-child) {
   padding-bottom: 24px;
-  border-bottom: 1px solid $gray-200;
 }
 html[data-route^='dc.services.instance.metadata'] .tab-section section h2 {
   @extend %h300;