Add schedule preview dropdown styles and various improvements

- Add .schedule-preview-dropdown and .schedule-preview-item CSS classes
- Add .btn-schedule-preview badge styling
- Add preview functionality for entity list views
- Improve modal and dropdown styling
- Various JS and SCSS enhancements

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

sources/scss/components/_value-picker.scss

@@ -201,28 +201,36 @@
         display: inline-flex;
         align-items: center;
         gap: 0.25rem;
-        padding: 0.375rem 0.625rem;
-        color: $es-text-secondary;
-        background: $es-slate-100;
-        border: 1px solid transparent;
-        border-radius: $es-radius-sm;
+        padding: 0.375rem 0.75rem;
+        color: $es-text-muted;
+        background: transparent;
+        border: 1px dashed $es-border-color;
+        border-radius: 100px; // Pill shape
         font-size: $es-font-size-xs;
-        font-weight: $es-font-weight-medium;
+        font-weight: $es-font-weight-normal;
         cursor: pointer;
         transition: all $es-transition-fast;
 
         &:hover {
-            background: $es-slate-200;
+            color: $es-text-secondary;
+            border-color: $es-slate-400;
+            border-style: solid;
         }
 
         &.selected {
             color: $es-primary;
             background: $es-primary-light;
-            border-color: $es-primary;
+            border: 1px solid $es-primary;
+            font-weight: $es-font-weight-medium;
         }
 
         i {
-            font-size: 12px;
+            font-size: 11px;
+            opacity: 0.6;
+        }
+
+        &.selected i {
+            opacity: 1;
         }
     }