refactor: enhance disabled state styling and logic in DownloadSettingsModal

src/renderer/src/pages/game-details/modals/download-settings-modal.scss

@@ -87,6 +87,22 @@
     &--last {
       border-bottom: none;
     }
+
+    &:disabled {
+      cursor: default;
+
+      &:hover {
+        background-color: transparent;
+      }
+
+      .download-settings-modal__downloader-name {
+        opacity: 0.5;
+      }
+
+      .download-settings-modal__availability-indicator-wrapper {
+        opacity: 0.5;
+      }
+    }
   }
 
   &__downloader-item-wrapper {
@@ -94,10 +110,6 @@
     flex-direction: column;
   }
 
-  &__recommendation-badge {
-    margin-left: auto;
-  }
-
   &__check-icon {
     color: white;
     flex-shrink: 0;

src/renderer/src/pages/game-details/modals/download-settings-modal.tsx

@@ -288,6 +288,10 @@ export function DownloadSettingsModal({
 
                 const Indicator = option.isAvailable ? motion.span : "span";
 
+                const isDisabled =
+                  !option.canHandle ||
+                  (!option.isAvailable && !option.isAvailableButNotConfigured);
+
                 return (
                   <div
                     key={option.downloader}
@@ -304,6 +308,7 @@ export function DownloadSettingsModal({
                           ? "download-settings-modal__downloader-item--last"
                           : ""
                       }`}
+                      disabled={isDisabled}
                       onClick={() => {
                         if (
                           option.downloader === Downloader.RealDebrid &&