/* ============================================================
   wide.css — 超宽屏（≥1600px）自适应网格
   ------------------------------------------------------------
   版心已在 style.css ≥1600px 放开为流体（--sa-container: 100%）；
   这里负责把写死列数的卡片网格改为「按最小卡宽自动增列」，
   让卡片宽度始终落在舒适区间（约 340–700px），而不是被 1fr 拉满整行。

   ⚠ 必须用 auto-fit 而不是 auto-fill：
     auto-fill 保留空列轨道（不满行时右侧空一列）；
     auto-fit 把空列折叠为 0，现有卡片均分整行。
     但注意 auto-fit 不会限制列数 —— 卡片少时会互相拉伸，
     所以每类网格的最小卡宽要按「目标卡宽」选，让轨道数 ≈ 卡片数。
   ⚠ 本文件全站加载（不区分页面），只放跨页面都成立的规则；
     页面专属布局仍留在各自文件里。
   ============================================================ */

@media (min-width: 1600px) {

	/* 论坛版块卡片（4 大类）
	   ⚠ 第二十六轮修正：原为 minmax(420px, 1fr)，在**容器 1660px** 时算出
	     floor((1660+32)/(420+32)) = 3 列 —— 而顶级版块正好 4 个，
	     于是第二行只剩一张孤卡、右侧空出 1084px（1920 视口的实测症状）。
	     根因是「420 这个阈值恰好卡在 3 列与 4 列之间」，而 1660 是
	     1920 视口最常见的容器宽（竖栏 220 占掉后只剩 1700，再减 40 gutter）。
	     降到 390 后：容器 1660 → 4 列（卡 391）；容器 1880 → 4 列（卡 446）。 */
	.sa-forums {
		grid-template-columns: repeat(auto-fit, minmax(390px, 1fr));
	}

	/* 文章 / 作品卡片网格（归档 4 列 → 宽屏 4 列）
	   ⚠ minmax 的最小值直接决定列数，改它等于改列数：
	     480px → 1880 里只放得下 3 列（卡宽 611，比市场卡的 357 大近一倍，密度不一致）；
	     420px → 4 列（卡宽 455），与首页/市场紧凑化后的密度对齐（第十八轮）。 */
	.sa-posts--cols2,
	.sa-posts--cols3,
	.sa-posts--cols4,
	.sa-posts--wide {
		grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
	}

	/* 首页信任条 */
	.sa-trust__grid {
		grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
	}

	/* 市场商品卡片。
	   ⚠ Astra 自己有 `.woocommerce ul.products.columns-N { repeat(N,1fr) }`（0,2,1），
	   普通的 `.woocommerce ul.products`（0,1,1）压不过 —— 必须带上 [class*="columns-"]
	   提到 0,3,1，否则宽屏下仍是写死的 4 列（第十五轮实测被拉成 785px 宽卡）。 */
	.woocommerce ul.products[class*="columns-"],
	.woocommerce-page ul.products[class*="columns-"] {
		grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
		/* ⚠ 副作用提醒：auto-fit 在「卡片数 < 轨道数」时会把卡摊满整行
		   （作品详情页 related 只有 1 件 → 1880×2091 巨物）。
		   兜底限宽写在 components.css 的商品卡 max-width 上，别在这里重复。 */
	}
}