/*
 * Styly pro prvky, které návrh nemá: notifikace WooCommerce, chybové hlášky polí
 * pokladny, admin bar, .screen-reader-text. Žádný selektor návrhu se tu nepřepisuje
 * (architektura 4.1 bod 5).
 */

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

/* Hlášky WooCommerce (chyba / zpráva / info) ve vzhledu webu: karta jako .co-block z návrhu 06
   (tmavé pozadí --umbra-850, jemný rámeček, zaoblení), levý pruh v barvě významu, text --paper.
   Obal .woocommerce-NoticeGroup nemá vlastní vzhled, jen drží odstup. Návrh souhrnný box nemá —
   je to záchytná vrstva pro serverové chyby (vypnuté JS, neplatné PSČ); běžně chyby zachytí
   kontrola v prohlížeči (pokladna.js) a označí pole .has-error. */
.woocommerce-NoticeGroup {
	margin: 0 0 24px;
}

.woocommerce-error,
.woocommerce-message,
.woocommerce-info {
	background: var(--umbra-850, #211b15);
	color: var(--paper, #f8f3ea);
	border: 1px solid rgba(241, 234, 217, 0.08);
	border-left: 4px solid var(--okr, #e3ba76);
	padding: 16px 22px;
	margin: 0 0 24px;
	border-radius: 14px;
	list-style: none;
	font-family: "Inter", Arial, sans-serif;
	font-size: 14.5px;
	line-height: 1.55;
}

.woocommerce-NoticeGroup .woocommerce-error,
.woocommerce-NoticeGroup .woocommerce-message,
.woocommerce-NoticeGroup .woocommerce-info {
	margin-bottom: 0;
}

.woocommerce-error {
	border-left-color: var(--err, #d16a5a);
}

.woocommerce-message {
	border-left-color: var(--oliva, #b8be7f);
}

.woocommerce-error li + li {
	margin-top: 4px;
}

.woocommerce-error strong {
	font-weight: 600;
}

/* Hláška chyby pokladny nese odkaz na pole (<a href="#billing_postcode">) — v kartě se čte jako
   obyčejná věta, ne jako oranžový podtržený odkaz. Odkazy v message/info (např. „Zobrazit košík“)
   zůstávají v barvě webu. */
.woocommerce-error a {
	color: inherit;
	text-decoration: none;
}

.woocommerce-message a,
.woocommerce-info a {
	color: var(--okr, #e3ba76);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.woocommerce-message .button,
.woocommerce-info .button {
	float: right;
	margin-left: 16px;
	background: none;
	border: 1.5px solid var(--okr-dim, #c89f5c);
	color: var(--okr, #e3ba76);
	border-radius: 10px;
	padding: 6px 14px;
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
}

.woocommerce-error li[data-id] {
	cursor: pointer;
}

@media (max-width: 760px) {
	.woocommerce-error,
	.woocommerce-message,
	.woocommerce-info {
		padding: 14px 16px;
	}
}

.woocommerce form .form-row.woocommerce-invalid label {
	color: #a33;
}

.woocommerce form .form-row .woocommerce-input-wrapper .description,
.woocommerce form .form-row .woocommerce-invalid-message {
	color: #a33;
	font-size: 13px;
	margin-top: 4px;
	display: block;
}

/* form-checkout.php obaluje .co-grid do <form class="checkout">, co návrh nemá (tam je
   .co-grid přímo v .co-page) — UA výchozí styl <form> dává margin-bottom ~16px (1em),
   který v návrhu neexistuje a posouval patu o 16 px níž (živý nález kroku 7, výška
   pokladny proti návrhu). Selektor návrhu (.co-grid/.co-page) se nepřepisuje, jen se
   ruší marže technického obalu, co návrh nezná. */
form.checkout {
	margin: 0;
}

/* WooCommerce core (checkout.js: init_payment_methods) skrývá radio platby přes inline
   style="display:none", když je dostupná jen jedna platební metoda — to návrh nezná, ten
   kroužek radia u platby vždy ukazuje (stejně jako u dopravy, viz 06-kosik.css selektor
   ".co-option input"). Bez tohoto byl sloupec popisku v #coPlatba širší, než má návrh,
   text se zalomil o řádek méně a výška na 390px nesedela (živý nález kroku 7, -19px).
   Nepřepisuje se vzhled z návrhu (width/height/accent-color), jen se ruší WC inline
   display:none, který návrh nemůže znát. */
.co-option input[name="payment_method"] {
	display: inline-block !important;
}

/* Krok 11: textové stránky (O mně, Focení…) ve vzhledu článku 04 mají v obsahu importovaném
   ze živého webu odkazy UVNITŘ odstavce (facebook, blog, e-mail) — design 04 odkazy
   uprostřed souvislého textu nemá (žádný .art-body selektor v 04-clanek.css), jen globální
   reset "a{color:inherit;text-decoration:none}", takže by byly vizuálně neodlišitelné od
   okolního textu. Nejde o redesign — jen podtržení, ať je odkaz uvnitř věty vidět; barva a
   velikost písma zůstávají z návrhu beze změny. */
.art-body a,
.lencis-kontakt-udaje a {
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Převod článků: dlouhé holé adresy ve zdrojích (např. Mokřady, sekce Zdroje) na úzkém displeji
   přetékaly mimo sloupec (vodorovný posun stránky na 390 px). Jen zalomení slova, vzhled beze změny. */
.art-body p,
.art-body li,
.art-body figcaption {
	overflow-wrap: anywhere;
}

/* Mezititulky úrovně 3 a seznamy v článku — mimo návrh, odvozeno z .art-body h2/p.
   Návrh 04 je nemá (jen h2 a p); starý web je ale používá (Azory: 17× h3, série článků: číslovaný seznam).
   h3 = stejné písmo/barva jako h2, o stupeň menší; seznam = velikost, řádek a barva odstavce.
   04-clanek.css se nemění (je 1:1 z návrhu). */
.art-body h3 {
	font-size: 20px;
	line-height: 1.3;
	color: var(--ink);
	margin-top: 40px;
	margin-bottom: 14px;
}
.art-body h3:first-child {
	margin-top: 0;
}
.art-body ul,
.art-body ol {
	margin: 0 0 23px;
	font-size: 19px;
	padding-left: 1.2em;
}
.art-body li {
	font-size: 19px;
	line-height: 1.65;
	color: var(--ink);
	margin-bottom: 8px;
}
.art-body li:last-child {
	margin-bottom: 0;
}
@media (max-width: 760px) {
	.art-body h3 {
		font-size: 19px;
		margin-top: 34px;
	}
}

/* Popisek fotky: výchozí styl bloků WP (wp-block-image figcaption) přidává margin-bottom:1em,
   návrh 04 má 0 — u dvojice fotek to dělalo o 30 px vyšší mezeru. Vrací se hodnota z návrhu. */
.art-body .art-figure figcaption {
	margin-bottom: 0;
}

/* Pevné lišty u dolního okraje (cookie lišta, mobilní lišta pokladny) nesmí zakrýt prvek, ke kterému
   se stránka posouvá (scrollIntoView / focus / skok na chybné pole) — scroll-padding-bottom zajistí,
   že cíl skončí nad lištou. Vzhled lišt se nemění. Výška 180 px pokryje cookie lištu (≈100 px na
   desktopu, ≈170 px na mobilu); samotná mobilní lišta pokladny (≈80 px) se počítá zvlášť. */
html:has(body.cookie-lista-otevrena) {
	scroll-padding-bottom: 180px;
}

@media (max-width: 980px) {
	html:has(.co-sticky-bar) {
		scroll-padding-bottom: 96px;
	}

	html:has(body.cookie-lista-otevrena):has(.co-sticky-bar) {
		scroll-padding-bottom: 180px;
	}
}