feat(ui): improve filter preset delete button visibility and layout

- Hide delete button by default and show on hover for inactive presets
- Show delete button on active presets only when hovering over the preset
- Add ellipsis truncation for long preset names to prevent layout breakage
- Remove checkmark icon from active preset names for cleaner visual design

static/css/components/search-filter.css

@@ -512,6 +512,10 @@
 
 .filter-preset.active .preset-delete-btn {
     color: white;
+    opacity: 0;
+}
+
+.filter-preset:hover.active .preset-delete-btn {
     opacity: 0.8;
 }
 
@@ -529,13 +533,16 @@
     align-items: center;
     gap: 6px;
     white-space: nowrap;
+    max-width: 120px; /* Prevent long names from breaking layout */
+    overflow: hidden;
+    text-overflow: ellipsis;
 }
 
 .preset-delete-btn {
     background: none;
     border: none;
     color: var(--text-color);
-    opacity: 0.5;
+    opacity: 0; /* Hidden by default */
     cursor: pointer;
     padding: 4px;
     display: flex;
@@ -546,6 +553,10 @@
     margin-left: auto;
 }
 
+.filter-preset:hover .preset-delete-btn {
+    opacity: 0.5; /* Show on hover */
+}
+
 .preset-delete-btn:hover {
     opacity: 1;
     color: var(--lora-error, #e74c3c);

static/js/managers/FilterPresetManager.js

@@ -751,12 +751,7 @@ export class FilterPresetManager {
 
             const presetName = document.createElement('span');
             presetName.className = 'preset-name';
-
+            presetName.textContent = preset.name;
-            if (isActive) {
-                presetName.innerHTML = `<i class="fas fa-check"></i> ${preset.name}`;
-            } else {
-                presetName.textContent = preset.name;
-            }
             presetName.title = translate('header.filter.presetClickTooltip', { name: preset.name }, `Click to apply preset "${preset.name}"`);
 
             const deleteBtn = document.createElement('button');