Merge branch 'claude/hopeful-edison' into feature/wardrobe-v2

app/assets/stylesheets/wardrobe/show.css

@@ -167,7 +167,12 @@ item-card {
     box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
   }
 
-  &:hover :is(.item-add-button, .item-remove-button, .item-hide-button, .item-show-button) {
+  &:hover :is(.item-add-button, .item-remove-button, .item-hide-button, .item-show-button),
+  &:hover .item-info-link {
+    opacity: 1;
+  }
+
+  &:focus-within .item-info-link {
     opacity: 1;
   }
 
@@ -202,6 +207,34 @@ item-card {
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
+    display: flex;
+    align-items: center;
+    gap: 0.25rem;
+  }
+
+  .item-info-link {
+    flex-shrink: 0;
+    font-size: 0.9rem;
+    text-decoration: none;
+    opacity: 0;
+    transition: opacity 0.2s;
+    line-height: 1;
+
+    &:hover {
+      opacity: 1 !important;
+    }
+
+    &:focus {
+      opacity: 1;
+      outline: 2px solid var(--color-primary);
+      outline-offset: 2px;
+      border-radius: 2px;
+    }
+
+    /* Always visible on touch devices */
+    @media (hover: none) {
+      opacity: 0.6;
+    }
   }
 
   .item-badges {

app/views/wardrobe/items/_item_card_content.html.haml

@@ -1,7 +1,10 @@
 .item-thumbnail
   = image_tag item.thumbnail_url, alt: "", loading: "lazy"
 .item-info
-  .item-name= item.name
+  .item-name
+    = item.name
+    = link_to item_path(item), class: "item-info-link", target: "_blank", rel: "noopener" do
+      %span{aria: {label: "Item info"}} ℹ️
   .item-badges
     = render "items/badges/kind", item: item
     = render "items/badges/first_seen", item: item