Add empty state display for cases without display sets and link to add new ones

atlas/templates/atlas/case_display_block.html

@@ -182,6 +182,37 @@
     .case-presentation li { background: rgba(13,110,253,0.12); color: #0b5ed7; padding: .25rem .5rem; border-radius: .25rem; font-size: .9rem; }
     .case-presentation b { margin-right: .5rem; }
 
+    .displayset-empty-state {
+        display: inline-flex;
+        align-items: center;
+        gap: .6rem;
+        margin: .4rem 0;
+        padding: .45rem .65rem;
+        border-radius: .5rem;
+        border: 1px solid rgba(13, 110, 253, 0.2);
+        background: rgba(13, 110, 253, 0.06);
+    }
+
+    .displayset-empty-link {
+        display: inline-block;
+        padding: .25rem .6rem;
+        border-radius: 999px;
+        background: #0d6efd;
+        color: #fff;
+        font-size: .82rem;
+        font-weight: 600;
+        text-decoration: none;
+        transition: background-color .15s ease, transform .15s ease;
+    }
+
+    .displayset-empty-link:hover,
+    .displayset-empty-link:focus {
+        background: #0b5ed7;
+        color: #fff;
+        transform: translateY(-1px);
+        text-decoration: none;
+    }
+
             /* Dark mode adjustments */
     @media (prefers-color-scheme: dark) {
         .case-description {
@@ -198,6 +229,19 @@
             color: #9ec5ff !important;
             border: 1px solid rgba(255,255,255,0.06);
         }
+        .displayset-empty-state {
+            border-color: rgba(158, 197, 255, 0.3);
+            background: rgba(158, 197, 255, 0.1);
+        }
+        .displayset-empty-link {
+            background: #9ec5ff;
+            color: #042b61;
+        }
+        .displayset-empty-link:hover,
+        .displayset-empty-link:focus {
+            background: #bfdbff;
+            color: #042b61;
+        }
         /* Series block dark theme adjustments */
         .series-block {
             background: #071018;
@@ -752,7 +796,12 @@
                                 </div>
                             </li>
                         {% empty %}
-                            <span class="text-muted">No display sets for this case.</span>
+                            <div class="displayset-empty-state">
+                                <span class="text-muted">No display sets for this case.</span>
+                                {% if can_edit %}
+                                    <a class="displayset-empty-link" href="{% url 'atlas:case_displaysets' case.pk %}">Add one now</a>
+                                {% endif %}
+                            </div>
                         {% endfor %}
                     </ul>
                 </details>