/**
 * DeShop — blog.css
 *
 * Content pages: page header, two-column layout with sidebar, post grid
 * and cards, single post, comments, 404 and search.
 *
 * @package DeShop
 */

/* Page header ---------------------------------------------------------------- */

.page-header {
	display: flex;
	flex-direction: column;
	gap: var(--ds-space-sm);
	margin-bottom: var(--ds-space-2xl);
}

.page-header--center {
	align-items: center;
	text-align: center;
}

.page-header .ds-breadcrumb {
	margin-bottom: var(--ds-space-xs);
}

.page-title {
	font-size: var(--ds-fs-3xl);
}

.page-description {
	max-width: 60ch;
}

.page-description > * + * {
	margin-top: var(--ds-space-sm);
}

/* Layout with optional sidebar ------------------------------------------------ */

.layout--narrow .layout__main {
	max-width: var(--ds-content);
	margin-inline: auto;
}

@media (min-width: 1024px) {
	.layout--sidebar {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 300px;
		gap: var(--ds-space-3xl);
		align-items: start;
	}

	.layout__aside {
		position: sticky;
		top: calc(var(--ds-header-h) + var(--ds-space-lg));
	}
}

.layout__aside {
	margin-top: var(--ds-space-2xl);
}

@media (min-width: 1024px) {
	.layout__aside {
		margin-top: 0;
	}
}

.widget-area .widget + .widget {
	margin-top: var(--ds-space-xl);
}

.widget-area .widget-title,
.widget-area .wp-block-heading {
	margin-bottom: var(--ds-space-sm);
	font-size: var(--ds-fs-lg);
}

.widget-area ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.widget-area li {
	padding-block: var(--ds-space-xs);
	border-bottom: 1px solid var(--ds-border);
}

.widget-area li a {
	color: var(--ds-text);
	text-decoration: none;
}

/* Post card --------------------------------------------------------------------- */

.post-card {
	background: transparent;
	border-radius: 0;
	overflow: visible;
}

.post-card__media {
	border-radius: var(--ds-radius-md);
}

.post-card__media img {
	transition: transform var(--ds-dur-slow) var(--ds-ease);
}

@media (hover: hover) {
	.post-card:hover .post-card__media img {
		transform: scale(1.03);
	}
}

.post-card__body {
	display: flex;
	flex-direction: column;
	gap: var(--ds-space-xs);
	padding-top: var(--ds-space-md);
}

.post-card__title {
	font-size: var(--ds-fs-xl);
}

.post-card__title a {
	color: var(--ds-text);
	text-decoration: none;
}

.post-card:hover .post-card__title a {
	color: var(--ds-primary);
}

.post-card__excerpt {
	color: var(--ds-text-muted);
	font-size: var(--ds-fs-sm);
}

.post-card .entry-meta {
	position: relative;
	z-index: 2;
}

/* Entry meta ------------------------------------------------------------------------ */

.entry-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.375rem;
	color: var(--ds-text-muted);
	font-size: var(--ds-fs-xs);
	letter-spacing: 0.02em;
}

.entry-meta a {
	color: var(--ds-accent);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-decoration: none;
	text-transform: uppercase;
}

/* Single post ------------------------------------------------------------------------ */

.entry-header {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--ds-space-sm);
	margin-bottom: var(--ds-space-xl);
	text-align: center;
}

.entry-title {
	font-size: var(--ds-fs-3xl);
}

.entry-header .entry-meta {
	justify-content: center;
}

.entry-media {
	margin-bottom: var(--ds-space-xl);
}

.entry-media img {
	width: 100%;
	border-radius: var(--ds-radius-md);
}

.entry-content {
	font-size: 1.0625rem;
	line-height: 1.75;
}

.entry-content img {
	border-radius: var(--ds-radius-sm);
}

.entry-footer {
	display: flex;
	flex-direction: column;
	gap: var(--ds-space-xl);
	margin-top: var(--ds-space-2xl);
}

.entry-tags {
	margin: 0;
	padding: 0;
	list-style: none;
}

.page-links {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ds-space-xs);
	margin-top: var(--ds-space-xl);
}

/* Full-width template: normal blocks keep reading width, wide/full break out. */
.content-area--full {
	padding-block: 0;
}

.ds-prose--full > :not(.alignwide):not(.alignfull) {
	max-width: var(--ds-content);
	margin-inline: auto;
	padding-inline: var(--ds-gutter);
}

.ds-prose--full > .alignwide {
	margin-inline: auto;
	width: min(var(--ds-container), 100% - var(--ds-gutter) * 2);
}

.ds-prose--full > .alignfull {
	width: 100%;
	margin-inline: 0;
}

/* Previous / next ---------------------------------------------------------------- */

.post-nav .nav-links {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--ds-space-md);
	padding-top: var(--ds-space-xl);
	border-top: 1px solid var(--ds-border);
}

@media (min-width: 768px) {
	.post-nav .nav-links {
		grid-template-columns: 1fr 1fr;
	}

	.post-nav .nav-next {
		grid-column: 2;
		text-align: end;
	}
}

.post-nav a {
	display: flex;
	flex-direction: column;
	gap: 4px;
	color: var(--ds-text);
	text-decoration: none;
}

.post-nav__label {
	color: var(--ds-text-muted);
	font-size: var(--ds-fs-xs);
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.post-nav__title {
	font-family: var(--ds-font-heading);
	font-size: var(--ds-fs-lg);
}

.post-nav a:hover .post-nav__title {
	color: var(--ds-primary);
}

/* Comments ------------------------------------------------------------------------ */

.comments-area {
	margin-top: var(--ds-space-2xl);
	padding-top: var(--ds-space-2xl);
	border-top: 1px solid var(--ds-border);
}

.comments-title,
.comment-reply-title {
	margin-bottom: var(--ds-space-lg);
	font-size: var(--ds-fs-xl);
}

.comment-list,
.comment-list .children {
	margin: 0;
	padding: 0;
	list-style: none;
}

.comment-list .children {
	margin-top: var(--ds-space-lg);
	padding-inline-start: var(--ds-space-lg);
	border-inline-start: 1px solid var(--ds-border);
}

.comment-list > li + li {
	margin-top: var(--ds-space-lg);
}

.comment-body {
	display: flex;
	flex-direction: column;
	gap: var(--ds-space-xs);
}

.comment-author {
	display: flex;
	align-items: center;
	gap: var(--ds-space-sm);
	font-weight: 600;
}

.comment-author .avatar {
	border-radius: 50%;
}

.comment-author .says {
	display: none;
}

.comment-metadata {
	font-size: var(--ds-fs-xs);
}

.comment-metadata a {
	color: var(--ds-text-muted);
	text-decoration: none;
}

.reply a {
	font-size: var(--ds-fs-sm);
	font-weight: 600;
}

.comment-form {
	display: grid;
	gap: var(--ds-space-md);
}

.comment-form p {
	margin: 0;
}

.comment-form label {
	display: block;
	margin-bottom: 6px;
}

.comment-form-cookies-consent {
	display: flex;
	align-items: flex-start;
	gap: var(--ds-space-xs);
}

.comment-form-cookies-consent label {
	margin: 0;
	font-weight: 400;
}

/* Search & empty states ---------------------------------------------------------- */

.search-page-form {
	display: flex;
	justify-content: center;
	margin-bottom: var(--ds-space-2xl);
}

.search-page-form .search-form {
	width: 100%;
}

.no-results {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--ds-space-md);
	padding-block: var(--ds-space-xl);
	text-align: center;
}

.no-results .search-form {
	width: 100%;
}

/* 404 ------------------------------------------------------------------------------ */

.error-404 {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-block: var(--ds-space-3xl);
	text-align: center;
}

.error-404__code {
	font-family: var(--ds-font-heading);
	font-size: clamp(5rem, 3rem + 10vw, 9rem);
	font-weight: 500;
	line-height: 1;
	color: var(--ds-primary-soft);
	-webkit-text-stroke: 1px var(--ds-primary);
	margin-bottom: var(--ds-space-lg);
}

.error-404 .page-header {
	margin-bottom: var(--ds-space-xl);
}

.error-404__search {
	display: flex;
	justify-content: center;
	width: 100%;
	margin-bottom: var(--ds-space-lg);
}

.error-404__search .search-form {
	width: 100%;
}

.error-404__actions {
	justify-content: center;
}
