/* NobodyInJP unified image output — single canonical WebP + CSS frame display */

/* ── 商品描述 / 編輯器內容圖 ── */
.ni-content-body,
.goods-description,
.ni-goods-desc-content {
  width: min(100%, 960px);
  margin-left: auto;
  margin-right: auto;
}

.ni-content-body img,
.goods-description img,
.ni-goods-desc-content img,
.ni-content-img {
  display: block;
  width: min(100%, 760px);
  max-width: 760px;
  height: auto;
  margin: 18px auto;
  border-radius: 12px;
}

.ni-content-body img[data-ni-image-wide="1"],
.goods-description img[data-ni-image-wide="1"],
.ni-goods-desc-content img[data-ni-image-wide="1"] {
  width: min(100%, 960px);
  max-width: 960px;
}

.ni-content-body figure,
.goods-description figure {
  margin: 16px auto;
}

.ni-content-body figure img,
.goods-description figure img {
  max-width: 100%;
  height: auto;
}

/* NI_CONVERGENCE: listing product-card layout/color rules retired from this image-output file.
 * Canonical listing card CSS now lives in themes/quwan/assets/css/page-listing.css.
 * This file should only keep content/editor image sizing and legacy goodsBox image
 * safety rules, so it no longer centers .ni-product-card text or recolors card titles.
 */

/* 收斂舊 goodsBox grid：禁止 .goodsimg 固定尺寸撐破版 */
.goodsBox2 .goodsItem.ni-product-card {
  height: auto;
  min-height: 0;
  overflow: visible;
  padding: 8px 10px;
}

.goodsBox2 .goodsItem.ni-product-card .ni-product-card__image-frame {
  width: 100%;
  max-width: 160px;
  margin: 0 auto;
}

.goodsBox2 .goodsItem.ni-product-card .ni-product-card__image,
.goodsBox2 .goodsItem.ni-product-card img {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center center;
  border: 0;
  padding: 0;
  background: transparent;
}

.goodsBox2 .goodsItem.ni-product-card .name,
.goodsBox2 .goodsItem.ni-product-card .price {
  height: auto;
  line-height: 20px;
  overflow: hidden;
}

.goodsBox2 .goodsItem.ni-product-card .name a {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
}

/* 列表模式 thumb */
.goodsList .thumb .ni-product-card__image-frame {
  width: 100px;
  max-width: 100px;
}

/* ── 相容舊 ni-img-frame（首頁輪播等尚未改 ni-product-card 的區塊）── */
.ni-img-frame {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}

.ni-img-frame--product-card {
  aspect-ratio: 1 / 1;
  width: 100%;
  overflow: hidden;
  background: #f7f4ef;
  border-radius: 12px;
}

.ni-img--product-card {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center center;
  display: block;
}

.ni-img-frame--product-main {
  aspect-ratio: 1 / 1;
  width: 100%;
  overflow: hidden;
  background: #f7f4ef;
  border-radius: 12px;
}

.ni-img--product-main {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center center;
  display: block;
}

.ni-img-frame--product-gallery-thumb {
  width: 72px;
  height: 72px;
  min-width: 72px;
  overflow: hidden;
  background: #f7f4ef;
  border-radius: 8px;
}

.ni-img--product-gallery-thumb {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center center;
  display: block;
}

.ni-img-frame--spec {
  width: 64px;
  height: 64px;
  min-width: 64px;
  overflow: hidden;
  background: #f7f4ef;
  border-radius: 8px;
}

.ni-img--spec {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center center;
  display: block;
}

.ni-img-frame--cart-thumb,
.ni-img-frame--order-thumb {
  width: 80px;
  height: 80px;
  min-width: 80px;
  overflow: hidden;
  background: #f7f4ef;
  border-radius: 8px;
}

.ni-img--cart-thumb,
.ni-img--order-thumb {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center center;
  display: block;
}

.new_img .ni-img-frame--product-card,
.goodsItem .ni-img-frame--product-card {
  width: 100%;
  max-width: 160px;
  margin: 0 auto;
}

.ni-img {
  box-sizing: border-box;
}