/* wgf-item-page.css - item-detail page cohesion layer (owner review 2026-07-03 item
   page unification). Homes the "About this item" band, the supply-panel value/quality
   additions, and the WoW Tools Adventure-Guide tile tweaks. Tokens only (never :root
   here); every colour is a var(--wgf-*). Fixed dimensions where they matter -> zero CLS. */

/* ── About this item band (woven directly under the identity header) ── */
.wgf-about{
  background:var(--wgf-panel-1);
  border:1px solid var(--wgf-border-neutral);
  border-left:3px solid var(--wgf-gold-muted);
  border-radius:var(--radius-card);
  padding:var(--space-4);
  box-shadow:var(--shadow-1);
}
.wgf-about__h{margin-top:0;}
.wgf-about__intro{
  font-family:var(--font-ui);
  font-size:var(--text-md);
  color:var(--wgf-text);
  line-height:1.55;
  margin:0 0 var(--space-2);
}
.wgf-about__price{
  font-family:var(--font-ui);
  font-size:var(--text-sm);
  color:var(--wgf-muted);
  line-height:1.55;
  margin:0 0 var(--space-3);
}
.wgf-about__price .wgf-price{vertical-align:baseline;}
.wgf-about__pct{
  font-family:var(--font-mono);
  font-variant-numeric:tabular-nums;
  font-weight:500;
  white-space:nowrap;
}
.wgf-about__pct--is-deal,.wgf-about__pct--down{color:var(--wgf-up);}
.wgf-about__pct--is-high,.wgf-about__pct--up{color:var(--wgf-down);}
.wgf-about__pct--flat{color:var(--wgf-muted);}

/* era + identity facts row */
.wgf-about__facts{
  display:flex;
  flex-wrap:wrap;
  gap:var(--space-2) var(--space-4);
  margin:0 0 var(--space-3);
}
.wgf-about__fact{display:flex;flex-direction:column;gap:1px;}
.wgf-about__fact dt{
  font-family:var(--font-ui);
  font-size:var(--text-xs);
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--wgf-muted);
  margin:0;
}
.wgf-about__fact dd{
  font-family:var(--font-mono);
  font-variant-numeric:tabular-nums;
  font-size:var(--text-sm);
  color:var(--wgf-text);
  margin:0;
}

/* recent-changes preview (anchors down to the full Data Changes list) */
.wgf-about__changes{
  margin-top:var(--space-2);
  padding-top:var(--space-3);
  border-top:1px solid var(--wgf-border-neutral-soft);
}
.wgf-about__sub{
  font-family:var(--font-display);
  font-size:var(--text-xs);
  text-transform:uppercase;
  letter-spacing:.07em;
  color:var(--wgf-gold-muted);
  margin:0 0 var(--space-2);
}
.wgf-about__changelist{
  list-style:none;
  margin:0 0 var(--space-2);
  padding:0;
  display:flex;
  flex-direction:column;
  gap:var(--space-1);
}
.wgf-about__changelist li{
  font-family:var(--font-ui);
  font-size:var(--text-sm);
  color:var(--wgf-text);
  line-height:1.5;
}
.wgf-about__patch{
  font-family:var(--font-mono);
  font-size:var(--text-xs);
  color:var(--wgf-muted);
  font-variant-numeric:tabular-nums;
}
.wgf-about__changelist .wgf-ichg__old{color:var(--wgf-muted);text-decoration:line-through;}
.wgf-about__changelist .wgf-ichg__new{color:var(--wgf-text);}
.wgf-about__more{
  font-family:var(--font-ui);
  font-size:var(--text-sm);
  color:var(--wgf-gold-bright);
  text-decoration:none;
}
.wgf-about__more:hover,.wgf-about__more:focus-visible{text-decoration:underline;}

/* ── Supply panel additions (value coin stat + depth quality bar + meta) ── */
.sp__stat-val--coin{font-size:var(--text-md);}
.sp__stat-val--coin .wgf-price__scope{display:none;}
.sp__bar{
  flex:1 1 120px;
  min-width:120px;
  height:8px;
  border-radius:var(--radius-pill);
  background:var(--wgf-panel-3);
  border:1px solid var(--wgf-border-neutral-soft);
  overflow:hidden;
}
.sp__bar-fill{
  display:block;
  height:100%;
  border-radius:var(--radius-pill);
}
/* supply depth is NOT market direction -> neutral/gold fills only, never up/down */
.sp__bar-fill--thick{background:var(--wgf-gold-muted);}
.sp__bar-fill--moderate{background:var(--wgf-border-neutral);}
.sp__bar-fill--thin{background:var(--wgf-border-neutral-soft);}
.sp__meta{
  margin:var(--space-3) 0 0;
  padding-top:var(--space-3);
  border-top:1px solid var(--wgf-border-neutral-soft);
  font-family:var(--font-mono);
  font-size:var(--text-xs);
  color:var(--wgf-muted);
  font-variant-numeric:tabular-nums;
}

/* ── WoW Tools cards (Adventure-Guide tiles reused; tool-content tweaks) ── */
.wgf-ag-grid--tools{margin-top:var(--space-3);}
.wgf-ag-card--tool .wgf-ag-card__text{display:flex;flex-direction:column;gap:2px;}
.wgf-ag-card--tool .wgf-ag-card__meta{white-space:normal;line-height:1.35;}
/* item-specific deals plates get the gold edge accent so they lead the grid */
.wgf-ag-card--tool-primary{border-left:3px solid var(--wgf-gold-muted);}