/* ==== css/00-konvence.css ==== */
/*!
Theme Name: Nihilominus
Theme URI: https://nihilominus.cz/
Author: Tomáš Roud
Author URI: https://roud.cz/
Description: Vlastní téma pro nihilominus.cz postavené na Underscores (_s). Nahradilo Astru 4.8.3. Vzhled je převzatý měřením vypočtených stylů živé Astry, ne portem celého jejího CSS.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 7.1
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: nihilominus
Tags: custom-logo, custom-menu, translation-ready
*/

/*
 * POZOR: style.css je VÝSLEDEK BUILDU. Needituje se.
 * Zdroj je css/, sestavuje `php8.5 build-css.php`, pořadí drží inc/css-zdroje.php.
 *
 * Konvence (stejné jako u lecba-tmou.cz a kazdejzasebe.cz):
 *   1. Každý blok začíná komentářem: PROČ existuje a na JAKÝ markup míří.
 *   2. !important jen s napsaným důvodem na témže místě. Bez důvodu se maže.
 *   3. Pravidlo pro markup, který téma nevykresluje, se nepíše.
 *      Když třídu přidává až JS, uvést to v komentáři — jinak to vypadá mrtvě.
 *   4. Žádný mrtvý ani duplicitní kód.
 *
 * Číslo v názvu souboru určuje kaskádu. Nový soubor se musí zapsat
 * do inc/css-zdroje.php, jinak se do buildu nedostane.
 */

/*
 * Návrhové tokeny.
 * Hodnoty jsou ODEČTENÉ z živé Astry 4.8.3 přes getComputedStyle, ne odhadnuté.
 * V závorce je původní jméno proměnné Astry, ať se to dá dohledat.
 */
:root {
	--barva-textu: #334155;          /* --ast-global-color-3, běžný text */
	--barva-nadpisu: #1e293b;        /* --ast-global-color-2, h1–h6 i .page-title */
	--barva-nazvu: #222222;          /* .site-title a — Astra ho má jinak než text */
	--barva-odkaz: #046bd2;          /* --ast-global-color-0 */
	--barva-odkaz-aktivni: #045cb4;  /* --ast-global-color-1, :hover i :focus */
	--barva-zvyrazneni: #f0f5fa;     /* --ast-global-color-4, podklad položky menu */
	--barva-pozadi: #ffffff;         /* --ast-global-color-5 */
	--barva-linky: #eaeaea;          /* linka pod hlavičkou a nad patičkou */

	--pismo: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans,
		Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	--radek-zaklad: 1.65;

	--sirka-obsahu: 1200px;          /* --wp--custom--ast-content-width-size */
	--sirka-kontejneru: 1240px;      /* .ast-container nad 921 px */
	--odsazeni-kontejneru: 20px;
}

/*
 * Zděděné proměnné.
 * Obsah stránky má v inline stylu var(--wp--preset--spacing--80). Definuje ji
 * global-styles, které inc/uklid.php z frontendu odhlašuje — bez téhle skupiny
 * by se odstavec tiše přilepil k hornímu okraji. Celá škála je tu proto, že
 * editor bloků nabízí všech sedm hodnot a Tomáš tu stránku edituje.
 */
:root {
	--wp--preset--spacing--20: 0.44rem;
	--wp--preset--spacing--30: 0.67rem;
	--wp--preset--spacing--40: 1rem;
	--wp--preset--spacing--50: 1.5rem;
	--wp--preset--spacing--60: 2.25rem;
	--wp--preset--spacing--70: 3.38rem;
	--wp--preset--spacing--80: 5.06rem;
}

/* ==== css/10-generic.css ==== */
/*
 * Reset.
 * Výběr z normalize a resetu Astry — jen pravidla, která na markupu tohohle
 * tématu opravdu něco dělají. Ověřeno tak, že se v živé Astře prošla všechna
 * pravidla a nechala se ta, jejichž selektor na stránce matchuje.
 */

html {
	box-sizing: border-box;
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

*,
::before,
::after {
	box-sizing: inherit;
}

/* Astra nuluje margin/padding/font hromadně na blokových značkách. */
address,
blockquote,
body,
dd,
dl,
dt,
fieldset,
figure,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
html,
iframe,
legend,
li,
ol,
p,
pre,
textarea,
ul {
	border: 0;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}

body {
	margin: 0;
	padding: 0;
	/* Astra: body:not(.logged-in){position:relative} — drží stejný obsahující
	   blok pro absolutně umístěné potomky. */
	position: relative;
	overflow-x: hidden;
	-webkit-font-smoothing: antialiased;
}

main,
nav {
	display: block;
}

a {
	background-color: transparent;
}

a:active {
	outline: 0;
}

b,
strong {
	font-weight: 700;
}

img {
	border: 0;
	height: auto;
	max-width: 100%;
	vertical-align: middle;
}

svg:not(:root) {
	overflow: hidden;
}

figure {
	margin: 0;
}

button,
input,
optgroup,
select,
textarea {
	color: inherit;
	font: inherit;
	margin: 0;
}

button {
	overflow: visible;
}

button,
select {
	text-transform: none;
}

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	-webkit-appearance: button;
	appearance: button;
	cursor: pointer;
}

button,
input {
	line-height: normal;
}

/* ==== css/20-zaklad.css ==== */
/*
 * Typografie a základní prvky.
 * Hodnoty odečtené z Astry: základ 16 px / 1.65, pod 921 px zmenšuje kořenové
 * písmo na 91.2 % (tj. 14.592 px). Všechno v rem se tím zmenší zároveň.
 */

html {
	font-size: 100%;
}

@media (max-width: 921px) {

	html {
		font-size: 91.2%;
	}
}

body,
button,
input,
select,
textarea {
	font-family: var(--pismo);
	font-size: 1rem;
	font-weight: 400;
	line-height: var(--radek-zaklad);
	color: var(--barva-textu);
}

body {
	background-color: var(--barva-pozadi);
	font-style: normal;
}

/*
 * Nadpisy. Astra jim dává jinou barvu než běžnému textu (--ast-global-color-2
 * proti --ast-global-color-3) a váhu 600 místo výchozích 700. Na titulní straně
 * to není vidět, protože tam žádný nadpis není — projeví se to na detailu
 * příspěvku a na stránce 404.
 */
h1,
h2,
h3,
h4,
h5,
h6 {
	color: var(--barva-nadpisu);
	font-weight: 600;
}

h1 {
	font-size: 2.25rem;
	line-height: 1.4em;
}

h2 {
	font-size: 1.875rem;
	line-height: 1.3em;
}

h3 {
	font-size: 1.5rem;
	line-height: 1.3em;
}

h4 {
	font-size: 1.25rem;
	line-height: 1.2em;
}

h5 {
	font-size: 1.125rem;
	line-height: 1.2em;
}

h6 {
	font-size: 1rem;
	line-height: 1.25em;
}

/*
 * Pod 921 px Astra nadpisy dodatečně zmenšuje v px (nezávisle na kořenovém
 * písmu), takže h1 vyjde 30 px místo 32.8 a h2 25 px místo 27.4.
 */
@media (max-width: 921px) {

	h1 {
		font-size: 30px;
	}

	h2 {
		font-size: 25px;
	}

	h3 {
		font-size: 20px;
	}
}

p {
	margin-bottom: 1.75em;
}

/*
 * Odkazy.
 * :visited je tu schválně u každého pravidla, které nastavuje barvu odkazu —
 * getComputedStyle na navštívených odkazech lže (hlásí nenavštívený styl),
 * takže chybějící :visited se měřením nedá najít.
 */
a,
a:visited {
	color: var(--barva-odkaz);
	text-decoration: none;
	transition: 0.2s linear;
}

a:hover,
a:focus {
	color: var(--barva-odkaz-aktivni);
}

a:focus {
	outline: thin dotted;
}

a:hover {
	outline: 0;
}

/* Seznamy mimo obsah stránky. V .entry-content je přebíjí 50-obsah.css. */
ol,
ul {
	box-sizing: border-box;
	margin: 0 0 1.5em 3em;
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

/*
 * Tlačítka a formulářové prvky.
 * Na webu je jediný formulář — vyhledávací na search.php a 404.php.
 * Tlačítko mobilního menu si vzhled přebíjí v 40-navigace.css.
 */
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	border: 0 solid var(--barva-odkaz);
	border-radius: 4px;
	box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
	background-color: var(--barva-odkaz);
	color: #fff;
	font-family: inherit;
	font-size: 1rem;
	font-weight: 500;
	line-height: 1em;
	padding: 15px 30px;
}

button:hover,
button:focus,
input[type="button"]:hover,
input[type="button"]:focus,
input[type="reset"]:hover,
input[type="reset"]:focus,
input[type="submit"]:hover,
input[type="submit"]:focus {
	background-color: var(--barva-odkaz-aktivni);
	border-color: var(--barva-odkaz-aktivni);
	color: #fff;
}

@media (max-width: 921px) {

	button,
	input[type="button"],
	input[type="reset"],
	input[type="submit"] {
		padding: 14px 28px;
	}
}

@media (max-width: 544px) {

	button,
	input[type="button"],
	input[type="reset"],
	input[type="submit"] {
		padding: 12px 24px;
	}
}

/*
 * Textová pole. Hodnoty jsou Astřiny — pevná výška 40 px s border-box, písmo
 * 16 px (ne 1rem: pod 921 px je kořenové písmo 91.2 % a pole se nesmí zmenšit,
 * jinak iOS při zaostření zvětší celou stránku).
 */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
textarea {
	background: #fff;
	border: 1px solid #d1d5db;
	border-radius: 4px;
	box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
	box-sizing: border-box;
	color: #475569;
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
	padding: 12px 16px;
	vertical-align: baseline;
	width: 100%;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"] {
	height: 40px;
}

input:focus,
textarea:focus {
	border-color: var(--barva-odkaz);
	box-shadow: none;
	outline: none;
}

/* ==== css/30-layout.css ==== */
/*
 * Rozvržení stránky.
 * Astra drží patičku dole přes flex sloupec na #page a flex-grow na obsahu.
 */
#page {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	position: relative;
}

#page .site-content {
	flex-grow: 1;
}

/*
 * Kontejner. Do 921 px je na plnou šířku s odsazením 20 px, nad ním se
 * zastropuje na 1240 px a vystředí — vnitřní obsah tedy vyjde na 1200 px.
 */
.kontejner {
	margin-left: auto;
	margin-right: auto;
	max-width: 100%;
	padding-left: var(--odsazeni-kontejneru);
	padding-right: var(--odsazeni-kontejneru);
}

@media (min-width: 922px) {

	.kontejner {
		max-width: var(--sirka-kontejneru);
	}
}

#primary {
	width: 100%;
}

/*
 * Kontejner obsahu je nad 921 px flex. Není to kvůli rozvržení (uvnitř je
 * jediný sloupec), ale kvůli marginům: flex kontejner nepropouští svislý
 * margin prvního bloku ven, takže box kontejneru začíná na y = 0 a ne až
 * pod odsazením prvního odstavce.
 */
@media (min-width: 922px) {

	.site-content .kontejner {
		display: flex;
	}
}

/* ==== css/40-navigace.css ==== */
/*
 * Hlavička.
 *
 * Astra tu má zapnutou průhlednou hlavičku: #masthead je position:absolute,
 * nemá pozadí ani spodní linku a obsah stránky pod ní podtéká. Není to omyl
 * v našem CSS — je to změřený stav živého webu (body měl třídu
 * ast-theme-transparent-header) a vzhled se držet musí.
 *
 * Menu je jen jedno a jen pro mobil: v Astře byla pozice `primary` prázdná,
 * takže nad 921 px se v hlavičce žádné menu nezobrazovalo. Proto tu není
 * vodorovná varianta menu — jen tlačítko a rozbalovací seznam do 921 px.
 */
#masthead {
	position: absolute;
	left: 0;
	right: 0;
	z-index: 99;
}

.hlavicka-pruh {
	background: none;
	/* Šířka je nula (průhledná hlavička), barva se drží kvůli
	   .samostatny-obsah, kde se linka zapíná. */
	border-bottom: 0 solid var(--barva-linky);
	position: relative;
	z-index: 4;
}

.hlavicka-radek {
	align-items: center;
	display: flex;
	justify-content: space-between;
	column-gap: 20px;
	min-height: 80px;
}

/* Logo a název vedle sebe. Odsazení 1em nahoře i dole dělá výšku hlavičky 92 px. */
.site-branding {
	align-items: center;
	align-self: center;
	display: inline-flex;
	line-height: 1;
	padding: 1em 0;
	transition: 0.2s linear;
}

.site-logo-img {
	padding-right: 1em;
}

.site-logo-img img {
	transition: 0.2s linear;
}

.custom-logo {
	max-width: 60px;
	width: 60px;
}

.site-title {
	display: block;
	font-size: 1.625rem;
	font-weight: 600;
	margin-bottom: 0;
}

.site-title a,
.site-title a:visited {
	color: var(--barva-nazvu);
	line-height: 1.2;
	transition: 0.2s linear;
}

.site-title a:hover,
.site-title a:focus {
	color: var(--barva-nazvu);
}

/*
 * Tlačítko menu.
 * Rozměr 41.9 x 41.9 px na mobilu vychází z ikony 20x20 a odsazení 0.5em
 * při písmu 1.5em. Barvu i pozadí si bere z Astry (modrá na průhledném).
 */
.menu-toggle {
	align-items: center;
	background: transparent;
	border: 0;
	border-radius: 2px;
	box-shadow: none;
	color: var(--barva-odkaz);
	display: flex;
	font-size: 1.5em;
	/* 400, ne 500 — obecné pravidlo pro <button> ve 20-zaklad.css tučnost přidává. */
	font-weight: 400;
	line-height: 1.85714;
	padding: 0.5em;
	width: auto;
	height: auto;
}

.menu-toggle:hover,
.menu-toggle:focus {
	background: transparent;
	color: var(--barva-odkaz);
}

.menu-toggle:focus {
	outline: thin dotted;
}

.menu-toggle .ikona {
	display: block;
	fill: currentColor;
	height: 20px;
	width: 20px;
}

/* Křížek se ukáže až po otevření — třídu .otevreno přepíná js/site.js. */
.menu-toggle .ikona-zavrit,
.menu-toggle.otevreno .ikona-menu {
	display: none;
}

.menu-toggle.otevreno .ikona-zavrit {
	display: block;
}

/* Nad 921 px v Astře žádné menu ani tlačítko není. */
@media (min-width: 922px) {

	.menu-toggle,
	.hlavni-navigace {
		display: none;
	}
}

/*
 * Rozbalovací menu.
 * Zavřené je display:none; otevřené přidává js/site.js třídu .otevreno.
 */
.hlavni-navigace {
	background-color: var(--barva-pozadi);
	display: none;
}

.hlavni-navigace.otevreno {
	display: block;
}

.hlavni-navigace ul {
	display: flex;
	flex-direction: column;
	list-style: none;
	margin: 0;
	padding: 0;
	text-align: left;
}

.hlavni-navigace li {
	display: flex;
	position: relative;
}

.hlavni-navigace li > a {
	color: var(--barva-textu);
	display: block;
	line-height: 3em;
	padding: 0 20px;
	transition: 0.2s linear;
	width: 100%;
}

.hlavni-navigace li > a:visited {
	color: var(--barva-textu);
}

.hlavni-navigace li:hover > a,
.hlavni-navigace li > a:focus,
.hlavni-navigace .current-menu-item > a,
.hlavni-navigace .current-menu-item > a:visited,
.hlavni-navigace .current-menu-ancestor > a {
	background: var(--barva-zvyrazneni);
	color: var(--barva-odkaz-aktivni);
}

/* ==== css/50-obsah.css ==== */
/*
 * Obsah stránky a příspěvku.
 */

.entry-header {
	margin-bottom: 1.2em;
	overflow-wrap: break-word;
}

.page .entry-header {
	margin-bottom: 1.5em;
}

.single .entry-header {
	margin-bottom: 2em;
}

/*
 * Titulní stránka nemá nadpis ani náhledový obrázek — hlavička článku je tedy
 * prázdná a nesmí za sebou nechat mezeru. Šablona jí v tom případě dá
 * .bez-obsahu (v Astře to byla dvojice ast-no-title ast-no-thumbnail).
 */
.entry-header.bez-obsahu {
	margin-bottom: 0;
}

header.entry-header > *:not(:last-child) {
	margin-bottom: 15px;
}

/* Pod 768 px Astra hlavičku článku stahuje na 1em. */
@media (max-width: 768px) {

	.single .entry-header {
		margin-bottom: 1em;
	}
}

header.entry-header .entry-title {
	font-size: 2rem;
	font-weight: 600;
	line-height: 1.2;
}

header.entry-header .entry-meta,
header.entry-header .entry-meta * {
	font-size: 0.8125rem;
}

.entry-meta,
.entry-meta * {
	color: var(--barva-odkaz);
	font-weight: 600;
	line-height: 1.45;
}

.entry-meta a:hover,
.entry-meta a:hover *,
.entry-meta a:focus,
.entry-meta a:focus * {
	color: var(--barva-odkaz-aktivni);
}

.entry-content {
	overflow-wrap: break-word;
}

.entry-content::after {
	clear: both;
	content: "";
	display: table;
}

/* Šířka obsahu se zastropuje a bloky se vystředí. */
.entry-content > * {
	max-width: var(--sirka-obsahu);
	margin-left: auto;
	margin-right: auto;
}

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

.entry-content p {
	margin-bottom: 1.6em;
}

/*
 * Nadpisy v obsahu. V Astře to pravidlo bylo taky, jen na webu nematchovalo —
 * do 28. 8. 2026 tu žádný nadpis nebyl. Přidaný H1 na titulní straně a všechny
 * budoucí nadpisy se tím chovají stejně jako předtím.
 */
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
	margin-bottom: 20px;
}

.entry-content > figure {
	margin-bottom: 1em;
}

/*
 * Seznamy v obsahu.
 * Svislé mezery se píšou po jedné vlastnosti, ne zkratkou `margin` — zkratka
 * by shodila `margin-left/right: auto` z pravidla o řádek výš a seznam by
 * přestal být vystředěný (past č. 3 z příručky lecba-tmou).
 */
.entry-content ul,
.entry-content ol {
	margin-top: 1em;
	margin-bottom: 1em;
	padding-left: 20px;
}

/* Na detailu příspěvku a stránky Astra odkazy v textu podtrhává (třída ast-single-post byla
 * na stránce i na příspěvku, tedy všude, kde .entry-content vůbec je). */
.entry-content a {
	text-decoration: underline;
}

/*
 * Bloky.
 * Jsou tu jen ta pravidla z wp-block-library / wp-block-image, která na
 * obsahu webu opravdu matchují — zbytek jádrového blokového CSS se
 * na frontendu odhlašuje v inc/uklid.php.
 */
:where(figure) {
	margin: 0 0 1em;
}

.wp-block-image img {
	box-sizing: border-box;
	height: auto;
	max-width: 100%;
	vertical-align: bottom;
}

/*
 * Vycentrovaný obrázek.
 * V jádře to dělá wp-block-image CSS, které se na frontendu odhlašuje.
 *
 * Selektor musí být ve dvou tvarech a není to nedbalost. WordPress u
 * ZAROVNANÉHO obrázku obalí figure ještě divem a přesune na něj třídy bloku:
 *
 *   <div class="wp-block-image is-style-rounded">
 *     <figure class="aligncenter size-medium"><img …></figure>
 *   </div>
 *
 * U nezarovnaného jsou obě třídy na jednom <figure>. Jádro má proto taky obě
 * varianty; se samotným `.wp-block-image.aligncenter` by se vycentroval jen
 * ten druhý případ.
 *
 * `display: table` nechá figure zúžit na šířku obrázku — bez toho je blok
 * široký jako celý sloupec a obrázek sedí vlevo, i když má margin auto.
 * Pravidlo pro figcaption není do zásoby: je to nutný doplněk `display: table`,
 * bez kterého by se tabulka roztáhla na šířku popisku místo na šířku obrázku.
 */
.wp-block-image .aligncenter,
.wp-block-image.aligncenter {
	display: table;
	margin-left: auto;
	margin-right: auto;
}

.wp-block-image .aligncenter > figcaption,
.wp-block-image.aligncenter > figcaption {
	caption-side: bottom;
	display: table-caption;
}

/*
 * Zaoblený styl obrázku.
 * Jádro (a po něm i Astra) mu dává border-radius 9999px, což ze 4:3 fotky
 * udělá elipsu a ořízne všechno u krajů. Na Tomášovo přání jen 20 px —
 * fotka zůstane celá, rohy se jen zaoblí. Stejná hodnota jde i do editoru,
 * protože 50-obsah.css je ve whitelistu pro editor-style.css.
 */
.wp-block-image.is-style-rounded img {
	border-radius: 20px;
}

html :where(img[class*="wp-image-"]) {
	height: auto;
	max-width: 100%;
}

/* ==== css/60-komponenty/10-paticka.css ==== */
/*
 * Patička.
 * Jeden vystředěný řádek s copyrightem. Rozměry z Astry: linka nahoře 1 px,
 * odsazení 20 px nahoře i dole a vnitřní řádek s min-height 60 px — dohromady
 * 101 px vysoká patička na všech šířkách.
 */
.paticka-pruh {
	align-content: center;
	background-color: var(--barva-pozadi);
	border-top: 1px solid var(--barva-linky);
	display: grid;
	padding-top: 20px;
	padding-bottom: 20px;
}

/*
 * Řádek se vystřeďuje sám, bez vodorovného odsazení — copyright je proto
 * na 1265 px široký přesně 1200 px a začíná na x = 32.5.
 */
.paticka-radek {
	align-items: center;
	display: grid;
	grid-template-columns: 1fr;
	margin-left: auto;
	margin-right: auto;
	max-width: var(--sirka-obsahu);
	min-height: 60px;
	width: 100%;
}

.paticka-copyright {
	color: var(--barva-textu);
	align-items: center;
	display: flex;
	font-size: 1rem;
	text-align: center;
	width: 100%;
}

.paticka-copyright p {
	margin-bottom: 0;
	width: 100%;
}

/*
 * Do 921 px Astra položku patičky „stohuje“ a nechává jí spodní mezeru 10 px.
 * Text tím vyjde o 5 px výš než uprostřed. Není to překlep, je to změřený stav.
 */
@media (max-width: 921px) {

	.paticka-copyright {
		margin-bottom: 10px;
	}
}

/* ==== css/60-komponenty/20-nahoru.css ==== */
/*
 * Tlačítko „nahoru“.
 * Ve výchozím stavu je schované; js/site.js mu nastaví display:block, jakmile
 * se odroluje víc než 300 px. Stejnou hranici používá i Astra — a to i přesto,
 * že se v jejím kódu tváří, že počítá s výškou hlavičky: `masthead.length` je
 * u jednoho elementu undefined, takže větev s hlavičkou nikdy neplatí.
 */
#nahoru {
	background-color: var(--barva-odkaz);
	border: 0;
	box-shadow: none;
	border-radius: 2px;
	bottom: 30px;
	color: #fff;
	cursor: pointer;
	display: none;
	font-size: 15px;
	font-weight: 400;
	height: 2.1em;
	line-height: 2.1;
	padding: 0;
	position: fixed;
	right: 30px;
	text-align: center;
	width: 2.1em;
	z-index: 99;
}

#nahoru:hover,
#nahoru:focus {
	background-color: var(--barva-odkaz);
	color: #fff;
}

#nahoru:focus {
	border-style: dotted;
	border-color: inherit;
	border-width: thin;
}

#nahoru .ikona {
	fill: currentColor;
	height: 0.6em;
	transform: translate(0, -20%) rotate(180deg);
	vertical-align: middle;
	width: 1.6em;
}

@media (max-width: 921px) {

	#nahoru .ikona {
		width: 1em;
	}
}

/* ==== css/70-sablony/10-samostatny-obsah.css ==== */
/*
 * Samostatný obsah — šedé pozadí a bílá karta.
 *
 * Astra má dvě různá rozvržení a používá je podle typu stránky:
 *   • titulní stránka  = „plain container“ — bílé pozadí, obsah na plnou šířku,
 *     průhledná hlavička nad obsahem (řeší 30-layout.css a 40-navigace.css);
 *   • příspěvek, 404 a hledání = „separate container“ — šedé pozadí, obsah
 *     v bílé kartě a normální hlavička v toku.
 *
 * Tenhle soubor popisuje to druhé. Třídy na <body> dává inc/nastaveni.php.
 */
body.samostatny-obsah {
	background-color: var(--barva-zvyrazneni);
}

/* V samostatném rozvržení hlavička nepodtéká obsah — stojí v toku a má pozadí. */
.samostatny-obsah #masthead {
	position: relative;
}

.samostatny-obsah .hlavicka-pruh {
	background-color: var(--barva-pozadi);
}

@media (min-width: 922px) {

	.samostatny-obsah .hlavicka-pruh {
		border-bottom: 1px solid var(--barva-linky);
	}
}

.samostatny-obsah #primary {
	margin: 4em 0;
}

/*
 * Pod 921 px se svislá mezera přesouvá z marginu do paddingu (v plain
 * kontejneru je nulová, tady ne) a pod 544 px se zúží vodorovné odsazení.
 */
@media (max-width: 921px) {

	.samostatny-obsah #primary {
		margin: 0;
		padding: 1.5em 0;
	}
}

@media (max-width: 544px) {

	.samostatny-obsah #content .kontejner {
		padding-left: 0.54em;
		padding-right: 0.54em;
	}
}

/* Detail příspěvku má užší kontejner — 750 px místo 1240 px. */
@media (min-width: 922px) {

	.uzky-obsah .kontejner {
		max-width: 750px;
	}
}

/* A tomu odpovídající strop šířky bloků uvnitř obsahu. */
.uzky-obsah .entry-content > * {
	max-width: 750px;
}

/*
 * Bílá karta.
 * Odsazení je změřené z Astry na pěti šířkách; nejsou to kulaté hodnoty,
 * protože si je Astra mění na třech prazích nezávisle na kořenovém písmu.
 */
.karta {
	background-color: var(--barva-pozadi);
	padding: 2.5em;
}

@media (max-width: 544px) {

	.karta {
		padding: 1.5em 1em;
	}
}

/* ==== css/70-sablony/20-chyba-a-hledani.css ==== */
/*
 * Stránka 404 a výsledky hledání.
 * Obojí je v Astře stejná bílá karta na šedém pozadí, jen s jiným odsazením
 * než karta příspěvku — proto vlastní třída .karta-hlaseni.
 */
.karta-hlaseni {
	background-color: var(--barva-pozadi);
	margin: 0;
	padding: 3em;
	text-align: center;
}

@media (max-width: 1200px) {

	.karta-hlaseni {
		padding: 3.34em 2.4em;
	}
}

@media (max-width: 768px) {

	.karta-hlaseni {
		padding: 1.5em 2.14em;
	}
}

@media (max-width: 544px) {

	.karta-hlaseni {
		padding: 1.5em 1em;
	}
}

.karta-hlaseni .page-header {
	margin-bottom: 1.5em;
	text-align: center;
}

.karta-hlaseni .page-title {
	font-weight: 400;
	margin-bottom: 0;
}

.karta-hlaseni .page-sub-title {
	font-size: 1.5rem;
	font-weight: inherit;
	line-height: 1.3em;
	margin-bottom: 0;
}

/*
 * Vyhledávací pole.
 * Šířku 370 px a odsazení 12/45/12/15 má Astra i na mobilu — pole se
 * nezmenšuje, jen se do dostupné šířky vejde přes max-width.
 */
.karta-hlaseni .vyhledavani {
	margin: 1.5em auto 0;
	max-width: 370px;
	padding-top: 0.5em;
}

.vyhledavani-formular {
	position: relative;
}

/*
 * Selektor je `input.vyhledavani-pole`, ne jen `.vyhledavani-pole`: obecné
 * pravidlo ve 20-zaklad.css míří na input[type="search"], což je stejně
 * specifické jako holá třída — a pak by rozhodovalo pořadí ve prospěch
 * toho obecného. Se značkou navíc vyhrává tohle.
 */
input.vyhledavani-pole {
	background: #fafafa;
	border-radius: 2px;
	box-shadow: none;
	padding: 12px 45px 12px 15px;
}

input.vyhledavani-pole:focus {
	outline: 0;
}

.vyhledavani-odeslat {
	background: 0 0;
	border: none;
	border-radius: 2px;
	box-shadow: none;
	color: #3a3a3a;
	cursor: pointer;
	padding: 13px 20px;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 2;
}

.vyhledavani-odeslat:hover,
.vyhledavani-odeslat:focus {
	background: 0 0;
	color: var(--barva-odkaz-aktivni);
}

.vyhledavani-odeslat .ikona {
	display: block;
	fill: currentColor;
	height: 15px;
	width: 15px;
}

/* ==== css/90-pristupnost.css ==== */
/*
 * Přístupnost.
 *
 * .screen-reader-text schovává text jen pro čtečky. Výsledná podoba je průnik
 * dvou pravidel, která se na živé Astře skládala: jedno z tématu, druhé
 * z jádrového wp-block-library (to bylo v pořadí později, takže u společných
 * vlastností vyhrávalo). Jádrové CSS se na frontendu odhlašuje, proto je
 * tady vypsaný rovnou ten výsledek.
 */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	/* !important: přebíjí zděděné lámání slov, jinak by se výška 1px protáhla. */
	overflow-wrap: normal !important;
	word-break: normal !important;
}

.screen-reader-text:focus {
	background-color: #ddd;
	border-radius: 2px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	color: #444;
	display: block;
	font-size: 1em;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
	/* !important: přebíjí clip z pravidla výš, které je stejně specifické. */
	clip: auto !important;
	clip-path: none;
}

/*
 * Odkaz „Přeskočit na obsah“ nemá vlastní pravidlo — je to .screen-reader-text
 * jako v Astře, takže se ukáže až při zaostření a vypadá stejně.
 */