/* ==========================================================================
   Baliimoti Design — Блог
   Архив (мрежа от карти) и единична публикация.
   Спецификация: design/DESIGN.md (секции 3, 4, 5, 8).
   Стойности: само var(--bd-*). Прозрачността се прави с color-mix() върху
   токен (не hardcoded rgba), за да остане един източник на цветове.
   ========================================================================== */

/* ==========================================================================
   1. ОБЩО — 16:9 корици

   Темата подава миниатюрата в естественото ѝ съотношение (1170×380 при
   наличните размери, но при по-малките източници — собственото им). Затова
   редицата е неравна. Фиксираме 16:9 и покриваме с object-fit: cover, център
   по двете оси — част от кориците са вертикални.
   ========================================================================== */

article.post-large-image .entry-thumb-wrap,
article.post-single .entry-thumb-wrap {
	position: relative;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background-color: var(--bd-surface-alt);
}

article.post-large-image .entry-thumb-wrap .entry-thumbnail,
article.post-single .entry-thumb-wrap .entry-thumbnail,
article.post-large-image .entry-thumb-wrap a.entry-thumbnail-overlay,
article.post-single .entry-thumb-wrap a.entry-thumbnail-overlay {
	display: block;
	width: 100%;
	height: 100%;
}

article.post-large-image .entry-thumb-wrap img,
article.post-single .entry-thumb-wrap img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	transition: transform 600ms var(--bd-ease);
}

/* Спокойно приближение на корицата при hover върху картата (както при имотите). */
article.post-large-image:hover .entry-thumb-wrap img {
	transform: scale(1.04);
}

/* ==========================================================================
   2. АРХИВ — мрежа от карти
   3 колони ≥1200px · 2 колони 768–1199px · 1 колона <768px.
   ========================================================================== */

.archive-large-image .blog-wrap {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--bd-s-6);
	/* clearfix-ът на темата не трябва да създава grid-клетки. */
}

.archive-large-image .blog-wrap::before,
.archive-large-image .blog-wrap::after {
	content: none;
	display: none;
}

@media (min-width: 768px) {
	.archive-large-image .blog-wrap {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 1200px) {
	.archive-large-image .blog-wrap {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

/* Картата */
article.post-large-image {
	/* grid: корица и мета-лента в един ред (лентата ляга върху долния ръб
	   на снимката), съдържанието — на втори ред. */
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	grid-template-rows: auto 1fr;
	margin-bottom: 0;
	border: 1px solid var(--bd-border);
	border-radius: var(--bd-radius-lg);
	background-color: var(--bd-surface-card);
	box-shadow: var(--bd-shadow-1);
	overflow: hidden;
	transition: transform var(--bd-t-slow) var(--bd-ease),
		box-shadow var(--bd-t-slow) var(--bd-ease);
}

/* clearfix-ът на статията би станал допълнителна grid-клетка. */
article.post-large-image::before,
article.post-large-image::after {
	content: none;
	display: none;
}

article.post-large-image:hover {
	transform: translateY(-3px);
	box-shadow: var(--bd-shadow-3);
}

article.post-large-image > .entry-thumb-wrap {
	grid-column: 1;
	grid-row: 1;
}

article.post-large-image > .entry-post-meta {
	grid-column: 1;
	grid-row: 1;
	align-self: end;
	z-index: 2;
}

article.post-large-image > .entry-content-wrap {
	grid-column: 1;
	grid-row: 2;
}

/* --- Мета-лента върху долната част на снимката ---------------------------- */

article.post-large-image > .entry-post-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	padding: var(--bd-s-5) var(--bd-s-5) var(--bd-s-3);
	color: var(--bd-text-on-dark);
	/* Тъмно отдолу нагоре — лентата се слива в снимката, текстът остава четим. */
	background-image: linear-gradient(
		to top,
		color-mix(in srgb, var(--bd-surface-dark) 92%, transparent) 0%,
		color-mix(in srgb, var(--bd-surface-dark) 84%, transparent) 46%,
		color-mix(in srgb, var(--bd-surface-dark) 0%, transparent) 100%
	);
}

article.post-large-image > .entry-post-meta > div {
	display: flex;
	align-items: center;
	gap: var(--bd-s-1);
	width: auto;
	float: none;
	padding: 0;
	margin: 0;
	font-size: var(--bd-fs-caption);
	line-height: 1.3;
}

article.post-large-image > .entry-post-meta a,
article.post-large-image > .entry-post-meta i,
article.post-large-image > .entry-post-meta span {
	float: none;
	margin: 0;
	color: inherit;
	font-size: inherit;
}

article.post-large-image > .entry-post-meta i {
	font-size: 14px;
	line-height: 1;
}

/* Разделител между елементите на лентата */
article.post-large-image > .entry-post-meta > div + div {
	margin-left: var(--bd-s-4);
}

article.post-large-image > .entry-post-meta > div + div::before {
	width: 1px;
	height: 12px;
	margin-right: var(--bd-s-4);
	background-color: color-mix(in srgb, var(--bd-text-on-dark) 32%, transparent);
	content: "";
}

/* Празният автор (темата не подава име) и нулевите коментари не се показват —
   те са причината за „вдлъбнатината" и шума в лентата. CSS не може да различи
   броя коментари, затова елементът се скрива на картата по принцип. */
article.post-large-image > .entry-post-meta .entry-meta-author,
article.post-large-image > .entry-post-meta .entry-meta-comment {
	display: none;
}

/* „Posted in" е английски етикет на темата — махаме го, оставяме категорията. */
article.post-large-image > .entry-post-meta .entry-meta-cat > span {
	display: none;
}

article.post-large-image > .entry-post-meta .entry-meta-cat ul {
	display: flex;
	float: none;
	margin: 0;
	padding: 0;
}

article.post-large-image > .entry-post-meta .entry-meta-cat ul li {
	float: none;
	margin: 0;
}

article.post-large-image > .entry-post-meta .entry-meta-cat ul li + li {
	margin-left: var(--bd-s-1);
}

article.post-large-image > .entry-post-meta .entry-meta-cat ul li + li::before {
	content: none;
}

article.post-large-image > .entry-post-meta .entry-meta-cat ul li:last-child::after {
	content: none;
}

/* --- Тяло на картата ------------------------------------------------------ */

article.post-large-image > .entry-content-wrap {
	display: flex;
	flex-direction: column;
	gap: var(--bd-s-3);
	padding: var(--bd-s-5);
}

/* Темата слага margin-bottom:10px !important на този клас — презаписваме с
   !important и по-висока специфичност, понеже разстоянието идва от gap. */
article.post-large-image .entry-post-title {
	margin: 0 !important;
	font-family: var(--bd-font-display);
	font-size: var(--bd-fs-card-title);
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 0;
	color: var(--bd-text);
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	overflow: hidden;
}

article.post-large-image .entry-post-title a {
	color: inherit;
}

article.post-large-image .entry-post-title a:hover {
	color: var(--bd-link-hover);
}

article.post-large-image .entry-excerpt {
	max-height: none;
	margin: 0;
	color: var(--bd-text-tertiary);
	font-size: var(--bd-fs-body-sm);
	line-height: var(--bd-lh-body);
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	overflow: hidden;
}

article.post-large-image .entry-excerpt p {
	margin: 0;
}

/* „Read More" — контурен бутон като .bd-btn--secondary. */
article.post-large-image .blog-read-more {
	align-self: flex-start;
	margin-top: auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 12px 24px;
	border: 1px solid var(--bd-primary);
	border-radius: var(--bd-radius);
	background-color: transparent;
	color: var(--bd-primary);
	font-family: var(--bd-font-body);
	font-size: var(--bd-fs-small);
	font-weight: 600;
	line-height: 1;
	letter-spacing: .02em;
	text-decoration: none;
	transition: background-color var(--bd-t-base) var(--bd-ease),
		color var(--bd-t-base) var(--bd-ease),
		border-color var(--bd-t-base) var(--bd-ease);
}

article.post-large-image .blog-read-more:hover,
article.post-large-image .blog-read-more:focus {
	background-color: var(--bd-primary);
	color: var(--bd-text-on-dark);
	text-decoration: none;
}

article.post-large-image .blog-read-more:focus-visible {
	outline: none;
	box-shadow: 0 0 0 3px var(--bd-focus-ring);
}

/* Текстът на темата е „Read More". Подменяме го с български само визуално:
   оригиналният низ остава в DOM (виж доклада — недостъпно за CSS премахване). */
article.post-large-image .blog-read-more {
	font-size: 0;
}

article.post-large-image .blog-read-more::after {
	content: "Прочетете";
	font-size: var(--bd-fs-small);
}

/* --- Пагинация ------------------------------------------------------------ */

.archive-large-image .paging-navigation {
	margin-top: var(--bd-s-8);
}

.archive-large-image .paging-navigation .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	margin: 0 var(--bd-s-1) var(--bd-s-2) 0;
	padding: 0 var(--bd-s-3);
	border: 1px solid var(--bd-border);
	border-radius: var(--bd-radius);
	background-color: var(--bd-surface-card);
	color: var(--bd-text-secondary);
	font-family: var(--bd-font-body);
	font-size: var(--bd-fs-small);
	font-weight: 600;
	line-height: 1;
	position: static;
	transition: background-color var(--bd-t-fast) var(--bd-ease),
		border-color var(--bd-t-fast) var(--bd-ease),
		color var(--bd-t-fast) var(--bd-ease);
}

.archive-large-image .paging-navigation .page-numbers:hover,
.archive-large-image .paging-navigation .page-numbers:focus {
	border-color: var(--bd-primary);
	background-color: var(--bd-surface-card);
	color: var(--bd-primary);
}

.archive-large-image .paging-navigation .page-numbers.current {
	border-color: var(--bd-primary);
	background-color: var(--bd-primary);
	color: var(--bd-text-on-dark);
}

.archive-large-image .paging-navigation .page-numbers:focus-visible {
	outline: none;
	box-shadow: 0 0 0 3px var(--bd-focus-ring);
}

/* ==========================================================================
   3. ЕДИНИЧНА ПУБЛИКАЦИЯ
   Тясна колона за четене (~760px), заглавие Cormorant, дискретна мета лента.
   ========================================================================== */

article.post-single {
	display: flex;
	flex-direction: column;
	gap: var(--bd-s-4);
	max-width: var(--bd-container-narrow);
	margin-inline: auto;
}

/* Ред: снимка → заглавие → мета → съдържание. */
article.post-single > .entry-thumb-wrap { order: 1; margin: 0; }
article.post-single > .entry-post-title { order: 2; }
article.post-single > .entry-post-meta { order: 3; }
article.post-single > .entry-content-wrap { order: 4; }

/* Заглавие — Display Large (Cormorant). Темата заключва font-size на 35px чрез
   `.single-blog-inner .post-single .entry-post-title` (0,3,0) — презаписваме с
   една степен по-висока специфичност, без !important. */
.single-blog-inner .post-single > .entry-post-title {
	margin: 0 !important;
	font-family: var(--bd-font-display);
	font-size: var(--bd-fs-display);
	font-weight: 500;
	line-height: var(--bd-lh-display);
	letter-spacing: -.005em;
	color: var(--bd-text);
}

/* Мета лента — дискретна, върху страницата (не тъмна ивица). */
article.post-single > .entry-post-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin: 0;
	padding: 0;
	line-height: 1.4;
	background-color: transparent;
}

article.post-single > .entry-post-meta > div {
	display: flex;
	align-items: center;
	gap: var(--bd-s-1);
	width: auto;
	float: none;
	padding: 0;
	margin: 0;
	color: var(--bd-text-tertiary);
	font-size: var(--bd-fs-small);
}

/* Темата боядисва всички наследници в бяло (`.entry-post-meta *`); връщаме ги
   към третичния цвят на дискретната мета лента. */
article.post-single > .entry-post-meta * {
	float: none;
	margin: 0;
	color: inherit;
	font-size: inherit;
}

article.post-single > .entry-post-meta a:hover {
	color: var(--bd-link-hover);
}

article.post-single > .entry-post-meta i {
	font-size: 15px;
	line-height: 1;
}

article.post-single > .entry-post-meta > div + div {
	margin-left: var(--bd-s-4);
}

article.post-single > .entry-post-meta > div + div::before {
	width: 1px;
	height: 12px;
	margin-right: var(--bd-s-4);
	background-color: var(--bd-border);
	content: "";
}

article.post-single > .entry-post-meta .entry-meta-author,
article.post-single > .entry-post-meta .entry-meta-comment {
	display: none;
}

article.post-single > .entry-post-meta .entry-meta-cat > span {
	display: none;
}

article.post-single > .entry-post-meta .entry-meta-cat ul {
	display: flex;
	float: none;
	margin: 0;
	padding: 0;
}

article.post-single > .entry-post-meta .entry-meta-cat ul li {
	float: none;
	margin: 0;
}

article.post-single > .entry-post-meta .entry-meta-cat ul li + li {
	margin-left: var(--bd-s-1);
}

article.post-single > .entry-post-meta .entry-meta-cat ul li + li::before,
article.post-single > .entry-post-meta .entry-meta-cat ul li:last-child::after {
	content: none;
}

/* Съдържание — Manrope 16px/1.65; плътно, но четливо. */
article.post-single .entry-content {
	font-family: var(--bd-font-body);
	font-size: var(--bd-fs-body);
	line-height: var(--bd-lh-body);
	color: var(--bd-text-secondary);
}

article.post-single .entry-content p {
	margin-bottom: var(--bd-s-5);
}

article.post-single .entry-content > :last-child {
	margin-bottom: 0;
}

article.post-single .entry-content ul,
article.post-single .entry-content ol {
	margin: 0 0 var(--bd-s-5);
	padding-left: 1.4em;
}

article.post-single .entry-content li {
	margin-bottom: var(--bd-s-2);
	line-height: var(--bd-lh-body);
}

article.post-single .entry-content a {
	color: var(--bd-link);
	text-decoration: underline;
	text-underline-offset: 3px;
}

article.post-single .entry-content a:hover {
	color: var(--bd-link-hover);
}

/* Цитат в текста — без темата-овия оранжев блок. */
article.post-single .entry-content blockquote {
	margin: 0 0 var(--bd-s-6);
	padding: var(--bd-s-1) 0 var(--bd-s-1) var(--bd-s-5);
	border: 0;
	border-left: 3px solid var(--bd-accent);
	background: none;
	color: var(--bd-ink-800);
	font-family: var(--bd-font-display);
	font-size: clamp(1.5rem, 2.6vw, 2rem);
	font-style: italic;
	font-weight: 500;
	line-height: 1.35;
}

article.post-single .entry-content blockquote p {
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	font-style: inherit;
	line-height: inherit;
	margin-bottom: 0;
}

article.post-single .entry-content blockquote cite {
	display: block;
	margin-top: var(--bd-s-3);
	color: var(--bd-text-tertiary);
	font-family: var(--bd-font-body);
	font-size: var(--bd-fs-small);
	font-style: normal;
}

article.post-single .entry-content img {
	border-radius: var(--bd-radius-lg);
}

article.post-single .entry-content h1,
article.post-single .entry-content h2,
article.post-single .entry-content h3,
article.post-single .entry-content h4 {
	color: var(--bd-text);
}

/* Под 991px темата налага ширина 100% и рамки на мета елементите (белег от
   стария мобилен ред). Връщаме ги към едноредовата лента. */
@media (max-width: 991px) {
	article.post-large-image > .entry-post-meta > div,
	article.post-single > .entry-post-meta > div,
	article.post-large-image > .entry-post-meta > div.entry-meta-cat,
	article.post-large-image > .entry-post-meta > div.entry-meta-comment,
	article.post-single > .entry-post-meta > div.entry-meta-cat,
	article.post-single > .entry-post-meta > div.entry-meta-comment {
		width: auto;
		border: 0;
	}
}

/* --- Достъпност и движение ------------------------------------------------ */

article.post-single .entry-content a:focus-visible,
article.post-single > .entry-post-meta a:focus-visible,
article.post-large-image > .entry-post-meta a:focus-visible,
article.post-large-image .entry-post-title a:focus-visible {
	outline: none;
	box-shadow: 0 0 0 3px var(--bd-focus-ring);
	border-radius: var(--bd-radius-sm);
}

@media (prefers-reduced-motion: reduce) {
	article.post-large-image,
	article.post-large-image .entry-thumb-wrap img,
	article.post-large-image .blog-read-more,
	.archive-large-image .paging-navigation .page-numbers {
		transition: none;
	}

	article.post-large-image:hover {
		transform: none;
	}

	article.post-large-image:hover .entry-thumb-wrap img {
		transform: none;
	}
}

/* --------------------------------------------------------------------------
   Банерът „page title" на темата

   Височината му НЕ се пипа тук. Тя идва от отстъп, който темата подава като
   INLINE стил (`style="padding-top:178px"`), а стойността се пази в тема-
   тичните preset-и (постове от тип `gf_preset`), мета ключ
   `g5plus_framework_page_title_padding`:
     #21  „Single Blog Preset"   — единична публикация
     #269 „Blog Archive Preset"  — архив на блога
   Зададени са на 36px и 72px в източника, затова тук няма нужда от CSS.
   Промяната се прави с scripts/fix-theme-titles.php.
   -------------------------------------------------------------------------- */

/* На единична публикация надписът в банера е „Blog" — темата подава заглавието
   на блог архива, не на статията. Подвеждащо е и дублира заглатието отдолу. */
body.single .page-title h1,
body.single .page-title h2 {
	display: none;
}