/* wgf-item-detail.css - the /item/ family's own components (page:item-detail lane,
   2026-09-03). Two things live here and nothing else:

     .wgf-iset*    the "Part of a set" card on a detail page - the item's icon inside the
                   client's LootTab set border (assets/ui/loottab-set-itemborder-*.png)
                   with one link into the /item-set/ page.
     .wgf-ihub-*   the /item/ hub's outbound rail, which also gives the hub the two-column
                   grid site_shell.place_sidebar_ad_slot requires.

   Tokens only - every colour is a var(--wgf-*) from static/css/_tokens.css. No green
   (docs/ui-ux/17-blizzard-palette.md), no gradient, no glow, no painted texture. Fixed
   icon/frame dimensions -> zero CLS. */

/* ── "Part of a set" card ─────────────────────────────────────────────────────── */
.wgf-iset__card{
  display:flex;
  align-items:center;
  gap:var(--space-3);
  padding:var(--space-2);
  border:1px solid var(--wgf-metal-soft);
  border-radius:4px;
  background:var(--wgf-well);
  text-decoration:none;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.45);
}
.wgf-iset__card:hover,
.wgf-iset__card:focus-visible{
  border-color:var(--wgf-gold-muted);
}

/* The frame is the client's own LootTab set border, sized to sit around a 44px icon.
   --iset-frame is set inline per quality by item_pages_render.SET_BORDER_URL(). */
.wgf-iset__frame{
  position:relative;
  flex:0 0 auto;
  width:44px;
  height:44px;
  display:block;
}
.wgf-iset__frame::after{
  content:"";
  position:absolute;
  inset:-7px;
  background:var(--iset-frame) center/100% 100% no-repeat;
  pointer-events:none;
}
.wgf-iset__icon{
  width:44px;
  height:44px;
  display:block;
  border-radius:2px;
}
.wgf-iset__text{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
}
.wgf-iset__name{
  font-family:var(--font-game);
  font-size:var(--text-md);
  color:var(--wgf-gold-primary);
  line-height:1.25;
}
.wgf-iset__meta{
  font-family:var(--font-ui);
  font-size:var(--text-sm);
  color:var(--wgf-muted);
  line-height:1.35;
}

/* ── /item/ hub outbound rail ─────────────────────────────────────────────────── */
.wgf-ihub-rail{
  list-style:none;
  margin:0;
  padding:0;
}
.wgf-ihub-rail li + li{
  margin-top:6px;
}
.wgf-ihub-rail a{
  display:block;
  padding:8px 10px;
  border:1px solid var(--wgf-metal-soft);
  border-radius:3px;
  background:var(--wgf-well);
  font-family:var(--font-game);
  color:var(--wgf-gold-primary);
  text-decoration:none;
  line-height:1.3;
}
.wgf-ihub-rail a:hover,
.wgf-ihub-rail a:focus-visible{
  border-color:var(--wgf-gold-muted);
}
.wgf-ihub-rail a span{
  display:block;
  margin-top:2px;
  font-family:var(--font-ui);
  font-size:var(--text-sm);
  color:var(--wgf-muted);
}

/* Moved out of the inline <style> block seo_item_index used to emit in its body
   (the shell must stay brace-free; page bodies keep their styles in a sheet). */
.ii-dir-count{margin:0 0 .6rem;font-size:.9rem}
.ii-dir-list{margin:0 0 1.1rem}