/* Úvodní strana (spec 2026-09-04-uvodni-strana-obchod-design.md).
   Task 2: věta „Sháním" (4.4). Barvy jen tokeny, písmo jen ze škály
   14/16/22/24/32, žádný border-radius - sražené rohy clip-path
   (9px velké plochy, 6px malé - viz Global Constraints v plánu). */

.mlv-shanim{
	font-family:var(--wp--preset--font-family--nadpis,'"Big Shoulders", Barlow, system-ui, sans-serif');
	background:var(--wp--preset--color--bila,#FFFFFF);
	border:1px solid var(--wp--preset--color--linka,#E1E2E5);
	padding:28px 32px;
	max-width:1360px;
	margin:0 auto;
	clip-path:polygon(9px 0,calc(100% - 9px) 0,100% 9px,100% calc(100% - 9px),
		calc(100% - 9px) 100%,9px 100%,0 calc(100% - 9px),0 9px);
}

/* Task 7 (přestavba podle prototypu prototyp/navrh-aa-shanim.html,
   8. 9. 2026): volby jsou vlastní tlačítka vetknutá do věty
   (`.mlv-shanim__mezera`) + jeden sdílený panel (`.mlv-shanim__vyber`),
   ne `<select>` - prototyp nemá jediný zaoblený roh ani systémovou
   šipku. Škála prototypu (11-92px) se překládá na naši - jen
   14/16/22/24/32, viz komentář nahoře souboru. */

.mlv-shanim__veta{
	margin:0;
	font-weight:800;
	font-size:var(--wp--preset--font-size--nadpis,32px);
	line-height:1.25;
	color:var(--wp--preset--color--inkoust,#0A0A0C);
}

.mlv-shanim__cast[hidden]{display:none}

.mlv-shanim__mezera{
	font:inherit;
	display:inline;
	background:none;
	border:0;
	border-bottom:.08em solid var(--wp--preset--color--cervena,#E00103);
	border-radius:0;
	color:var(--wp--preset--color--cervena,#E00103);
	cursor:pointer;
	padding:0 .04em .02em;
}
.mlv-shanim__mezera:hover,
.mlv-shanim__mezera[aria-expanded="true"]{
	background:var(--wp--preset--color--cervena,#E00103);
	color:var(--wp--preset--color--bila,#FFFFFF);
}
.mlv-shanim__mezera--prazdna{
	color:var(--wp--preset--color--sediva,#4E4E52);
	border-bottom-color:var(--wp--preset--color--sediva,#4E4E52);
}
.mlv-shanim__mezera--prazdna:hover,
.mlv-shanim__mezera--prazdna[aria-expanded="true"]{
	background:var(--wp--preset--color--inkoust,#0A0A0C);
	color:var(--wp--preset--color--bila,#FFFFFF);
}
.mlv-shanim__mezera:focus-visible{outline:2px solid var(--wp--preset--color--cervena,#E00103);outline-offset:3px}

/* Panel voleb: slova k doplnění, ne rozbalovátko filtrů - sražený roh
   9px, stejná formule jako u `.mlv-shanim` (velká plocha). */
.mlv-shanim__vyber{
	margin-top:18px;
	padding:16px 18px;
	display:grid;
	gap:14px;
	max-width:56rem;
	background:var(--wp--preset--color--podklad,#F5F6F7);
	border:1px solid var(--wp--preset--color--linka,#E1E2E5);
	clip-path:polygon(9px 0,calc(100% - 9px) 0,100% 9px,100% calc(100% - 9px),
		calc(100% - 9px) 100%,9px 100%,0 calc(100% - 9px),0 9px);
}
.mlv-shanim__vyber[hidden]{display:none}

.mlv-shanim__radek{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.mlv-shanim__radek-nadpis{
	flex:0 0 100%;
	font-family:var(--wp--preset--font-family--text,Barlow);
	font-size:var(--wp--preset--font-size--maly,14px);
	color:var(--wp--preset--color--sediva,#4E4E52);
}

.mlv-shanim__volba{
	appearance:none;-webkit-appearance:none;-moz-appearance:none;
	font-family:var(--wp--preset--font-family--text,Barlow);
	font-size:var(--wp--preset--font-size--vetsi,24px);
	font-weight:600;
	color:var(--wp--preset--color--inkoust,#0A0A0C);
	background:var(--wp--preset--color--bila,#FFFFFF);
	border:1px solid var(--wp--preset--color--linka,#E1E2E5);
	border-radius:0;
	margin:0;
	padding:8px 14px;
	display:inline-flex;
	align-items:baseline;
	gap:8px;
	cursor:pointer;
	clip-path:polygon(6px 0,calc(100% - 6px) 0,100% 6px,100% calc(100% - 6px),
		calc(100% - 6px) 100%,6px 100%,0 calc(100% - 6px),0 6px);
}
.mlv-shanim__volba:hover{background-color:var(--wp--preset--color--linka,#E1E2E5)}
.mlv-shanim__volba:focus-visible{outline:2px solid var(--wp--preset--color--cervena,#E00103);outline-offset:2px}
/* .mlv-shanim__volba b, __pocet, __pocet--meni a __jednotka zrušeny
   11. 9. 2026 — počty skladem se vypisují už jen v detailu produktu,
   takže volby v panelu nenesou číslo a výsledek ho nevykresluje. */

.mlv-shanim__vysledek{margin:20px 0 0}

.mlv-shanim__co{
	margin:8px 0 0;
	font-family:var(--wp--preset--font-family--text,Barlow);
	font-size:var(--wp--preset--font-size--zakladni,16px);
	color:var(--wp--preset--color--sediva,#4E4E52);
	max-width:52ch;
}

.mlv-shanim__akce{margin-top:14px;display:flex;flex-wrap:wrap;align-items:center;gap:18px}

.mlv-shanim__odkaz{
	display:inline-block;
	background:var(--wp--preset--color--cervena,#E00103);
	color:var(--wp--preset--color--bila,#FFFFFF);
	text-decoration:none;
	font-family:var(--wp--preset--font-family--text,Barlow);
	font-weight:600;
	font-size:var(--wp--preset--font-size--zakladni,16px);
	padding:12px 20px;
	clip-path:polygon(9px 0,calc(100% - 9px) 0,100% 9px,100% calc(100% - 9px),
		calc(100% - 9px) 100%,9px 100%,0 calc(100% - 9px),0 9px);
}
.mlv-shanim__odkaz:hover,
.mlv-shanim__odkaz:focus-visible{background:var(--wp--preset--color--inkoust,#0A0A0C)}

.mlv-shanim__zpet{
	background:none;
	border:0;
	color:var(--wp--preset--color--sediva,#4E4E52);
	font-family:var(--wp--preset--font-family--text,Barlow);
	font-size:var(--wp--preset--font-size--maly,14px);
	text-decoration:underline;
	cursor:pointer;
	padding:2px 0;
}
.mlv-shanim__zpet[hidden]{display:none}
.mlv-shanim__zpet:hover{color:var(--wp--preset--color--inkoust,#0A0A0C)}
.mlv-shanim__zpet:focus-visible{outline:2px solid var(--wp--preset--color--cervena,#E00103);outline-offset:2px}

@media (max-width:600px){
	.mlv-shanim{padding:20px}
	.mlv-shanim__veta{font-size:var(--wp--preset--font-size--vetsi,24px)}
	.mlv-shanim__volba{font-size:var(--wp--preset--font-size--stredni,22px)}
}

/* Task 3: pás výřezů na prkně (4.5) — jediné místo na stránce, kde
   zboží stojí vyříznuté na červeném prkně. `.mlv-pas__track` je
   vodorovně rolovatelná oblast (overflow-x), scrollbar schovaný jen
   vizuálně - klávesnicí i myší (kolečko/trackpad) jde pořád rolovat,
   pohyb navíc řídí mlv-uvodka.js přes `scrollLeft`. Žádný border-radius,
   sražený roh sekce clip-path (9px, stejně jako .mlv-shanim). */

.mlv-pas{
	background:var(--wp--preset--color--cervena,#E00103);
	max-width:1360px;
	margin:32px auto 0;
	padding:8px 0;
	clip-path:polygon(9px 0,calc(100% - 9px) 0,100% 9px,100% calc(100% - 9px),
		calc(100% - 9px) 100%,9px 100%,0 calc(100% - 9px),0 9px);
}

.mlv-pas__track{
	display:flex;
	align-items:flex-end;
	gap:28px;
	overflow-x:auto;
	overscroll-behavior-x:contain;
	padding:16px 32px 20px;
	margin:0;
	scrollbar-width:none;
	-ms-overflow-style:none;
	cursor:grab;
	/* Revize 8. 9. 2026: bez tohohle tažení myší po pásu označovalo text
	   pod ukazatelem (názvy, ceny) místo aby jen rolovalo. */
	user-select:none;
	-webkit-user-select:none;
	-ms-user-select:none;
}
.mlv-pas__track:active{cursor:grabbing}
.mlv-pas__track::-webkit-scrollbar{display:none}

.mlv-pas__kus{
	flex:0 0 auto;
	width:190px;
	display:flex;
	flex-direction:column;
	align-items:center;
	text-align:center;
	text-decoration:none;
	color:var(--wp--preset--color--bila,#FFFFFF);
}
.mlv-pas__kus:focus-visible{
	outline:2px solid var(--wp--preset--color--bila,#FFFFFF);
	outline-offset:4px;
}

.mlv-pas__obrazek{
	position:relative;
	height:180px;
	width:100%;
	display:flex;
	align-items:flex-end;
	justify-content:center;
	margin-bottom:10px;
	pointer-events:none;
}
.mlv-pas__obrazek::after{
	content:"";
	position:absolute;
	bottom:2px;
	width:70%;
	height:14px;
	background:radial-gradient(closest-side,rgba(10,10,12,.35),transparent 75%);
}
.mlv-pas__obrazek img{
	position:relative;
	max-height:100%;
	max-width:100%;
	width:auto;
	height:auto;
	-webkit-user-drag:none;
	user-select:none;
}

.mlv-pas__nazev{
	font-family:var(--wp--preset--font-family--text,Barlow);
	font-size:var(--wp--preset--font-size--maly,14px);
	line-height:1.3;
	display:-webkit-box;
	-webkit-line-clamp:2;
	-webkit-box-orient:vertical;
	overflow:hidden;
	pointer-events:none;
}

.mlv-pas__cena{
	margin-top:4px;
	font-family:var(--wp--preset--font-family--nadpis,'"Big Shoulders", Barlow, system-ui, sans-serif');
	font-weight:800;
	font-size:var(--wp--preset--font-size--vetsi,24px);
	pointer-events:none;
}
.mlv-pas__cena,.mlv-pas__cena *{color:var(--wp--preset--color--bila,#FFFFFF)}

@media (max-width:600px){
	.mlv-pas{margin-top:20px}
	.mlv-pas__track{gap:18px;padding:14px 20px 18px}
	.mlv-pas__kus{width:140px}
	.mlv-pas__obrazek{height:130px}
	.mlv-pas__cena{font-size:var(--wp--preset--font-size--stredni,22px)}
}

/* Task 4: nejprodávanější (4.7) — mřížka bílých karet, jiná rodina
   rozvržení než vodorovný pás výš (kritérium 5 specu: aspoň 6 různých
   rozvržení, žádná dvě sousední stejná). Žádné výřezy, žádná prkna -
   ty patří jen do `.mlv-pas`. Cena stejným jazykem jako karta výpisu
   (assets/css/mlv-vypis.css, `li.wc-block-product .price`) - tady se jen
   sahá po stejných tokenech (barva/písmo/velikost), hodnoty se
   nepřepisují napevno odjinud. Sražený roh karty je clip-path 9px, stejná
   formule jako `.mlv-shanim`/`.mlv-pas` výš - žádný border-radius. */

.mlv-nej{
	max-width:1360px;
	margin:32px auto 0;
}

.mlv-nej__hlavicka{
	display:flex;
	align-items:baseline;
	justify-content:space-between;
	gap:16px;
	margin:0 0 16px;
}

.mlv-nej__nadpis{
	margin:0;
	font-family:var(--wp--preset--font-family--nadpis,'"Big Shoulders", Barlow, system-ui, sans-serif');
	font-weight:800;
	font-size:var(--wp--preset--font-size--nadpis,32px);
	text-transform:uppercase;
	color:var(--wp--preset--color--inkoust,#0A0A0C);
}

.mlv-nej__vse{
	font-family:var(--wp--preset--font-family--text,Barlow);
	font-size:var(--wp--preset--font-size--zakladni,16px);
	font-weight:600;
	color:var(--wp--preset--color--cervena,#E00103);
	text-decoration:none;
	white-space:nowrap;
}
.mlv-nej__vse:hover,.mlv-nej__vse:focus-visible{text-decoration:underline}

/* Od 16. 9. 2026 to není mřížka, ale DVĚ vodorovné řeky nad sebou, každá
   na opačnou stranu (zadavatel: „ať tečou jako řeka", pak „dvě řeky pod
   sebou proti proudu") - jedou na témže modulu jako pás výřezů, viz
   `data-mlv-reka` / `data-mlv-proti-proudu` v patternu a `OSY` v
   mlv-uvodka.js. Třída zůstává `__mrizka`, ať se nemusí přepisovat všechna
   navazující pravidla i měřák; rozvržení uvnitř ale dělá flex, ne grid.
   Vlastnosti tažení (`user-select`, `cursor`, skrytý posuvník) jsou
   schválně stejné jako u `.mlv-pas__track` - je to tentýž prvek z pohledu
   ovládání. Mezera mezi řadami je stejná jako mezi kartami (`gap`), ať
   dvojice vypadá jako jeden celek, ne jako dvě sekce. */
.mlv-nej__mrizka + .mlv-nej__mrizka{margin-top:20px}
.mlv-nej__mrizka{
	display:flex;
	gap:20px;
	list-style:none;
	margin:0;
	padding:0;
	overflow-x:auto;
	overscroll-behavior-x:contain;
	scrollbar-width:none;
	-ms-overflow-style:none;
	cursor:grab;
	user-select:none;
	-webkit-user-select:none;
	-ms-user-select:none;
}
.mlv-nej__mrizka:active{cursor:grabbing}
.mlv-nej__mrizka::-webkit-scrollbar{display:none}

/* Pevná šířka karty: ve flexu by se jinak 49 karet smrsklo na nulu
   (`flex-shrink` je ve výchozím stavu 1). Čtvrtina původní mřížky při
   1360 px minus mezery, ať řeka na široké obrazovce vypadá stejně hustě
   jako dřív mřížka. */
.mlv-nej__polozka{margin:0;flex:0 0 auto;width:310px}

.mlv-nej__karta{
	display:flex;
	flex-direction:column;
	height:100%;
	box-sizing:border-box;
	background:var(--wp--preset--color--bila,#FFFFFF);
	border:1px solid var(--wp--preset--color--linka,#E1E2E5);
	border-radius:0;
	padding:14px;
	text-decoration:none;
	color:var(--wp--preset--color--inkoust,#0A0A0C);
	clip-path:polygon(9px 0,calc(100% - 9px) 0,100% 9px,100% calc(100% - 9px),
		calc(100% - 9px) 100%,9px 100%,0 calc(100% - 9px),0 9px);
}
.mlv-nej__karta:hover{border-color:var(--wp--preset--color--inkoust,#0A0A0C)}
.mlv-nej__karta:focus-visible{outline:2px solid var(--wp--preset--color--cervena,#E00103);outline-offset:2px}

/* Fotky v datech jsou už čtvercové (viz assets/data/uvodka.json, přípona
   "-sq") - `aspect-ratio` + `object-fit:cover` je jen pojistka, kdyby
   některý zdrojový snímek přesně 1:1 nebyl, ať se nedeformuje. */
.mlv-nej__foto{
	display:block;
	width:100%;
	aspect-ratio:1 / 1;
	overflow:hidden;
	margin-bottom:12px;
	background:var(--wp--preset--color--podklad,#F5F6F7);
}
.mlv-nej__foto img{
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
}

.mlv-nej__nazev{
	display:-webkit-box;
	-webkit-line-clamp:2;
	-webkit-box-orient:vertical;
	overflow:hidden;
	margin:0 0 8px;
	font-family:var(--wp--preset--font-family--text,Barlow);
	font-size:var(--wp--preset--font-size--zakladni,16px);
	font-weight:400;
	line-height:1.3;
	color:var(--wp--preset--color--inkoust,#0A0A0C);
}

.mlv-nej__cena{
	margin-top:auto;
	font-family:var(--wp--preset--font-family--nadpis,'"Big Shoulders", Barlow, system-ui, sans-serif');
	font-weight:800;
	font-size:var(--wp--preset--font-size--stredni,22px);
	line-height:1;
	color:var(--wp--preset--color--inkoust,#0A0A0C);
}

@media (max-width:900px){
	.mlv-nej__polozka{width:240px}
}

@media (max-width:600px){
	.mlv-nej{margin-top:20px}
	.mlv-nej__nadpis{font-size:var(--wp--preset--font-size--vetsi,24px)}
	.mlv-nej__mrizka{gap:14px}
	.mlv-nej__mrizka + .mlv-nej__mrizka{margin-top:14px}
	.mlv-nej__polozka{width:180px}
	.mlv-nej__karta{padding:10px}
}

/* Task 5: Tento týden na pokladně (4.8) — rozhodnutí zadavatele 8. 9.
   přebíjí spec (vodorovná lišta dole / svislé menu vlevo): sekce patří
   do LEVÉHO SLOUPCE hlavního obsahu, a pod ni časem přijde blog.

   Kostra dvou sloupců se váže na `main:has(.mlv-pokladna-tyden)` -
   žádný zásah do templates/front-page.html (sestavení je Task 7):
   jakmile Task 7 vloží tenhle pattern mezi ostatní přímé potomky
   `<main>`, CSS sama zařadí `.mlv-pokladna-tyden` do úzkého levého
   sloupce a všechno ostatní (Sháním, pás, nejprodávanější) do
   pravého. `main` je jediný na stránce (`is_front_page()` navíc CSS
   úvodky enqueuje jen na úvodní straně), selektor tedy nikam jinam
   neuteče. Nad 900px (stejná hranice jako přechod mřížky
   `.mlv-nej__mrizka` na dva sloupce výš) grid.

   Revize 8. 9. 2026 (Critical), DVĚ KOLA:

   1. kolo mělo `.mlv-pokladna-tyden{grid-column:1}` BEZ vlastního
   `grid-row` (auto-placement zabral první volný řádek). CSS Grid ale
   SDÍLÍ výšku řádku napříč sloupci - řádek 1 dostal výšku
   max(pokladna ~1024px, první pattern vpravo ~770px) a mezi prvním a
   druhým patternem vpravo vznikla mezera přesně o ten rozdíl. Změřeno
   na realistické fixtuře (pokladna + tři stávající patterny různé
   výšky jako pravý sloupec, 1440px): mezera 1.→2. pattern **254 px**.

   Opravný pokus `grid-row:1 / -1` (item přesahuje všechny řádky) SE
   PROKÁZAL JAKO NEÚČINNÝ - izolovaný test (`prototyp/tmp-grid-
   isolate.py`, mimo WP, tři bloky 770/1021/474px vpravo + item 1024px
   nastavený na `grid-row:1 / -1` vlevo) ukázal ÚPLNĚ STEJNOU mezeru
   254 px. Chromium celou potřebnou výšku spanujícího itemu přidá do
   PRVNÍHO řádku, který přesahuje, ne rozpočítá napříč rozsahem -
   nespoléhat na opak bez změření (přesně proto revize žádala měřit
   nejdřív, ne opravovat naslepo).

   SKUTEČNÁ OPRAVA: `.mlv-pokladna-tyden` dostala `position:absolute`
   (`main` proto navíc `position:relative`) a explicitní
   `grid-column:1 / 2` (obě hranice, ne jen start - u abs. pozicovaného
   gridového itemu je to podmínka, aby se `width:100%` vůbec vztáhlo
   na šířku SLOUPCE, ne na šířku celého gridu, ověřeno stejným
   izolovaným testem). Absolutně pozicovaný item se do sdílení výšky
   řádku vůbec NEPOČÍTÁ (grid track sizing bere v potaz jen prvky V
   TOKU) - pravý sloupec se tak řadí čistě podle vlastního obsahu, bez
   ohledu na výšku pokladny. Na téže izolované fixtuře po opravě:
   mezera 1.→2. **0 px** (živé číslo z WP na realistické fixtuře viz
   `.superpowers/sdd/uvodka-task-5-report.md`, oddíl „Fix revize").

   ZBYLÉ RIZIKO (zdokumentováno, neošetřeno CSS): protože pokladna už
   nepřispívá do výšky `main`, může ji vizuálně přesáhnout, POKUD by
   součet výšek pravého sloupce byl někdy nižší než výška pokladny
   (~1024 px u dnešních 8 karet) - `main` by pak končil dřív a pokladna
   by přesahovala do patičky. Ověřeno izolovaně (`prototyp/tmp-grid-
   isolate3.py`, pravý sloupec uměle zkrácen na 200px): ano, přesah
   nastane. U dnešní reálné fixtury (tři staré patterny, dohromady přes
   2 200 px) k tomu nedochází. POŽADAVEK PRO TASK 7: až se sestaví
   skutečný pravý sloupec (Sháním + pás + nejprodávanější), ověřte, že
   součet jejich výšek na 901+ px zůstává vyšší než výška
   `.mlv-pokladna-tyden` (dnes ~1024 px, kolísá s počtem/délkou názvů
   karet) - stačí porovnat `main`'s spodní hranu s `.mlv-pokladna-
   tyden`'s spodní hranou, přesah = `pokladna.bottom > main.bottom`.
   Přidal jsem na to trvalou kontrolu `kontrola_pokladna_bez_prekryvu`
   do `zmer-uvodku.py` - po sestavení šablony by měla běžet automaticky
   v hlavním `main()` a hlídat to napořád, ne jen jednorázově teď. Až
   přibude blog: NEDÁVEJTE mu vlastní nezávislé `position:absolute` (dvě
   nezávisle plovoucí abs. položky by se musely samy manuálně
   odsazovat o výšku té první, křehké). Obalte pokladnu i blog
   SPOLEČNÝM wrapperem (`<div class="mlv-uvodka-vedlejsi">`) jako
   jediným přímým potomkem `main` - `position:absolute`/`grid-column:
   1 / 2` přesuňte na wrapper, uvnitř necháte pokladnu a blog řadit se
   normálním tokem pod sebe (`display:flex;flex-direction:column;
   gap:…`). Selektory zde (`main:has(.mlv-pokladna-tyden) >
   .mlv-pokladna-tyden` i o kus níž u karet) je pak potřeba přepsat na
   `.mlv-uvodka-vedlejsi` - sestavení šablony a spřažená úprava CSS
   patří k sobě, nejde je oddělit.

   Pod 900px main přepíná na `display:flex;flex-direction:column` a
   `order` řadí `.mlv-pokladna-tyden` VŽDY až za ostatní obsah - na
   rozdíl od prostého pořadí v DOM (o něm rozhoduje Task 7) tohle drží
   na mobilu „pod hlavním obsahem, ne nad ním" bez ohledu na to, kam
   Task 7 pattern v `<main>` nakonec umístí. Ověřeno i s pokladnou jako
   PRVNÍM potomkem `main` (revize 8. 9. 2026, Important #2) - `order`
   prokazatelně přebíjí DOM pořadí, ne jen náhodou souhlasí s ním. */
@media (min-width:901px){
	main:has(.mlv-pokladna-tyden){
		position:relative;
		display:grid;
		grid-template-columns:minmax(240px,300px) 1fr;
		column-gap:32px;
		align-items:start;
	}
	main:has(.mlv-pokladna-tyden) > .mlv-pokladna-tyden{
		position:absolute;
		top:0;
		left:0;
		width:100%;
		grid-column:1 / 2;
	}
	main:has(.mlv-pokladna-tyden) > :not(.mlv-pokladna-tyden){
		grid-column:2;
		/* Task 7, nález při prvním sestavení celé stránky: grid/flex
		   ITEM má výchozí `min-width:auto`, což se rovná min-content
		   šířce jeho obsahu - `.mlv-pas__track` uvnitř má 81 kusů
		   `flex:0 0 auto;width:190px`, které se nikdy nesmí smrsknout
		   (to je JEHO vlastní vodorovné rolování, žádané chování).
		   `min-width:0` samo o sobě nestačilo (změřeno): sekce jako
		   `.mlv-pas`/`.mlv-shanim`/`.mlv-sezona`/`.mlv-nej`/`.mlv-duvera`
		   mají vlastní `max-width:1360px;margin:0 auto` (centrování pro
		   běžný blokový tok) a BEZ `width:100%` se v tomhle grid/flex
		   sloupci nedopočítaly na šířku sloupce, ale na svých vlastních
		   1360px (`getComputedStyle().width` živě potvrzeno = `1360px`
		   i na 390px viewportu) - `align-items` grid kontejneru řídí
		   jen SVISLÉ zarovnání, ne šířku. `width:100%` je jednoznačné:
		   sekce vyplní PŘESNĚ šířku sloupce/flex-itemu, a jejich vlastní
		   `max-width:1360px` zůstává jako horní strop, kdyby byl sloupec
		   někdy širší. Bez tyhle dvojice byl vodorovný přetok
		   1000/622/222+ px na 390/768/1440 px (`kontrola_pokladna_
		   pretok`); vnitřní `overflow-x:auto` v `.mlv-pas__track` dál
		   řeší rolování PÁSU samotného, nezávisle na tomhle. */
		min-width:0;
		width:100%;
		box-sizing:border-box;
	}
}
@media (max-width:900px){
	main:has(.mlv-pokladna-tyden){
		display:flex;
		flex-direction:column;
	}
	main:has(.mlv-pokladna-tyden) > .mlv-pokladna-tyden{
		position:static;
		width:auto;
		order:2;
	}
	/* Na mobilu je sloupec normální blok pod obsahem - strop 1000 px by
	   z něj udělal skoro dvě obrazovky zboží, kterým se musí prorolovat.
	   Řeka teče dál, jen v kratším korytě. */
	.mlv-pokladna__seznam{max-height:420px}
	main:has(.mlv-pokladna-tyden) > :not(.mlv-pokladna-tyden){
		order:1;
		min-width:0;
		width:100%;
		box-sizing:border-box;
	}
}

/* Jiná rodina rozvržení než `.mlv-nej__mrizka` nad tím (spec kritérium
   5: aspoň 6 různých rozvržení, žádná dvě sousední stejná) - úzký
   svislý seznam řádkových karet (foto vlevo, text vpravo), ne mřížka
   vysokých karet. Sražený roh clip-path stejnou formulí jako ostatní
   sekce výš, žádný border-radius. */
.mlv-pokladna-tyden{
	box-sizing:border-box;
	font-family:var(--wp--preset--font-family--text,Barlow);
	background:var(--wp--preset--color--podklad,#F5F6F7);
	border:1px solid var(--wp--preset--color--linka,#E1E2E5);
	padding:20px;
	clip-path:polygon(9px 0,calc(100% - 9px) 0,100% 9px,100% calc(100% - 9px),
		calc(100% - 9px) 100%,9px 100%,0 calc(100% - 9px),0 9px);
}

.mlv-pokladna__nadpis{
	margin:0 0 16px;
	font-family:var(--wp--preset--font-family--nadpis,'"Big Shoulders", Barlow, system-ui, sans-serif');
	font-weight:800;
	font-size:var(--wp--preset--font-size--vetsi,24px);
	text-transform:uppercase;
	color:var(--wp--preset--color--inkoust,#0A0A0C);
}

/* Svislá řeka (16. 9. 2026). Strop výšky tu není kosmetika, ale podmínka
   pohybu: bez něj se sloupec roztáhne přes všech 49 karet, `scrollHeight`
   se rovná `clientHeight` a modul nemá kam posouvat. Hodnota je blízko
   výšce, kterou sloupec měl s osmi kartami (~1024 px), ať se rozvržení
   úvodky po nasazení nezmění - sloupec je `position:absolute` v gridu
   a jeho výšku hlídá `kontrola_pokladna_bez_prekryvu` v zmer-uvodku.py. */
.mlv-pokladna__seznam{
	display:flex;
	flex-direction:column;
	gap:14px;
	list-style:none;
	margin:0;
	padding:0;
	max-height:1000px;
	overflow-y:auto;
	overscroll-behavior-y:contain;
	scrollbar-width:none;
	-ms-overflow-style:none;
	cursor:grab;
	user-select:none;
	-webkit-user-select:none;
	-ms-user-select:none;
}
.mlv-pokladna__seznam:active{cursor:grabbing}
.mlv-pokladna__seznam::-webkit-scrollbar{display:none}

.mlv-pokladna__polozka{margin:0}

.mlv-pokladna__karta{
	box-sizing:border-box;
	display:flex;
	align-items:center;
	gap:12px;
	background:var(--wp--preset--color--bila,#FFFFFF);
	border:1px solid var(--wp--preset--color--linka,#E1E2E5);
	border-radius:0;
	padding:8px;
	text-decoration:none;
	color:var(--wp--preset--color--inkoust,#0A0A0C);
	clip-path:polygon(6px 0,calc(100% - 6px) 0,100% 6px,100% calc(100% - 6px),
		calc(100% - 6px) 100%,6px 100%,0 calc(100% - 6px),0 6px);
}
.mlv-pokladna__karta:hover{border-color:var(--wp--preset--color--inkoust,#0A0A0C)}
.mlv-pokladna__karta:focus-visible{outline:2px solid var(--wp--preset--color--cervena,#E00103);outline-offset:2px}

.mlv-pokladna__foto{
	flex:0 0 56px;
	width:56px;
	height:56px;
	overflow:hidden;
	background:var(--wp--preset--color--podklad,#F5F6F7);
}
.mlv-pokladna__foto img{
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
}

.mlv-pokladna__info{
	min-width:0;
	display:flex;
	flex-direction:column;
	gap:2px;
}

.mlv-pokladna__nazev{
	font-size:var(--wp--preset--font-size--maly,14px);
	line-height:1.3;
	display:-webkit-box;
	-webkit-line-clamp:2;
	-webkit-box-orient:vertical;
	overflow:hidden;
}

.mlv-pokladna__cena{
	font-family:var(--wp--preset--font-family--nadpis,'"Big Shoulders", Barlow, system-ui, sans-serif');
	font-weight:800;
	font-size:var(--wp--preset--font-size--zakladni,16px);
}

@media (max-width:600px){
	.mlv-pokladna-tyden{padding:16px}
}

/* Task 6: Září (4.6) — tři velké dlaždice se skladovým počtem, jiná
   rodina rozvržení než sousedé v pořadí ze specu (kritérium 5): pás
   výřezů `.mlv-pas__track` nad tím je vodorovně rolovatelná lišta na
   červené ploše bez rámečků, `.mlv-nej__mrizka` pod tím je hustá
   mřížka fotokaret o čtyřech sloupcích - tady jsou tři velké, bíle
   orámované dlaždice s číslem skladem, bez fotek. Sražený roh
   clip-path 9px, žádný border-radius (stejná formule jako `.mlv-shanim`
   a `.mlv-nej__karta` výš). */

.mlv-sezona{
	max-width:1360px;
	margin:32px auto 0;
	padding:0 32px;
	box-sizing:border-box;
}

.mlv-sezona__hlavicka{margin:0 0 16px}

.mlv-sezona__nadpis{
	margin:0;
	font-family:var(--wp--preset--font-family--nadpis,'"Big Shoulders", Barlow, system-ui, sans-serif');
	font-weight:800;
	font-size:var(--wp--preset--font-size--nadpis,32px);
	text-transform:uppercase;
	color:var(--wp--preset--color--inkoust,#0A0A0C);
}

.mlv-sezona__mrizka{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:20px;
	list-style:none;
	margin:0;
	padding:0;
}

.mlv-sezona__polozka{margin:0}

.mlv-sezona__dlazdice{
	box-sizing:border-box;
	display:flex;
	flex-direction:column;
	height:100%;
	background:var(--wp--preset--color--bila,#FFFFFF);
	border:1px solid var(--wp--preset--color--linka,#E1E2E5);
	padding:24px;
	text-decoration:none;
	color:var(--wp--preset--color--inkoust,#0A0A0C);
	clip-path:polygon(9px 0,calc(100% - 9px) 0,100% 9px,100% calc(100% - 9px),
		calc(100% - 9px) 100%,9px 100%,0 calc(100% - 9px),0 9px);
}
.mlv-sezona__dlazdice:hover{border-color:var(--wp--preset--color--inkoust,#0A0A0C)}
.mlv-sezona__dlazdice:focus-visible{outline:2px solid var(--wp--preset--color--cervena,#E00103);outline-offset:2px}

/* .mlv-sezona__cislo a .mlv-sezona__jednotka zrušeny 11. 9. 2026 — počty
   skladem se vypisují už jen v detailu produktu. */

.mlv-sezona__nazev{
	font-family:var(--wp--preset--font-family--text,Barlow);
	font-size:var(--wp--preset--font-size--stredni,22px);
	font-weight:600;
	line-height:1.25;
}

.mlv-sezona__veta{
	margin-top:10px;
	font-family:var(--wp--preset--font-family--text,Barlow);
	font-size:var(--wp--preset--font-size--maly,14px);
	line-height:1.4;
	color:var(--wp--preset--color--sediva,#4E4E52);
}

.mlv-sezona__cta{
	margin-top:auto;
	padding-top:16px;
	font-family:var(--wp--preset--font-family--text,Barlow);
	font-size:var(--wp--preset--font-size--zakladni,16px);
	font-weight:600;
	color:var(--wp--preset--color--cervena,#E00103);
}
.mlv-sezona__dlazdice:hover .mlv-sezona__cta,
.mlv-sezona__dlazdice:focus-visible .mlv-sezona__cta{text-decoration:underline}

@media (max-width:900px){
	.mlv-sezona__mrizka{grid-template-columns:1fr}
}

@media (max-width:600px){
	.mlv-sezona{padding:0 20px}
	.mlv-sezona__dlazdice{padding:18px}
}

/* Task 6: pás důvěry (4.9) — poslední sekce na stránce, čtyři statická
   fakta o firmě (čtvrtý sloupec, vrácení zboží, přibyl rozhodnutím
   zadavatele 8. 9. 2026). Jiná rodina rozvržení než `.mlv-sezona` výš:
   plný tmavý pás bez ohraničených bílých boxů, sloupce oddělené jen
   tenkou linkou, ne rámečkem a stínem karty. Bílý text na `--inkoust`
   má nejvyšší kontrast v celé sadě - záměrně, je to poslední věta
   stránky před patičkou. */

.mlv-duvera{
	background:var(--wp--preset--color--inkoust,#0A0A0C);
	max-width:1360px;
	margin:32px auto 0;
	padding:36px 32px;
	box-sizing:border-box;
	clip-path:polygon(9px 0,calc(100% - 9px) 0,100% 9px,100% calc(100% - 9px),
		calc(100% - 9px) 100%,9px 100%,0 calc(100% - 9px),0 9px);
}

.mlv-duvera__mrizka{
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:32px;
	list-style:none;
	margin:0;
	padding:0;
}

.mlv-duvera__sloupec{
	margin:0;
	padding-left:24px;
	border-left:1px solid var(--wp--preset--color--sediva,#4E4E52);
}
.mlv-duvera__sloupec:first-child{padding-left:0;border-left:0}

.mlv-duvera__cislo{
	display:block;
	font-family:var(--wp--preset--font-family--nadpis,'"Big Shoulders", Barlow, system-ui, sans-serif');
	font-weight:800;
	font-size:var(--wp--preset--font-size--nadpis,32px);
	line-height:1;
	color:var(--wp--preset--color--bila,#FFFFFF);
}

.mlv-duvera__nadpis{
	margin:8px 0 0;
	font-family:var(--wp--preset--font-family--text,Barlow);
	font-size:var(--wp--preset--font-size--zakladni,16px);
	font-weight:700;
	text-transform:uppercase;
	color:var(--wp--preset--color--bila,#FFFFFF);
}

.mlv-duvera__text{
	margin:8px 0 0;
	font-family:var(--wp--preset--font-family--text,Barlow);
	font-size:var(--wp--preset--font-size--maly,14px);
	line-height:1.4;
	color:var(--wp--preset--color--sediva-svetla,#C1C1C5);
}

.mlv-duvera__odkaz{
	color:var(--wp--preset--color--bila,#FFFFFF);
	text-decoration:underline;
	text-underline-offset:3px;
}
.mlv-duvera__odkaz:hover{text-decoration-color:var(--wp--preset--color--cervena,#E00103)}
.mlv-duvera__odkaz:focus-visible{outline:2px solid var(--wp--preset--color--bila,#FFFFFF);outline-offset:3px}

@media (max-width:900px){
	.mlv-duvera__mrizka{grid-template-columns:1fr;gap:20px}
	.mlv-duvera__sloupec{padding-left:0;border-left:0;padding-top:20px;border-top:1px solid var(--wp--preset--color--sediva,#4E4E52)}
	.mlv-duvera__sloupec:first-child{padding-top:0;border-top:0}
}

@media (max-width:600px){
	.mlv-duvera{padding:24px 20px}
}
