/*
Theme Name: Ti, kdo běží kolem
Theme URI: https://tikdobezikolem.cz/
Author: Vendula Bezáková
Description: Blokové téma pro cestovatelský blog o sólo horské turistice. Levý sidebar, velké fotky, článek postavený na úvodní fotce.
Version: 0.4.0
Requires at least: 6.6
Tested up to: 7.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: tikdobezikolem
*/

:root {
	--tk-papir: var(--wp--preset--color--papir);
	--tk-plocha: var(--wp--preset--color--plocha);
	--tk-linka: var(--wp--preset--color--linka);
	--tk-text: var(--wp--preset--color--text);
	--tk-text-2: var(--wp--preset--color--text-2);
	--tk-akcent: var(--wp--preset--color--akcent);
	--tk-sidebar: 320px;
	--znacka-w: clamp(40px, 4.2vw, 60px);
	--znacka-gap: 1.5rem;
}

/* ---------- Rozvržení se sidebarem (výpisy) ---------- */
.s-sidebarem { display: block; }
.s-sidebarem > .sidebar { display: none; }
.s-sidebarem > .obsah {
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40);
}
.s-sidebarem > .obsah > * { max-width: 992px; }
@media (min-width: 1024px) {
	.s-sidebarem {
		display: grid;
		grid-template-columns: var(--tk-sidebar) minmax(0, 1fr);
		align-items: start;
		min-height: 100vh;
	}
	.s-sidebarem > .jen-mobil { display: none; }
	.s-sidebarem > .sidebar {
		display: block;
		position: sticky;
		top: 0;
		height: 100vh;
		overflow-y: auto;
		background: var(--tk-plocha);
		border-right: 1px solid var(--tk-linka);
		box-sizing: border-box;
		padding: 3rem 2.5rem;
		margin: 0;
	}
	.s-sidebarem > .obsah { padding: 3.5rem 4rem; margin: 0; }
}
.s-sidebarem > * { margin-block-start: 0; }

/* ---------- Mobilní lišta ---------- */
.jen-mobil { background: var(--tk-plocha); border-bottom: 1px solid var(--tk-linka); }
.jen-mobil .site-header { padding-inline: var(--wp--preset--spacing--40); }
.kam-staty {
	list-style: none; margin: 0; padding: 0.75rem var(--wp--preset--spacing--40);
	display: flex; gap: 0.5rem; overflow-x: auto; border-top: 1px solid var(--tk-linka);
}
.kam-staty li a {
	display: inline-block; white-space: nowrap; padding: 0.45rem 0.8rem;
	border: 1px solid var(--tk-linka); border-radius: 999px;
	font-size: 0.875rem; color: var(--tk-text); text-decoration: none;
}

/* ---------- Sidebar ---------- */
.sidebar .wp-block-site-logo img { border-radius: 50%; }
.sidebar .wp-block-site-title { font-size: 1.75rem; }
.sidebar__bio { font-size: 0.9375rem; line-height: 1.55; color: var(--tk-text); margin-top: 0.75rem !important; }
.sidebar__nadpis {
	font-family: var(--wp--preset--font-family--sans) !important;
	font-size: 0.875rem !important; font-weight: 700 !important;
	color: var(--tk-text-2); margin-block-start: 2.25rem !important; margin-block-end: 0.5rem;
}
.sidebar .wp-block-navigation { font-size: 1.0625rem; }
.sidebar .wp-block-navigation .current-menu-item > a,
.sidebar .wp-block-navigation a[aria-current="page"] { color: var(--tk-akcent); font-weight: 700; }
.sidebar .wp-block-search__label { font-size: 0.875rem; font-weight: 700; color: var(--tk-text-2); }
.wp-block-search__inside-wrapper { border: 1px solid var(--tk-linka); border-radius: 4px; background: var(--tk-papir); padding: 2px; }
.wp-block-search__input { border: 0; background: transparent; font: inherit; font-size: 1rem; min-height: 40px; }
.wp-block-search__button { background: transparent !important; color: var(--tk-text) !important; padding: 0.4rem 0.6rem !important; }

/* Kam – hierarchie kategorií */
ul.kam { list-style: none; padding: 0; margin: 0; }
ul.kam > li { border-bottom: 1px solid var(--tk-linka); }
ul.kam > li > a { display: block; padding: 0.6rem 0; font-weight: 600; }
ul.kam a { color: var(--tk-text); text-decoration: none; }
ul.kam a:hover { color: var(--tk-akcent); }
ul.kam ul.children { list-style: none; margin: 0 0 0.6rem; padding: 0 0 0 1rem; }
ul.kam ul.children a { display: block; padding: 0.25rem 0; font-size: 0.9375rem; color: var(--tk-text-2); }
ul.kam .current-cat > a { color: var(--tk-akcent); }

/* Jak – štítky jako chipy */
.jak.wp-block-tag-cloud { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.jak.wp-block-tag-cloud a {
	margin: 0 !important; padding: 0.45rem 0.8rem; font-size: 0.875rem !important;
	border: 1px solid var(--tk-linka); border-radius: 999px; color: var(--tk-text); text-decoration: none;
}
.jak.wp-block-tag-cloud a:hover { border-color: var(--tk-akcent); color: var(--tk-akcent); }
.sidebar__copy { font-size: 0.8125rem; color: var(--tk-text-2); margin-top: 2rem !important; }

/* ---------- Drobečková navigace a meta ---------- */
.meta { gap: 0.5rem 1rem !important; align-items: baseline; font-size: var(--wp--preset--font-size--small); color: var(--tk-text-2); }
.meta p { margin: 0; font-size: inherit; }
.drobecky a { text-decoration: none; }
.drobecky__odd { margin: 0 0.35em; opacity: 0.7; }

/* ---------- Homepage: nejnovější výprava přes celou šířku ---------- */
.s-sidebarem > .obsah > .nejnovejsi {
	max-width: none;
	margin: calc(-1 * var(--wp--preset--spacing--50)) calc(-1 * var(--wp--preset--spacing--40)) 0;
}
@media (min-width: 1024px) {
	.s-sidebarem > .obsah > .nejnovejsi { margin: -3.5rem -4rem 0; }
}
.nejnovejsi .wp-block-post-template { margin: 0; padding: 0; list-style: none; }
.nejnovejsi .wp-block-post-template > li {
	position: relative; overflow: hidden;
	min-height: 62vh; display: flex; flex-direction: column; justify-content: flex-end;
}
@media (min-width: 1024px) { .nejnovejsi .wp-block-post-template > li { min-height: 78vh; } }
.nejnovejsi .wp-block-post-featured-image { position: absolute; inset: 0; margin: 0 !important; height: 100%; }
.nejnovejsi .wp-block-post-featured-image a,
.nejnovejsi .wp-block-post-featured-image img { display: block; width: 100%; height: 100% !important; object-fit: cover; border-radius: 0; }
.nejnovejsi .wp-block-post-featured-image img { object-position: 70% 35%; }
.nejnovejsi .wp-block-post-featured-image::after {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background: linear-gradient(to top, rgba(20, 18, 15, 0.78) 0%, rgba(20, 18, 15, 0.3) 50%, rgba(20, 18, 15, 0.1) 100%);
}
.nejnovejsi__text {
	position: relative; z-index: 2; box-sizing: border-box; max-width: 920px; margin: 0 !important;
	padding: 0 var(--wp--preset--spacing--40) var(--wp--preset--spacing--50);
	color: #fff;
}
@media (min-width: 1024px) { .nejnovejsi__text { padding: 0 4rem 3.5rem; } }
.nejnovejsi__text > * + * { margin-top: 1rem !important; }
.nejnovejsi__stitek { font-size: 0.875rem; font-weight: 700; margin: 0; }
.nejnovejsi .wp-block-post-title { font-size: var(--wp--preset--font-size--xx-large); max-width: 18ch; }
.nejnovejsi .wp-block-post-title a,
.nejnovejsi .meta, .nejnovejsi .meta *, .nejnovejsi .drobecky a,
.nejnovejsi .wp-block-post-excerpt, .nejnovejsi .wp-block-post-excerpt__more-link { color: #fff !important; }
.nejnovejsi .wp-block-post-excerpt { font-size: 1.0625rem; max-width: 60ch; }
.nejnovejsi .wp-block-post-excerpt__more-link { text-decoration: underline; }
.dalsi-nadpis {
	margin-top: var(--wp--preset--spacing--50) !important;
	font-weight: 500 !important;
}

/* ---------- Řádek článku ve výpisu ---------- */
.vypis .wp-block-post-template { display: flex; flex-direction: column; gap: var(--wp--preset--spacing--50); margin-top: var(--wp--preset--spacing--40); }
.radek { display: grid; gap: 1.25rem; }
@media (min-width: 782px) {
	.radek { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.5rem; align-items: center; }
}
.radek > * { margin: 0 !important; }
.radek__text > * + * { margin-top: 0.75rem !important; }
.radek .wp-block-post-title { font-size: var(--wp--preset--font-size--x-large); }
.wp-block-post-excerpt__more-link { font-weight: 600; color: var(--tk-akcent); }
.wp-block-post-excerpt__more-text { margin-top: 0.75rem; }

/* Stránkování */
.wp-block-query-pagination { margin-top: var(--wp--preset--spacing--50); padding-top: var(--wp--preset--spacing--40); border-top: 1px solid var(--tk-linka); gap: 0.5rem; }
.wp-block-query-pagination a, .wp-block-query-pagination .page-numbers {
	display: inline-flex; min-width: 44px; min-height: 44px; align-items: center; justify-content: center;
	border: 1px solid var(--tk-linka); border-radius: 4px; text-decoration: none; color: var(--tk-text); padding: 0 0.75rem;
}
.wp-block-query-pagination .page-numbers.current { background: var(--tk-text); color: var(--tk-papir); border-color: var(--tk-text); }

/* Archiv */
.archiv-hlavicka .wp-block-query-title { font-size: var(--wp--preset--font-size--xx-large); margin: 0; }
.archiv-hlavicka .wp-block-term-description { color: var(--tk-text-2); max-width: 62ch; }

/* ---------- Hero článku ---------- */
.hero {
	position: relative; display: flex; flex-direction: column; justify-content: flex-end;
	min-height: 88vh; min-height: 88svh; color: #fff; overflow: hidden;
	padding: 0 var(--wp--preset--spacing--40) calc(var(--wp--preset--spacing--60) + 4rem) !important;
	margin-block-start: 0 !important;
}
.hero > .hero__img { position: absolute; inset: 0; margin: 0 !important; height: 100% !important; z-index: 0; }
.hero > .hero__img img { width: 100%; height: 100% !important; object-fit: cover; object-position: 70% 35%; border-radius: 0; }
.hero > .hero__img::after {
	content: ""; position: absolute; inset: 0;
	background: linear-gradient(to top, rgba(20, 18, 15, 0.72) 0%, rgba(20, 18, 15, 0.25) 45%, rgba(20, 18, 15, 0.35) 100%);
}
.hero > .hero__header { position: absolute; top: 0; left: 0; right: 0; z-index: 3; margin: 0 !important; }
.hero .site-header { padding: 1.25rem clamp(1.25rem, 3vw, 2.5rem); }
.site-header .wp-block-search__inside-wrapper { background: transparent; border: 0; }
.hero .site-header a, .hero .site-header .wp-block-site-title a,
.hero .site-header .wp-block-navigation__responsive-container-open,
.hero .site-header .wp-block-search__button { color: #fff !important; }
.hero__obsah {
	--znacka-w: clamp(40px, 4.2vw, 60px);
	--znacka-gap: 1.5rem;
	position: relative; z-index: 2; width: 100%; max-width: 1100px; margin: 0 auto !important; box-sizing: border-box;
	/* levý okraj textu = levý okraj sloupce s článkem, značka visí vlevo od nadpisu */
	padding-left: max(calc(var(--znacka-w) + var(--znacka-gap)), calc((min(1100px, 100%) - min(720px, 100%)) / 2));
}
.hero__obsah > * + * { margin-top: 1.25rem !important; }
.hero .drobecky, .hero .drobecky a, .hero__meta, .hero__meta * { color: #fff !important; }
.hero__meta { font-size: 0.9375rem; gap: 0.5rem 1.25rem !important; }
.hero__meta p { margin: 0; }

/* Stránka bez úvodní fotky: hero bez obrázku */
.hero:not(:has(.hero__img)) { min-height: 0; color: var(--tk-text); padding-top: 8rem !important; padding-bottom: var(--wp--preset--spacing--40) !important; }
.hero:not(:has(.hero__img)) .site-header a,
.hero:not(:has(.hero__img)) .site-header .wp-block-navigation__responsive-container-open,
.hero:not(:has(.hero__img)) .site-header .wp-block-search__button { color: var(--tk-text) !important; }
.hero:not(:has(.hero__img)) .drobecky, .hero:not(:has(.hero__img)) .drobecky a,
.hero:not(:has(.hero__img)) .hero__meta, .hero:not(:has(.hero__img)) .hero__meta * { color: var(--tk-text-2) !important; }

/* Turistická značka u H1 */
h1.znacka { position: relative; color: inherit; }
h1.znacka::before {
	content: ""; position: absolute; top: 0.16em; right: calc(100% + var(--znacka-gap, 1.5rem));
	width: var(--znacka-w, clamp(40px, 4.2vw, 60px)); aspect-ratio: 10 / 7;
	background: linear-gradient(#fff 0 33.34%, var(--tk-akcent) 33.34% 66.66%, #fff 66.66% 100%);
	box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.08);
}
@media (max-width: 781px) {
	.hero__obsah { padding-left: 0; }
	h1.znacka::before { position: static; display: block; margin-bottom: 1rem; }
}

/* ---------- Obsah článku ---------- */
.entry-content { margin-top: var(--wp--preset--spacing--60) !important; }
/* Perex: styl odstavce „Perex“ (v editoru Styly bloku) */
.entry-content > p:first-child, .entry-content > .karta-trasy:first-child + p, .is-style-perex { font-family: var(--wp--preset--font-family--serif); font-size: clamp(1.25rem, 1.05rem + 0.7vw, 1.5rem); line-height: 1.5; }

/* Fotky: výchozí šířka = šířka textu, „Široké“ zarovnání = 1100 px */
.entry-content img { max-width: 100%; height: auto; }
.entry-content .wp-block-image.aligncenter { display: block; }
.entry-content .wp-block-image.aligncenter img { display: block; margin-inline: auto; }
.entry-content .wp-caption { width: auto !important; max-width: 100%; }
/* Vložené mapy a videa (Vlastní HTML): na střed a na šířku textu */
.entry-content > iframe {
	display: block; width: 100%; max-width: var(--wp--style--global--content-size);
	margin-left: auto !important; margin-right: auto !important; border: 0; border-radius: 3px;
}
.entry-content > .karta-trasy:first-child { margin-top: calc(-1 * var(--wp--preset--spacing--60) - 4rem) !important; position: relative; z-index: 4; }
.entry-content h2 { margin-top: var(--wp--preset--spacing--50); }
.entry-content .alignwide, .entry-content .alignfull { margin-top: var(--wp--preset--spacing--50); margin-bottom: var(--wp--preset--spacing--50); }

/* Citát: bez uvozovek, linky nahoře a dole */
.wp-block-quote {
	border-top: 1px solid var(--tk-linka) !important; border-bottom: 1px solid var(--tk-linka) !important;
	border-left: 0 !important; quotes: none;
}
.wp-block-quote p { margin: 0; }
.wp-block-quote cite { display: block; margin-top: 1rem; }

/* Karta trasy */
.karta-trasy {
	display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem 1.5rem;
	background: #fff; border: 1px solid var(--tk-linka); border-radius: 6px;
	padding: 1.5rem 1.75rem !important;
}
@media (min-width: 900px) { .karta-trasy.alignwide { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
/* Karta je stejně široká jako nadpis v hero: od levého okraje značky po pravý okraj nadpisu */
@media (min-width: 782px) {
	.entry-content > .karta-trasy.alignwide {
		max-width: none !important; width: auto;
		margin-left: max(0px, calc((100% - min(720px, 100%)) / 2 - var(--znacka-w) - var(--znacka-gap))) !important;
		margin-right: calc((100% - min(1100px, 100%)) / 2) !important;
	}
}
.karta-trasy > * { margin: 0 !important; }
.karta-trasy__polozka > * { margin: 0 !important; }
.karta-trasy__nazev { font-size: 0.8125rem; font-weight: 600; color: var(--tk-text-2); }
.karta-trasy__hodnota { font-size: 1.0625rem; font-weight: 700; line-height: 1.3; }

/* Praktické info */
.prakticke-info {
	background: #fff; border: 1px solid var(--tk-linka); border-radius: 6px;
	padding: 1.75rem 2rem !important; margin-top: var(--wp--preset--spacing--50) !important;
}
.prakticke-info > * { margin: 0 !important; }
.prakticke-info__nadpis { font-size: var(--wp--preset--font-size--large) !important; margin-bottom: 0.75rem !important; }
.pi-radek { display: grid; grid-template-columns: 1fr; gap: 0.25rem; padding: 0.9rem 0 !important; border-top: 1px solid var(--tk-linka); }
.pi-radek > * { margin: 0 !important; }
@media (min-width: 600px) { .pi-radek { grid-template-columns: 10.5rem minmax(0, 1fr); gap: 1.5rem; } }
.pi-nazev { font-size: 0.875rem; font-weight: 700; color: var(--tk-text-2); line-height: 1.6; padding-top: 0.1rem; }
.pi-text { font-size: 1rem; line-height: 1.6; }
.pi-radek--pozor .pi-nazev { color: var(--tk-akcent); }
.pi-aktualnost { font-size: 0.8125rem; color: var(--tk-text-2); padding-top: 0.9rem !important; border-top: 1px solid var(--tk-linka); }

/* Patička článku */
.stitky a { display: inline-block; padding: 0.45rem 0.8rem; border: 1px solid var(--tk-linka); border-radius: 999px; font-weight: 400; margin: 0 0.4rem 0.4rem 0; }
.stitky .wp-block-post-terms__separator { display: none; }
.autor { background: var(--tk-plocha); border-radius: 6px; padding: 2rem !important; gap: 1.5rem !important; align-items: flex-start !important; }
.autor__foto { flex: 0 0 88px; width: 88px; margin: 0 !important; }
.autor__foto img { width: 88px; height: 88px; border-radius: 50%; object-fit: cover; display: block; }
.autor__text > * { margin: 0 !important; }
.autor__jmeno { font-family: var(--wp--preset--font-family--serif); font-size: 1.375rem; font-weight: 650; line-height: 1.2; }
.autor__bio { color: var(--tk-text-2); font-size: 0.9375rem; line-height: 1.6; margin-top: 0.5rem !important; }
.predchozi-dalsi { border-block: 1px solid var(--tk-linka); padding-block: 1.75rem !important; margin-top: var(--wp--preset--spacing--60) !important; }
.predchozi-dalsi .post-navigation-link-previous, .predchozi-dalsi .post-navigation-link-next { font-family: var(--wp--preset--font-family--serif); font-size: 1.375rem; font-weight: 650; max-width: 48%; }
.predchozi-dalsi a { color: var(--tk-text); text-decoration: none; }
.predchozi-dalsi a:hover { color: var(--tk-akcent); }
.souvisejici-sekce { margin-top: var(--wp--preset--spacing--60) !important; margin-bottom: var(--wp--preset--spacing--60) !important; }
.souvisejici-sekce .wp-block-post-template { gap: 1.75rem; }
.souvisejici-sekce .wp-block-post-title { font-size: 1.375rem; }

/* ---------- Patička ---------- */
.site-footer { background: var(--wp--preset--color--bor); color: var(--tk-papir); padding-block: var(--wp--preset--spacing--50) !important; margin-block-start: var(--wp--preset--spacing--60) !important; }
.site-footer a, .site-footer .wp-block-site-title a { color: var(--tk-papir) !important; }
.site-footer .footer-copy { color: #cfc6b5; font-size: 0.875rem; margin: 0; }
/* Sloupec sidebaru má barvu až dolů k patičce, i když samotný sidebar je jen na výšku okna */
@media (min-width: 1024px) {
	.s-sidebarem {
		background: linear-gradient(to right,
			var(--tk-plocha) 0 var(--tk-sidebar),
			var(--tk-linka) var(--tk-sidebar) calc(var(--tk-sidebar) + 1px),
			transparent calc(var(--tk-sidebar) + 1px));
	}
	.s-sidebarem > .sidebar { border-right: 0; background: transparent; }
}
.s-sidebarem + .wp-block-template-part,
.s-sidebarem + .wp-block-template-part .site-footer { margin-block-start: 0 !important; }
/* Sidebar se dál posouvá kolečkem, jen bez viditelného posuvníku */
.s-sidebarem > .sidebar { scrollbar-width: none; }
.s-sidebarem > .sidebar::-webkit-scrollbar { display: none; }

/* ---------- Přístupnost ---------- */
:where(a, button, input):focus-visible { outline: 2px solid var(--tk-akcent); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; } }
