/* ══════════════════════════════════════════════════════════
   Arşiv (içerik tipi / kategori / etiket / tarih) — kart ızgarası
   ve sayfalama. Ortak değişkenler style.css :root'tan gelir.
   Izgara, .dxp-cards temelini (1/2/3 sütun) kullanır.
══════════════════════════════════════════════════════════ */

/*
 * Kırıntı şeridi hemen üstte olduğunda bant ek üst boşluk istemez (64px yerine
 * kırıntının alt boşluğu yeter). Kırıntı kapalıysa varsayılan boşluk kalır.
 */
.dxp-archive.dxp-archive--after-crumbs {
	padding-top: 8px;
}

.dxp-archive .dxp-archive-head {
	max-width: 720px;
	margin   : 0 0 40px;
}

.dxp-archive .dxp-archive-head .dxp-eyebrow {
	display      : inline-block;
	margin-bottom: 12px;
}

.dxp-archive .dxp-archive-desc > * + * { margin-top: 8px; }

/* Temel ızgaradaki üst boşluğu başlık marjına bırak. */
.dxp-archive-grid { margin-top: 0; }

/* ── Kart ───────────────────────────────────────────────── */
.dxp-archive-card {
	display       : flex;
	flex-direction: column;
	height        : 100%;
	background    : #ffffff;
	transition    : box-shadow var(--dxp-dur-slow), transform var(--dxp-dur-slow);
}

.dxp-archive-card:hover,
.dxp-archive-card:focus-visible {
	transform : translateY(-3px);
	box-shadow: var(--dxp-ring), 0 14px 34px rgba(3, 50, 22, .14);
	outline   : none;
}

/* Klavye odağında görünür halka (erişilebilirlik). */
.dxp-archive-card:focus-visible {
	box-shadow: 0 0 0 3px var(--dxp-primary-soft), 0 14px 34px rgba(3, 50, 22, .14);
}

/* ── Görsel / yer tutucu ────────────────────────────────── */
.dxp-archive-media {
	position  : relative;
	aspect-ratio: 4 / 3;
	overflow  : hidden;
	background: linear-gradient(135deg, var(--dxp-muted), var(--brand-paper));
}

.dxp-archive-media img {
	display   : block;
	width     : 100%;
	height    : 100%;
	object-fit: cover;
	transition: transform .5s;
}

.dxp-archive-card:hover .dxp-archive-media img,
.dxp-archive-card:focus-visible .dxp-archive-media img {
	transform: scale(1.05);
}

.dxp-archive-media-ph {
	position       : absolute;
	inset          : 0;
	display        : flex;
	align-items    : center;
	justify-content: center;
	color          : color-mix(in srgb, var(--brand-green) 55%, transparent);
}

.dxp-archive-media-ph .dxp-ic {
	width : 42px;
	height: 42px;
}

/* ── Gövde ──────────────────────────────────────────────── */
.dxp-archive-card-body {
	display       : flex;
	flex-direction: column;
	flex-grow     : 1;
	gap           : 8px;
	padding       : 20px;
}

.dxp-archive-card-title {
	margin     : 0;
	font-size  : 1.0625rem;
	font-weight: 600;
	line-height: 1.35;
	color      : var(--brand-charcoal);
}

.dxp-archive-card-excerpt {
	margin     : 0;
	font-size  : .875rem;
	line-height: 1.6;
	color      : color-mix(in srgb, var(--brand-charcoal) 62%, transparent);
}

/* "Devamını oku" her kartın dibinde hizalansın. */
.dxp-archive-card .dxp-card-link { margin-top: auto; }

/* ── Sayfalama ──────────────────────────────────────────── */
.dxp-archive-pagination { margin-top: 48px; }

.dxp-archive-pagination .nav-links {
	display        : flex;
	flex-wrap      : wrap;
	justify-content: center;
	gap            : 8px;
}

.dxp-archive-pagination .page-numbers {
	display        : inline-flex;
	align-items    : center;
	justify-content: center;
	min-width      : 40px;
	height         : 40px;
	padding        : 0 12px;
	border         : 1px solid var(--dxp-border);
	border-radius  : 10px;
	background     : #ffffff;
	color          : var(--brand-charcoal);
	font-size      : .875rem;
	font-weight    : 500;
	text-decoration: none;
	transition     : background var(--dxp-dur-fast), border-color var(--dxp-dur-fast), color var(--dxp-dur-fast);
}

.dxp-archive-pagination a.page-numbers:hover {
	border-color: var(--brand-green);
	color       : var(--brand-green);
}

.dxp-archive-pagination .page-numbers.current {
	background  : var(--dxp-primary);
	border-color: var(--dxp-primary);
	color       : var(--dxp-primary-contrast);
}

.dxp-archive-pagination .page-numbers.dots {
	border-color: transparent;
	background  : transparent;
}

/* ── Boş sonuç durumu ───────────────────────────────────── */
.dxp-archive-empty {
	display        : flex;
	flex-direction : column;
	align-items    : center;
	text-align     : center;
	gap            : 16px;
	padding        : 64px 24px;
	background     : #ffffff;
	border-radius  : 16px;
	box-shadow     : var(--dxp-ring);
}

.dxp-archive-empty-icon {
	display        : inline-flex;
	align-items    : center;
	justify-content: center;
	width          : 72px;
	height         : 72px;
	border-radius  : 50%;
	background     : var(--dxp-muted);
	color          : var(--brand-green);
}

.dxp-archive-empty-icon .dxp-ic {
	width : 34px;
	height: 34px;
}

.dxp-archive-empty-title {
	margin     : 0;
	font-size  : 1.25rem;
	font-weight: 600;
	color      : var(--brand-charcoal);
}

.dxp-archive-empty-text {
	margin   : 0;
	max-width: 36rem;
	font-size: .9375rem;
	line-height: 1.6;
	color    : var(--dxp-text-muted);
}

/* ── Blog kartı ek bilgisi (tarih + kategoriler) ─────────── */
.dxp-archive-card-meta {
	display       : flex;
	align-items   : center;
	gap           : 6px;
	margin        : 0;
	font-size     : .75rem;
	font-weight   : 500;
	letter-spacing: .02em;
	text-transform: uppercase;
	color         : var(--dxp-text-muted);
}

.dxp-archive-card-meta .dashicons {
	font-size: 15px;
	width    : 15px;
	height   : 15px;
}

.dxp-archive-card-cats {
	display  : flex;
	flex-wrap: wrap;
	gap      : 6px;
	margin-top: 2px;
}

.dxp-archive-cat {
	display      : inline-block;
	padding      : 3px 10px;
	border-radius: 9999px;
	background   : var(--dxp-muted);
	color        : var(--dxp-accent-fg);
	font-size    : .75rem;
	font-weight  : 500;
	line-height  : 1.4;
}

/* ── Blog düzeni: içerik + yan panel ─────────────────────── */
.dxp-archive-layout { display: grid; gap: 40px; }

@media (min-width: 1024px) {
	.dxp-archive-layout.has-sidebar {
		grid-template-columns: minmax(0, 1fr) 320px;
		align-items          : start;
	}
}

.dxp-archive-main { min-width: 0; }

/* ── Kategori filtresi (blog/kategori/etiket) ────────────── */
.dxp-cat-filter {
	display   : flex;
	flex-wrap : wrap;
	gap       : 8px;
	margin-top: 22px;
}

.dxp-cat-filter-btn {
	display        : inline-flex;
	align-items    : center;
	padding        : 7px 14px;
	border         : 1px solid var(--dxp-border);
	border-radius  : 9999px;
	background     : #ffffff;
	color          : var(--brand-charcoal);
	font-size      : .875rem;
	font-weight    : 500;
	line-height    : 1.2;
	text-decoration: none;
	transition     : border-color var(--dxp-dur-fast), background var(--dxp-dur-fast), color var(--dxp-dur-fast);
}

.dxp-cat-filter-btn:hover {
	border-color: var(--brand-green);
	color       : var(--brand-green);
}

.dxp-cat-filter-btn.is-active {
	background  : var(--dxp-primary);
	border-color: var(--dxp-primary);
	color       : var(--dxp-primary-contrast);
}