Enhance video backdrop styling for TV layout and improve focus management in slideshow

Jellyfin.Plugin.MediaBarEnhanced/Web/mediaBarEnhanced.css

@@ -995,3 +995,15 @@
 .dots-container .slide-counter {
   margin: 0;
 }
+
+.layout-tv .video-backdrop {
+  top: -5%;
+  mask-image: linear-gradient(to top,
+      #fff0 2%,
+      rgb(0 0 0 / 0.5) 6%,
+      #000000 8%);
+  -webkit-mask-image: linear-gradient(to top,
+      #fff0 2%,
+      rgb(0 0 0 / 0.5) 6%,
+      #000000 8%);
+}

Jellyfin.Plugin.MediaBarEnhanced/Web/mediaBarEnhanced.js

@@ -2237,6 +2237,16 @@ const SlideshowManager = {
     let previousVisibleSlide;
     try {
       const container = SlideUtils.getOrCreateSlidesContainer();
+      
+      const activeElement = document.activeElement;
+      let focusSelector = null;
+      if (container.contains(activeElement)) {
+          if (activeElement.classList.contains('play-button')) focusSelector = '.play-button';
+          else if (activeElement.classList.contains('detail-button')) focusSelector = '.detail-button';
+          else if (activeElement.classList.contains('favorite-button')) focusSelector = '.favorite-button';
+          else if (activeElement.classList.contains('trailer-button')) focusSelector = '.trailer-button';
+      }
+
       const totalItems = STATE.slideshow.totalItems;
 
       index = Math.max(0, Math.min(index, totalItems - 1));
@@ -2264,6 +2274,15 @@ const SlideshowManager = {
       }
 
       currentSlide.classList.add("active");
+      
+      if (focusSelector) {
+          const target = currentSlide.querySelector(focusSelector);
+          if (target) {
+              requestAnimationFrame(() => {
+                  target.focus();
+              });
+          }
+      }
 
       // Manage Video Playback: Stop others, Play current