/**
 * Blog index / archive / author / search layout.
 *
 * Loaded on is_home(), is_archive(), is_author(), and post search
 * results. Post card styling lives in components/post-card.css; this
 * file owns page layout only (header, grid wrapper, pagination, empty
 * state, author bio) — mirrors the structure of pages/shop.css.
 *
 * @package PackagingCommerce
 */

/* ── Page header ──────────────────────────────────────────────────── */

.pkgc-blog {
	padding-block-start: var(--brand-space-4) !important;
}

.pkgc-blog__header {
	margin-block-end: var(--brand-space-5);
}

.pkgc-blog__title {
	font-size: var(--brand-text-2xl);
	font-weight: var(--brand-weight-bold);
	color: var(--brand-color-ink);
	margin: 0 0 var(--brand-space-1);
}

.pkgc-blog__description {
	color: var(--brand-color-muted);
	font-size: var(--brand-text-sm);
	line-height: var(--brand-leading-relaxed);
	max-width: 48rem;
}

/* ── Author bio (author.php only) ─────────────────────────────────── */

.pkgc-blog-author {
	display: flex;
	align-items: center;
	gap: var(--brand-space-4);
	margin-block-end: var(--brand-space-6);
	padding: var(--brand-space-4);
	background-color: var(--brand-color-surface-alt);
	border: 1px solid var(--brand-color-border);
	border-radius: var(--brand-radius-md);
}

.pkgc-blog-author__avatar {
	flex: 0 0 auto;
	border-radius: 50%;
	width: 64px;
	height: 64px;
}

.pkgc-blog-author__name {
	font-size: var(--brand-text-lg);
	font-weight: var(--brand-weight-bold);
	color: var(--brand-color-ink);
	margin: 0;
}

.pkgc-blog-author__bio {
	font-size: var(--brand-text-sm);
	color: var(--brand-color-muted);
	margin: var(--brand-space-1) 0 0;
}

/* ── Pagination ───────────────────────────────────────────────────── */

.pkgc-blog__pagination {
	margin-block-start: var(--brand-space-6);
}

.pkgc-blog__pagination .pagination,
.pkgc-blog__pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--brand-space-2);
	list-style: none;
	margin: 0;
	padding: 0;
}

.pkgc-blog__pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding-inline: var(--brand-space-3);
	border: 1px solid var(--brand-color-border);
	border-radius: var(--brand-radius-full);
	color: var(--brand-color-ink);
	text-decoration: none;
	font-size: var(--brand-text-sm);
	transition: border-color var(--brand-transition-fast), color var(--brand-transition-fast);
}

.pkgc-blog__pagination .page-numbers:hover {
	border-color: var(--brand-color-primary);
	color: var(--brand-color-primary);
}

.pkgc-blog__pagination .page-numbers.current {
	background-color: var(--brand-color-primary);
	border-color: var(--brand-color-primary);
	color: #fff;
}

/* ── Empty state ──────────────────────────────────────────────────── */

.pkgc-blog-empty {
	display: grid;
	place-items: center;
	gap: var(--brand-space-3);
	padding-block: var(--brand-space-16);
	text-align: center;
}

.pkgc-blog-empty__title {
	font-size: var(--brand-text-xl);
	font-weight: var(--brand-weight-bold);
	color: var(--brand-color-ink);
	margin: 0;
}

.pkgc-blog-empty__text {
	color: var(--brand-color-muted);
	max-width: 32rem;
	margin: 0;
}

@media (prefers-reduced-motion: reduce) {
	.pkgc-blog__pagination .page-numbers {
		transition: none;
	}
}
