/*
Theme Name: Kronika
Theme URI: https://example.com/kronika
Author: Piotr Jasiówka
Author URI: https://example.com
Description: Osobisty motyw blokowy (FSE) dla domowego bloga. Wygląd wiernie odwzorowuje estetykę motywu Manual (SmartWP): periwinkle nagłówek z wyśrodkowanym menu i pigułką wyszukiwania, lewe drzewko kategorii, czysta typografia PT Sans oraz wąska, ciemna stopka. Napisany od zera na blokach rdzenia WordPress. Strona główna z listą wpisów, hierarchiczne drzewko kategorii, chmura tagów, wyszukiwarka, paginacja i komentarze.
Requires at least: 6.7
Tested up to: 7.0
Requires PHP: 8.2
Version: 0.3.2
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: kronika
Tags: blog, block-styles, full-site-editing, block-patterns, two-columns, custom-colors, custom-menu, featured-images, threaded-comments, translation-ready
*/

/* ============================================================
 * Kronika — większość stylów żyje w theme.json.
 * Tu: układ nagłówka/stopki, pigułka wyszukiwarki, drzewko
 * kategorii i lista wpisów — czyli to, czego theme.json nie
 * wyraża wygodnie, a co decyduje o wiernym wyglądzie.
 * ============================================================ */

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

/* ---------- NAGŁÓWEK (periwinkle) ---------- */
.site-header { position: relative; }
.site-header__inner { min-height: 92px; }

/* Logo / wordmark */
.site-brand .wp-block-site-title { margin: 0; }
.site-brand .wp-block-site-title a { text-decoration: none !important; }
.site-brand .wp-block-site-tagline { margin: 0; }

/* Menu w nagłówku — wyśrodkowane, białe, Karla uppercase */
.site-header .header-nav { flex: 1 1 auto; }
.site-header .header-nav a,
.site-header .header-nav .wp-block-navigation-item__content { color: #fff; white-space: nowrap; }
.site-header .header-nav .wp-block-navigation-item__content:hover { opacity: 0.75; text-decoration: none; }
.site-header .header-nav .wp-block-navigation__responsive-container-open,
.site-header .header-nav .wp-block-navigation__responsive-container-close { color: #fff; }

/* Wyszukiwarka w nagłówku — biała pigułka z lupą po lewej */
.site-header .header-search { flex: 0 0 auto; width: min(370px, 34vw); }
.site-header .header-search .wp-block-search__label { display: none; }
.site-header .header-search .wp-block-search__inside-wrapper {
	flex-direction: row-reverse;
	background: #fdfdfd;
	border: 1px solid #e2e7ee;
	border-radius: 45px;
	padding: 2px 6px 2px 4px;
	align-items: center;
	box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}
.site-header .header-search .wp-block-search__input {
	background: transparent;
	border: 0;
	box-shadow: none;
	outline: none;
	font-size: 14px;
	color: #272626;
	padding: 8px 12px;
	letter-spacing: 0.3px;
}
.site-header .header-search .wp-block-search__input::placeholder { color: #9d9d9d; }
.site-header .header-search .wp-block-search__button {
	background: transparent !important;
	color: #7a7f8c !important;
	border: 0;
	box-shadow: none;
	min-width: 0;
	margin: 0;
	padding: 6px 6px 6px 10px;
}
.site-header .header-search .wp-block-search__button svg { width: 22px; height: 22px; fill: #7a7f8c; }

/* ---------- UKŁAD: lewe drzewko + treść ---------- */
.blog-layout { align-items: flex-start; }
.blog-layout > .blog-sidebar-col { flex: 0 0 250px; max-width: 250px; }
.blog-layout > .blog-main { flex: 1 1 0; min-width: 0; }

/* ---------- LEWE DRZEWKO (kategorie/tagi) ---------- */
.doc-tree__title {
	margin: 0 0 0.6rem;
	padding-bottom: 0.4rem;
	border-bottom: 1px solid #eceef4;
}

/* Drzewko kategorii — chevrony, wcięcia, prowadnica, stan aktywny */
.doc-tree .wp-block-categories,
.doc-tree .wp-block-categories ul {
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: 15px;
	line-height: 1.5;
}
.doc-tree .wp-block-categories li { position: relative; margin: 1px 0; }
.doc-tree .wp-block-categories a {
	display: inline-block;
	color: #1d2746;
	text-decoration: none;
	padding: 5px 6px 5px 22px;
	border-radius: 4px;
	position: relative;
	transition: color 0.15s ease, background 0.15s ease;
}
.doc-tree .wp-block-categories a::before {
	content: "\203A"; /* › */
	position: absolute;
	left: 8px;
	top: 50%;
	transform: translateY(-52%);
	color: #c2c8d6;
	font-weight: 700;
}
.doc-tree .wp-block-categories a:hover { color: #5976de; background: #f4f6fd; }
.doc-tree .wp-block-categories .current-cat > a,
.doc-tree .wp-block-categories .current-cat-ancestor > a { color: #5976de; font-weight: 700; }
.doc-tree .wp-block-categories .children {
	margin-left: 11px;
	padding-left: 12px;
	border-left: 1px dashed #d9deea;
	margin-top: 2px;
}

/* Chmura tagów — pigułki */
.doc-tree .wp-block-tag-cloud { line-height: 2.1; }
.wp-block-tag-cloud a {
	display: inline-block;
	margin: 0 0.35rem 0.5rem 0;
	padding: 0.28rem 0.75rem;
	border: 1px solid #e2e7ee;
	border-radius: 999px;
	background: #fff;
	font-size: 13px !important;
	line-height: 1.4;
	color: #1d2746;
	text-decoration: none;
	transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.wp-block-tag-cloud a:hover { background: #5976de; border-color: #5976de; color: #fff; }

/* Najnowsze wpisy w panelu */
.doc-tree .wp-block-latest-posts { list-style: none; margin: 0; padding: 0; font-size: 14px; }
.doc-tree .wp-block-latest-posts li { margin: 0 0 0.7rem; line-height: 1.35; }
.doc-tree .wp-block-latest-posts a { color: #1d2746; text-decoration: none; font-weight: 700; }
.doc-tree .wp-block-latest-posts a:hover { color: #5976de; }
.doc-tree .wp-block-latest-posts__post-date { display: block; color: #9d9d9d; font-size: 12px; margin-top: 2px; }

/* ---------- PRAWA KOLUMNA: SPIS TREŚCI ---------- */
.blog-layout.has-toc > .blog-toc-col { flex: 0 0 200px; max-width: 200px; }
.toc {
	position: sticky;
	top: 1.5rem;
	font-size: 13px;
}
.toc__head {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 0.5rem;
	padding-bottom: 0.5rem;
	margin-bottom: 0.6rem;
	border-bottom: 1px solid #eceef4;
}
.toc__label {
	color: #9d9d9d;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
}
.toc__toggle {
	background: none;
	border: 0;
	padding: 0;
	cursor: pointer;
	color: #5976de;
	font: inherit;
	font-size: 12px;
}
.toc__toggle:hover { text-decoration: underline; }
.toc__list { list-style: none; margin: 0; padding: 0; }
.toc__item { margin: 1px 0; }
.toc__item a {
	display: block;
	color: #1d2746;
	text-decoration: none;
	padding: 3px 0 3px 12px;
	border-left: 2px solid transparent;
	line-height: 1.35;
	transition: color 0.15s ease, border-color 0.15s ease;
}
.toc__item--h3 a { padding-left: 24px; font-size: 12.5px; color: #5a5e68; }
.toc__item a:hover { color: #5976de; }
.toc__item a.is-active { color: #5976de; border-left-color: #5976de; font-weight: 700; }

/* ---------- LISTA WPISÓW ---------- */
.post-list .post-row:first-child { padding-top: 0 !important; }
.post-row__image { margin-bottom: 0.25rem; }
.post-row__image img { width: 100%; object-fit: cover; }
.post-row .wp-block-post-date,
.post-row .wp-block-post-date time { color: #9d9d9d; }
.post-row .wp-block-post-terms a { color: #5976de; text-decoration: none; }
.post-row .wp-block-post-title { margin: 0; }
.post-row .wp-block-post-title a { color: #1d2746; text-decoration: none; transition: color 0.15s ease; }
.post-row .wp-block-post-title a:hover { color: #5976de; }
.post-row .wp-block-post-excerpt { color: #5a5e68; }
.post-row .wp-block-post-excerpt__excerpt { margin-bottom: 0.4rem; }
.wp-block-post-excerpt__more-link { color: #5976de; font-weight: 700; text-decoration: none; }
.wp-block-post-excerpt__more-link:hover { text-decoration: underline; }

/* Meta pojedynczego wpisu */
.single-meta .wp-block-post-date time { color: #9d9d9d; }
.single-meta .wp-block-post-terms a,
.single-tags .wp-block-post-terms a { color: #5976de; text-decoration: none; }

/* Treść wpisu: linki podkreślane dopiero na hover */
.wp-block-post-content a { text-decoration: none; }
.wp-block-post-content a:hover { text-decoration: underline; }

/* ---------- PAGINACJA ---------- */
.wp-block-query-pagination { font-size: 14px; }
.wp-block-query-pagination a,
.wp-block-query-pagination .wp-block-query-pagination-numbers { color: #1d2746; text-decoration: none; }
.wp-block-query-pagination a:hover { color: #5976de; }
.wp-block-query-pagination .page-numbers.current { color: #5976de; font-weight: 700; }

/* ---------- POLE WYSZUKIWANIA (poza nagłówkiem) ---------- */
.blog-main .wp-block-search__input,
.wp-block-search:not(.header-search) .wp-block-search__input {
	border: 1px solid #e2e7ee;
	border-radius: 4px;
}
.wp-block-search:not(.header-search) .wp-block-search__button { border-radius: 4px; }

/* ---------- STOPKA ---------- */
.site-footer__inner { min-height: 44px; }
.site-footer .footer-nav a { color: #9d9d9d; text-decoration: none; }
.site-footer .footer-nav a:hover { color: #fff; }

/* ---------- RESPONSYWNOŚĆ ---------- */
@media (max-width: 900px) {
	.blog-layout > .blog-sidebar-col,
	.blog-layout > .blog-main {
		flex: 1 1 100% !important;
		max-width: 100% !important;
	}
	/* na mobile drzewko pod treścią */
	.blog-layout { flex-direction: column-reverse; }

	/* wpis z 3 kolumnami: treść pierwsza, drzewko pod nią, spis ukryty */
	.blog-layout.has-toc { flex-direction: column; }
	.blog-layout.has-toc > .blog-main { order: -1; }
	.blog-layout.has-toc > .blog-toc-col { display: none; }
}
@media (max-width: 781px) {
	.site-header__inner { flex-wrap: wrap; row-gap: 0.75rem; }
	.site-header .header-search { width: 100%; order: 3; }
	.site-header .header-nav { order: 2; }
	.site-footer__inner { justify-content: center; text-align: center; }
}
