From 6e4f48ff2ee54c0724bd3af201af8d7c7e05f029 Mon Sep 17 00:00:00 2001
From: vicrodh <103399283+vicrodh@users.noreply.github.com>
Date: Mon, 2 Feb 2026 09:43:00 -0600
Subject: [PATCH] style(ui): clear button always visible, popup 530px wide

---
 src/lib/components/GenreFilterPopup.svelte | 26 ++++++++++++++--------
 1 file changed, 17 insertions(+), 9 deletions(-)

diff --git a/src/lib/components/GenreFilterPopup.svelte b/src/lib/components/GenreFilterPopup.svelte
index f7c8106ca..f3a48693a 100644
--- a/src/lib/components/GenreFilterPopup.svelte
+++ b/src/lib/components/GenreFilterPopup.svelte
@@ -158,13 +158,16 @@
       {/each}
     </div>
 
-    {#if hasActiveFilter()}
-      <div class="popup-footer">
-        <button class="clear-btn" onclick={handleClearAll} type="button">
-          Clear filter
-        </button>
-      </div>
-    {/if}
+    <div class="popup-footer">
+      <button
+        class="clear-btn"
+        onclick={handleClearAll}
+        type="button"
+        disabled={!hasActiveFilter()}
+      >
+        Clear filter
+      </button>
+    </div>
   </div>
 {/if}
 
@@ -172,7 +175,7 @@
   .genre-popup {
     position: fixed;
     z-index: 10000;
-    width: 480px;
+    width: 530px;
     max-height: 500px;
     background: var(--bg-primary);
     border: 1px solid var(--border-subtle);
@@ -357,8 +360,13 @@
     transition: background 150ms ease, color 150ms ease;
   }
 
-  .clear-btn:hover {
+  .clear-btn:hover:not(:disabled) {
     background: var(--bg-hover);
     color: var(--text-primary);
   }
+
+  .clear-btn:disabled {
+    opacity: 0.4;
+    cursor: not-allowed;
+  }
 </style>