/* ==========================================================================
   product.css — 商品详情页覆盖(图片列压缩 / 两栏收紧 / 排名历史上移为主内容)
   只在 product_detail.html 引入,在 components.css 之后加载,覆盖其 .product-layout。
   克制:无阴影 · 无渐变 · 无动画。
   ========================================================================== */

/* ---- 顶部两栏:图片列收窄 + 间距收紧,让排名历史图上移为主内容 ---- */
.product-layout { gap: 20px; margin-bottom: 4px; }
.product-layout .img-box { flex: 0 0 240px; max-width: 280px; }

/* 无图占位:巨大首字母块压缩(字号从 48px 收到 32px,不再空旷) */
.product-layout .img-box .placeholder,
.product-layout .img-box.noimg::after { font-size: 32px; }

.product-layout .info { min-width: 260px; }
.product-layout .info .title { font-size: 18px; margin-bottom: 8px; }
.product-layout .info .price-big { margin-bottom: 10px; }
.product-layout .info .info-meta { margin-top: 12px; }

/* ---- 排名历史:作为页面主内容,紧贴头部两栏上移,给足呼吸 ---- */
h2 { margin-top: 20px; }
.history-chart { padding: 20px 22px; }
