/**
 * camphub-archive.css
 * สไตล์หน้าหมวดหมู่/แท็ก (category.php / tag.php) — ค่าตรงตาม Design Artifact ที่ approve แล้ว
 * (Category-Desktop.dc.html / Category-Mobile.dc.html) ทุกจุด
 *
 * หมายเหตุสำคัญ: ไฟล์นี้จัดการเฉพาะ "โครงหน้า" (breadcrumb, กริด, ริบบิ้นสปอนเซอร์, ช่อง Banner C,
 * shelf บทความปักหมุด, ปุ่มโหลดเพิ่มเติม) เท่านั้น — ไม่แตะสไตล์ภายในตัวการ์ดเอง เพราะการ์ดแต่ละใบ
 * render ผ่าน template-parts/loops/layout-d.php ของธีม (ใช้ CSS ของธีมเองอยู่แล้ว ไม่ว่าจะเป็นดีไซน์
 * เก่าหรือดีไซน์ใหม่ที่กำลังทยอยย้ายอยู่ก็ตาม) — เมื่อไหร่ที่ layout-d.php เปลี่ยนดีไซน์ หน้านี้จะ
 * เปลี่ยนตามอัตโนมัติโดยไม่ต้องแก้ไฟล์นี้เลย
 */

.camphub-archive-wrap {
	background: #ffffff;
}

.camphub-archive-inner {
	max-width: 1140px;
	margin: 0 auto;
	padding: 32px 24px 60px;
	box-sizing: border-box;
}

.archivebreadcrumb {
	font-size: 13px;
	color: #a6a196;
	margin-bottom: 8px;
}

.archivebreadcrumb a {
	color: inherit;
	text-decoration: none;
}

.archivetitle {
	margin: 0 0 6px;
	font-size: 32px;
	font-weight: 700;
	color: #3b3733;
	line-height: 1.3;
}

.archivecount {
	font-size: 14px;
	color: #72716a;
	margin-bottom: 28px;
}

.archiveempty {
	padding: 60px 24px;
	text-align: center;
	color: #a6a196;
	font-size: 15px;
}

/* ---------- ป้ายกำกับพื้นที่โฆษณา ---------- */
.adlabel {
	font-size: 12px;
	color: #a6a196;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	margin-bottom: 10px;
	text-align: center;
}

.archivebannera {
	margin-bottom: 40px;
}

/* ---------- Chip เล็ก (ใช้ใน pinned shelf) ---------- */
.chchip {
	background: #F2F1EE;
	color: #3b3733;
	font-size: 11.5px;
	line-height: 1.4;
	padding: 4px 10px;
	border-radius: 999px;
	white-space: nowrap;
	display: inline-block;
}

/* ---------- ปุ่ม CTA (โหลดเพิ่มเติม) ---------- */
.ctabtn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #f15a29;
	color: #ffffff;
	font-size: 15px;
	font-weight: 700;
	padding: 13px 34px;
	border-radius: 999px;
	border: none;
	cursor: pointer;
	font-family: inherit;
}

.ctabtn:disabled {
	opacity: 0.6;
	cursor: default;
}

.loadmorewrap {
	text-align: center;
	padding: 10px 0 20px;
}

/* ---------- Shelf บทความปักหมุด (ACF ใหม่) ---------- */
.pinnedshelfwrap {
	margin-bottom: 40px;
}

.pinnedshelfhead {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	margin-bottom: 16px;
	flex-wrap: wrap;
	gap: 4px;
}

.pinnedshelftitle {
	font-size: 20px;
	font-weight: 700;
	color: #3b3733;
}

.pinnedshelfsub {
	font-size: 12.5px;
	color: #a6a196;
}

.pinnedshelf {
	display: flex;
	gap: 16px;
	overflow-x: auto;
	padding-bottom: 4px;
}

.pinnedcard {
	flex: 0 0 220px;
	background: #ffffff;
	border-radius: 14px;
	box-shadow: 0 1px 3px rgba(43,38,32,0.08);
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	display: block;
}

.pinnedcardimg {
	width: 220px;
	height: 130px;
	object-fit: cover;
	display: block;
}

.pinnedcardimg-fallback {
	background: linear-gradient(135deg,#3b3733,#1a1714);
}

.pinnedcardbody {
	padding: 12px 14px 14px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.pinnedcardtitle {
	font-size: 14px;
	font-weight: 700;
	color: #3b3733;
	line-height: 1.4;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* ---------- กริดการ์ดค่าย (เดสก์ท็อป 3 คอลัมน์) ---------- */
.campgrid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
	margin-bottom: 40px;
	align-items: stretch;
}

/* การ์ดจาก layout-d.php ต้องสูงเต็มเซลล์กริดเสมอ ไม่ว่าจะใช้คลาสอะไรก็ตาม */
.campgrid > a,
.campgrid > article {
	height: 100%;
}

/* ---------- ช่องสปอนเซอร์ (ห่อการ์ดจริง + ริบบิ้น) ----------
 * ย้ายกฎ .campcard-slot / .ribbon ไปอยู่ที่ camphub-sponsor-slots/assets/css/camphub-sponsor-ribbon.css
 * แทนแล้ว (27 ก.ย. 69) เพราะปลั๊กอินต้อง enqueue ไฟล์นี้บนหน้าค้นหา (camphub-search-filter) ด้วย
 * ซึ่งไม่โหลด camphub-archive.css ของธีมอยู่แล้ว — คงกฎไว้ที่เดียว (ของปลั๊กอิน) กัน CSS ซ้ำซ้อน/
 * ไม่ตรงกันสองที่ ปลั๊กอิน enqueue ให้ทั้งหน้าหมวดหมู่/แท็กและหน้าค้นหาอัตโนมัติอยู่แล้วเมื่อเปิดใช้งาน
 */

/* ---------- ช่อง Banner C (เป็นเซลล์หนึ่งในกริดเดียวกับการ์ด) ---------- */
.bannercslot {
	grid-column: 3;
	grid-row: 1 / span 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.bannercslot .ad-mobile {
	display: none;
}

/* ---------- มือถือ: คอลัมน์เดียว, Banner C กลับเป็นการ์ดในลำดับฟีดปกติ ---------- */
@media (max-width: 860px) {
	.camphub-archive-inner {
		padding: 20px 20px 40px;
	}

	.archivetitle {
		font-size: 22px;
	}

	.archivebreadcrumb {
		font-size: 12px;
	}

	.archivecount {
		font-size: 13px;
		margin-bottom: 20px;
	}

	.pinnedcard {
		flex-basis: 160px;
	}

	.pinnedcardimg {
		width: 160px;
		height: 100px;
	}

	.campgrid {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	.bannercslot {
		grid-column: auto;
		grid-row: auto;
	}

	.bannercslot .ad-desktop {
		display: none;
	}

	.bannercslot .ad-mobile {
		display: block;
	}

	.ctabtn {
		width: 100%;
		box-sizing: border-box;
	}
}