/*
 * Šablona (jen frontend): hlavička, patička, detail produktu, košík a dialogy.
 */

/* ------------------------------------------------------------------ Hlavička */

.ma-hlavicka {
	background: var(--bg);
}

.ma-lista {
	background: var(--accent);
	color: var(--ink);
	font-size: .84375rem;
	font-weight: 500;
}

.ma-lista__in {
	display: flex;
	justify-content: space-between;
	gap: 1.5rem;
	padding: .5625rem var(--vnitrek);
}

.ma-lista__mobil {
	display: none;
}

.ma-lista__vpravo {
	font-weight: 700;
	white-space: nowrap;
}

.ma-hlavicka__radek {
	display: flex;
	align-items: center;
	gap: 2.5rem;
	padding: 1.375rem var(--vnitrek);
}

.ma-logo {
	display: flex;
	align-items: center;
	gap: .625rem;
	flex: none;
	color: var(--ink);
}

.ma-logo:hover {
	color: var(--ink);
}

.ma-logo__lahve {
	display: flex;
	align-items: flex-end;
	gap: 3px;
}

.ma-logo__lahve span {
	width: 9px;
	border-radius: 4px 4px 3px 3px;
}

.ma-logo__lahve span:nth-child(1) {
	height: 22px;
	background: var(--logo-1);
}

.ma-logo__lahve span:nth-child(2) {
	height: 30px;
	background: var(--logo-2);
}

.ma-logo__lahve span:nth-child(3) {
	height: 18px;
	background: var(--logo-3);
}

.ma-logo__nazev {
	font-family: var(--font-nadpis);
	font-size: 1.6875rem;
	font-weight: 800;
	letter-spacing: -.03em;
	line-height: 1;
}

.ma-logo__tld {
	color: var(--logo-dot);
}

.ma-logo--tmave {
	color: var(--white);
}

.ma-logo--tmave:hover {
	color: var(--white);
}

.ma-logo--tmave .ma-logo__lahve span:nth-child(1) {
	background: var(--logo-1-dark);
}

.ma-logo--tmave .ma-logo__lahve span:nth-child(2) {
	background: var(--logo-2-dark);
}

.ma-logo--tmave .ma-logo__lahve span:nth-child(3) {
	background: var(--logo-3-dark);
}

.ma-logo--tmave .ma-logo__tld {
	color: var(--logo-dot-dark);
}

.ma-hledani {
	display: flex;
	align-items: center;
	gap: .75rem;
	flex: 1;
	/* Bez min-width: 0 se pole nezmenší pod šířku obsahu a řádek hlavičky na tabletu přeteče. */
	min-width: 0;
	max-width: 37.5rem;
	height: 3rem;
	padding: 0 .375rem 0 1.25rem;
	border-radius: var(--r-md);
	background: var(--white);
	box-shadow: inset 0 0 0 1.5px var(--line-2);
}

.ma-hledani:focus-within {
	box-shadow: inset 0 0 0 2px var(--ink);
}

.ma-hledani__pole {
	flex: 1;
	min-width: 0;
	height: 100%;
	padding: 0;
	border: 0;
	background: transparent;
	font-size: .9375rem;
}

.ma-hledani__pole:focus {
	outline: 0;
}

.ma-hledani__pole::placeholder {
	color: var(--muted);
}

.ma-hledani__pole::-webkit-search-cancel-button {
	display: none;
}

.ma-hledani__tlacitko {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: 2.5rem;
	height: 2.25rem;
	padding: 0;
	border: 0;
	border-radius: var(--r-sm);
	background: var(--ink);
	color: var(--white);
	font-size: 1.125rem;
}

.ma-hledani__tlacitko:hover {
	background: var(--ink-hover);
}

.ma-hlavicka__odkazy {
	display: flex;
	gap: 1.625rem;
	margin-left: auto;
	flex: none;
}

.ma-hlavicka__odkazy a {
	color: var(--ink);
	font-size: .90625rem;
	font-weight: 500;
}

.ma-hlavicka__odkazy a:hover {
	text-decoration: underline;
}

.ma-kosik-tlacitko {
	display: flex;
	align-items: center;
	gap: .625rem;
	flex: none;
	height: 3rem;
	padding: 0 .5rem 0 1.25rem;
	border: 0;
	border-radius: var(--r-md);
	background: var(--ink);
	color: var(--white);
	font-size: .90625rem;
	font-weight: 600;
	white-space: nowrap;
}

.ma-hlavicka__odkazy + .ma-kosik-tlacitko {
	margin-left: 0;
}

.ma-hledani + .ma-kosik-tlacitko {
	margin-left: auto;
}

.ma-kosik-tlacitko:hover {
	background: var(--ink-hover);
}

/* Prázdný košík: bez odznaku s počtem, okraj vpravo stejný jako vlevo. */
.ma-kosik-tlacitko:has(.ma-kosik-tlacitko__pocet[hidden]) {
	padding-right: 1.25rem;
}

.ma-kosik-tlacitko__pocet {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2rem;
	height: 2rem;
	padding: 0 .375rem;
	border-radius: 1rem;
	background: var(--accent);
	color: var(--ink);
	font-size: .8125rem;
	font-weight: 800;
}

.ma-menu-tlacitko {
	display: none;
}

.ma-nav {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
	padding: 0 var(--vnitrek) 1.125rem;
}

.ma-nav__druhy {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
}

.ma-nav__druhy .ma-chip {
	align-items: center;
	height: 2.375rem;
	padding: 0 1rem;
	border: 1px solid var(--line-2);
	font-weight: 500;
	transition: background-color .15s, border-color .15s;
}

.ma-nav__druhy .ma-chip:hover {
	border-color: var(--line-strong);
}

.ma-nav__druhy .ma-chip.is-aktivni {
	border-color: var(--ink);
	font-weight: 600;
}




@media (max-width: 79.99rem) {
	.ma-hlavicka__radek {
		gap: 1.5rem;
	}

	.ma-hlavicka__odkazy {
		display: none;
	}

	.ma-hledani + .ma-hlavicka__odkazy + .ma-kosik-tlacitko {
		margin-left: auto;
	}
}

/* Tablet a mobil: menu v panelu (hamburger), řádek s druhy pod hlavičkou se skryje. */
@media (max-width: 63.99rem) {
	.ma-nav {
		display: none;
	}

	.ma-menu-tlacitko {
		display: flex;
		align-items: center;
		justify-content: center;
		flex: none;
		width: 3rem;
		height: 3rem;
		border-radius: var(--r-md);
		background: var(--white);
		color: var(--ink);
		font-size: 1.25rem;
	}

	.ma-menu-tlacitko:hover {
		color: var(--ink);
	}

	/* Hlavička se při scrollu dolů schová a při scrollu nahoru vrátí (navigace.js),
	   připnutá je bez oranžové lišty. */
	.ma-js .ma-hlavicka {
		position: sticky;
		z-index: 60;
		top: var(--hlavicka-offset);
		transition: transform .25s ease, box-shadow .25s ease;
	}

	.ma-js .ma-hlavicka.is-pripnuta {
		transform: translateY(calc(-1 * var(--ma-lista-vyska, 0px)));
		box-shadow: 0 1px 0 var(--line-2), 0 .375rem 1.25rem rgba(18, 51, 43, .14);
	}

	.ma-js .ma-hlavicka.is-skryta {
		transform: translateY(-100%);
	}

	/* Schovaná hlavička pod fixním admin barem: posun i o jeho výšku, aby nevykukovala spodní hrana. */
	.ma-js .admin-bar .ma-hlavicka.is-skryta {
		transform: translateY(calc(-100% - var(--hlavicka-offset)));
	}

	/* S JS je hledání v panelu menu (navigace.js ho přesune), bez JS zůstává pole v hlavičce. */
	.ma-js .ma-hlavicka .ma-hledani {
		display: none;
	}

	.ma-js .ma-kosik-tlacitko {
		margin-left: auto;
	}

	.ma-hlavicka__radek {
		gap: .75rem;
	}

	.ma-logo {
		margin-right: .75rem;
	}
}

@media (max-width: 47.99rem) {
	.ma-lista {
		font-size: .75rem;
		font-weight: 600;
		text-align: center;
	}

	.ma-lista__in {
		justify-content: center;
		padding: .4375rem var(--okraj);
	}

	.ma-lista__text,
	.ma-lista__vpravo {
		display: none;
	}

	.ma-lista__mobil {
		display: inline;
	}

	.ma-hlavicka__radek {
		flex-wrap: wrap;
		gap: .75rem;
		padding: .75rem var(--okraj) .875rem;
	}

	.ma-menu-tlacitko {
		order: 3;
		width: 2.75rem;
		height: 2.75rem;
	}


	.ma-logo {
		order: 1;
		flex: 1;
		min-width: 0;
		gap: .4375rem;
	}

	.ma-logo__lahve {
		gap: 2px;
	}

	.ma-logo__lahve span {
		width: 6px;
		border-radius: 3px 3px 2px 2px;
	}

	.ma-logo__lahve span:nth-child(1) {
		height: 15px;
	}

	.ma-logo__lahve span:nth-child(2) {
		height: 21px;
	}

	.ma-logo__lahve span:nth-child(3) {
		height: 12px;
	}

	.ma-logo__nazev {
		font-size: 1.3125rem;
	}

	.ma-kosik-tlacitko,
	.ma-hledani + .ma-kosik-tlacitko,
	.ma-hledani + .ma-hlavicka__odkazy + .ma-kosik-tlacitko {
		order: 2;
		margin-left: 0;
		height: 2.75rem;
		padding: 0 .375rem 0 .875rem;
		font-size: .84375rem;
		gap: .5rem;
	}

	.ma-kosik-tlacitko__soucet {
		display: none;
	}

	.ma-kosik-tlacitko__pocet {
		min-width: 1.875rem;
		height: 1.875rem;
		font-size: .78125rem;
	}

	.ma-hledani {
		order: 4;
		flex-basis: 100%;
		max-width: none;
		height: 2.875rem;
		padding: 0 .375rem 0 1rem;
	}

	.ma-nav {
		display: none;
	}
}

/* ------------------------------------------------------------------ Patička */

.ma-paticka {
	background: var(--ink);
	color: var(--on-dark);
	font-size: .90625rem;
}

.ma-paticka a {
	color: var(--on-dark);
}

.ma-paticka a:hover {
	color: var(--white);
	text-decoration: underline;
}

.ma-paticka__in {
	display: grid;
	grid-template-columns: 2fr repeat(3, 1fr);
	gap: 2.5rem;
	padding: 4rem var(--vnitrek) 2.75rem;
}

.ma-paticka__znacka {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	max-width: 21.25rem;
	line-height: 1.6;
}

.ma-paticka__znacka .ma-logo__nazev {
	font-size: 1.625rem;
}

.ma-paticka__sloupec ul {
	display: flex;
	flex-direction: column;
	gap: .625rem;
}

.ma-paticka__nadpis {
	margin-bottom: .875rem;
	color: var(--logo-dot-dark);
	font-family: var(--font-text);
	font-size: .90625rem;
	font-weight: 700;
	letter-spacing: 0;
}

.ma-paticka__spodek {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: .5rem 1.5rem;
	padding: 1.25rem var(--vnitrek);
	border-top: 1px solid rgba(255, 255, 255, .12);
	color: var(--on-dark-muted);
	font-size: .8125rem;
}

@media (max-width: 63.99rem) {
	.ma-paticka__in {
		grid-template-columns: repeat(3, 1fr);
	}

	.ma-paticka__znacka {
		grid-column: 1 / -1;
		max-width: none;
	}
}

@media (max-width: 47.99rem) {
	.ma-paticka__in {
		grid-template-columns: 1fr 1fr;
		gap: 1.5rem 1rem;
		padding: 1.75rem var(--okraj) 1rem;
	}

	.ma-paticka__znacka p {
		display: none;
	}

	.ma-paticka__znacka .ma-logo__nazev {
		font-size: 1.3125rem;
	}

	.ma-paticka__znacka .ma-logo__lahve {
		display: none;
	}

	/* Odkazy vysoké 44 px kvůli prstu, mezera je v paddingu. */
	.ma-paticka__sloupec ul {
		gap: 0;
	}

	.ma-paticka__sloupec a {
		display: inline-block;
		padding: .6875rem 0;
	}

	.ma-paticka__spodek {
		flex-direction: column;
		margin-inline: var(--okraj);
		padding-inline: 0;
		padding-top: .875rem;
		padding-bottom: 1.75rem;
		font-size: .78125rem;
	}
}

/* ------------------------------------------------------------------ Detail produktu */

.ma-detail__drobecky {
	padding: .75rem var(--vnitrek) 0;
}

.ma-detail__drobecky .ma-drobecky ol {
	color: var(--muted);
}

.ma-detail__hlavni {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 32.5rem);
	gap: 3rem;
	align-items: start;
	padding: 1.5rem var(--vnitrek) 4.5rem;
}

/* Galerie */
.ma-galerie {
	display: grid;
	grid-template-columns: 5.5rem minmax(0, 1fr);
	gap: .875rem;
	align-items: start;
}

.ma-galerie:not(:has(.ma-galerie__nahledy)) {
	grid-template-columns: minmax(0, 1fr);
}

.ma-galerie__nahledy {
	display: flex;
	flex-direction: column;
	gap: .625rem;
}

.ma-galerie__nahled {
	position: relative;
	display: block;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	border-radius: var(--r);
	background: var(--photo);
}

.ma-galerie__nahled::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	box-shadow: inset 0 0 0 1px var(--line-2);
	pointer-events: none;
}

.ma-galerie__nahled img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	opacity: .85;
}

.ma-galerie__nahled.is-aktivni {
	box-shadow: 0 0 0 2px var(--ink);
}

.ma-galerie__nahled.is-aktivni img,
.ma-galerie__nahled:hover img {
	opacity: 1;
}

.ma-galerie__hlavni {
	position: relative;
	overflow: hidden;
	border-radius: var(--r-lg);
	background: var(--photo);
}

/* Rámeček nad fotkou (vnitřní stín kontejneru by fotka překryla). */
.ma-galerie__hlavni::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	box-shadow: inset 0 0 0 1px var(--line-2);
	pointer-events: none;
}

.ma-galerie__pas {
	display: flex;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	aspect-ratio: 4 / 5;
}

.ma-galerie__pas::-webkit-scrollbar {
	display: none;
}

.ma-galerie__pas:focus-visible {
	outline-offset: -3px;
}

.ma-galerie__snimek {
	flex: 0 0 100%;
	scroll-snap-align: start;
	display: flex;
	align-items: center;
	justify-content: center;
}

.ma-galerie__snimek img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	cursor: zoom-in;
}

/* Fotky ve formátu 4 : 5 vyplní rámeček celé, bez bílých pruhů. */
.ma-galerie__snimek img.ma-foto-plna,
.ma-galerie__nahled img.ma-foto-plna {
	object-fit: cover;
}

.ma-galerie__snimek--prazdny {
	aspect-ratio: 4 / 5;
}

.ma-galerie__serie,
.ma-galerie__stitek {
	position: absolute;
	top: 1.25rem;
	left: 1.25rem;
	display: inline-flex;
	align-items: center;
	gap: .375rem;
	padding: .4375rem .8125rem;
	border-radius: var(--r-pill);
	background: var(--ink);
	color: var(--gold);
	font-size: .8125rem;
	font-weight: 700;
}

.ma-galerie__serie:hover {
	background: var(--ink-hover);
	color: var(--gold);
}

.ma-galerie__serie + .ma-galerie__stitek {
	top: 3.75rem;
}

.ma-galerie__stitek.ma-stitek--tip {
	background: var(--white);
	color: var(--ink);
}

.ma-galerie__zoom,
.ma-galerie__pocitadlo {
	position: absolute;
	bottom: 1.25rem;
	display: inline-flex;
	align-items: center;
	gap: .375rem;
	padding: .5rem .875rem;
	border: 0;
	border-radius: var(--r-md);
	background: var(--white);
	color: var(--ink);
	font-size: .8125rem;
	font-weight: 600;
}

.ma-galerie__zoom {
	left: 1.25rem;
}

.ma-galerie__pocitadlo {
	right: 1.25rem;
	pointer-events: none;
}

.ma-galerie__tecky {
	display: none;
}

.ma-zoom {
	width: 100vw;
	max-width: none;
	height: 100dvh;
	max-height: none;
	margin: 0;
	padding: 0;
	border: 0;
	background: rgba(18, 51, 43, .92);
}

.ma-zoom[open] {
	display: flex;
	align-items: center;
	justify-content: center;
}

.ma-zoom::backdrop {
	background: transparent;
}

.ma-zoom img {
	max-width: calc(100vw - 2rem);
	max-height: calc(100dvh - 2rem);
	width: auto;
	height: auto;
	border-radius: var(--r-md);
}

.ma-zoom__zavrit {
	position: absolute;
	top: 1rem;
	right: 1rem;
}

.ma-zoom__predchozi,
.ma-zoom__dalsi {
	position: absolute;
	top: 50%;
	margin-top: -1.375rem;
}

.ma-zoom__predchozi {
	left: 1rem;
}

.ma-zoom__dalsi {
	right: 1rem;
}

/* Panel s cenou */
.ma-detail__panel {
	display: flex;
	flex-direction: column;
	gap: 1.625rem;
	padding: 2.25rem;
	border-radius: var(--r-xl);
	background: var(--white);
}

.ma-detail__titulek {
	display: flex;
	flex-direction: column;
	gap: .75rem;
}

.ma-detail__stitky {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
}

.ma-detail__znacka {
	color: var(--accent-text);
	font-size: .8125rem;
	font-weight: 700;
	letter-spacing: .07em;
	text-transform: uppercase;
}

.ma-detail__nazev {
	font-size: clamp(2rem, 3.4vw, 2.875rem);
	line-height: 1.02;
}

.ma-detail__podtitul {
	color: var(--muted);
	font-size: 1rem;
}

.ma-detail__cena {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: .5rem 1rem;
	padding: 1.25rem 1.375rem;
	border-radius: var(--r-lg);
	background: var(--sand);
}

.ma-detail__castka {
	font-family: var(--font-nadpis);
	font-size: 2.375rem;
	font-weight: 800;
	line-height: 1.1;
}

.ma-detail__cena.is-vyprodano .ma-detail__castka {
	color: var(--muted-soft);
}

.ma-detail__sklad {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	padding: .5rem .875rem;
	border: 1px solid color-mix(in srgb, var(--ok) 45%, transparent);
	border-radius: var(--r-pill);
	background: var(--ok-bg);
	color: var(--ok-strong);
	font-size: .90625rem;
	font-weight: 700;
}

.ma-detail__sklad--vyprodano {
	border-color: var(--line-strong);
	background: var(--sand-3);
	color: var(--muted);
}

.ma-koupit {
	display: flex;
	flex-wrap: wrap;
	gap: .75rem;
}

.ma-koupit__tlacitko {
	flex: 1;
	min-height: 3.625rem;
	font-size: 1.0625rem;
	font-weight: 800;
}

.ma-koupit__text-mobil {
	display: none;
}

.ma-koupit__noscript {
	flex-basis: 100%;
	color: var(--muted);
	font-size: .875rem;
}

.ma-pocet {
	display: grid;
	grid-template-columns: 3rem 2.25rem 3rem;
	align-items: center;
	height: 3.625rem;
	border-radius: var(--r-md);
	background: var(--sand);
	font-size: 1.125rem;
}

.ma-pocet button {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	padding: 0;
	border: 0;
	border-radius: var(--r-sm);
	background: transparent;
	font-size: 1rem;
}

.ma-pocet button:hover:not(:disabled) {
	background: var(--sand-3);
}

.ma-pocet button:disabled {
	opacity: .35;
	cursor: not-allowed;
}

.ma-pocet label {
	display: flex;
	height: 100%;
}

.ma-pocet input {
	width: 100%;
	height: 100%;
	padding: 0;
	border: 0;
	background: transparent;
	font-weight: 800;
	text-align: center;
	-moz-appearance: textfield;
}

.ma-pocet input::-webkit-outer-spin-button,
.ma-pocet input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.ma-pocet--maly {
	grid-template-columns: 1.75rem 1.375rem 1.75rem;
	height: 1.875rem;
	font-size: .875rem;
}

.ma-pocet--maly button {
	font-size: .75rem;
}

.ma-pocet__hodnota {
	font-weight: 700;
	text-align: center;
}

.ma-kroky {
	display: flex;
	flex-direction: column;
	gap: .75rem;
	color: var(--ink-2);
	font-size: .90625rem;
	line-height: 1.5;
	counter-reset: krok;
}

.ma-kroky li {
	display: grid;
	grid-template-columns: 1.75rem 1fr;
	gap: .625rem;
	align-items: start;
	counter-increment: krok;
}

.ma-kroky li::before {
	content: counter(krok);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 1.75rem;
	height: 1.75rem;
	margin-top: -.1875rem;
	border-radius: 50%;
	background: var(--sand);
	color: var(--ink);
	font-size: .8125rem;
	font-weight: 800;
}

.ma-vek {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: .875rem;
	align-items: center;
	padding: .875rem 1rem;
	border-radius: var(--r-md);
	background: var(--ink);
	color: #e4ece9;
	font-size: .84375rem;
	line-height: 1.5;
}

.ma-vek__ikona {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	border-radius: 50%;
	background: var(--accent);
	color: var(--ink);
	font-size: .875rem;
	font-weight: 800;
}

/* Hlídací pes */
.ma-hlidani {
	display: flex;
	flex-direction: column;
	gap: .875rem;
	padding: 1.5rem;
	border-radius: var(--r-lg);
	background: var(--sand-2);
	color: var(--ink-2);
	font-size: .90625rem;
	line-height: 1.55;
	scroll-margin-top: 1.5rem;
}

.ma-hlidani__nadpis {
	color: var(--ink);
	font-size: 1.375rem;
}

.ma-hlidani__formular {
	display: flex;
	gap: .625rem;
}

.ma-hlidani__formular input[type="email"] {
	flex: 1;
	min-width: 0;
	height: 3.25rem;
	padding: 0 1.125rem;
	border-radius: var(--r-md);
	background: var(--white);
}

.ma-hlidani__formular .ma-btn {
	min-height: 3.25rem;
	font-weight: 700;
}

/* Dotaz k produktu (rozbalovací <details> pod nákupem). */
.ma-dotaz {
	/* overflow: pozadí hlavičky (hover) a formuláře nesmí přetéct zaoblené rohy. */
	overflow: hidden;
	border-radius: var(--r-lg);
	background: var(--sand);
	scroll-margin-top: 1.5rem;
}

.ma-dotaz__cta {
	display: flex;
	align-items: center;
	gap: .875rem;
	padding: 1rem 1.25rem;
	border-radius: inherit;
	cursor: pointer;
	list-style: none;
}

.ma-dotaz__cta::-webkit-details-marker {
	display: none;
}

.ma-dotaz__cta:hover {
	background: var(--sand-2);
}

.ma-dotaz__cta:focus-visible {
	outline: 2px solid var(--ink);
	outline-offset: -2px;
}

.ma-dotaz__ikona {
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 50%;
	background: var(--white);
	color: var(--ink);
	font-family: var(--font-nadpis);
	font-size: 1.125rem;
	font-weight: 800;
}

.ma-dotaz__titulek {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: .125rem;
	color: var(--ink);
	font-size: .9375rem;
}

.ma-dotaz__titulek span {
	color: var(--muted);
	font-size: .84375rem;
}

.ma-dotaz__cta > .ma-ikona {
	flex: none;
	width: 1.25rem;
	height: 1.25rem;
	color: var(--ink);
	transition: transform .2s;
}

.ma-dotaz[open] .ma-dotaz__cta > .ma-ikona {
	transform: rotate(180deg);
}

.ma-dotaz__obsah {
	display: flex;
	flex-direction: column;
	gap: .875rem;
	padding: 0 1.25rem 1.25rem;
}

.ma-dotaz__formular {
	display: flex;
	flex-direction: column;
	gap: .875rem;
}

.ma-dotaz .ma-pole input,
.ma-dotaz .ma-pole textarea {
	background: var(--white);
}

.ma-dotaz__radek {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr));
	gap: .875rem;
}

.ma-dotaz__info {
	color: var(--muted);
	font-size: .8125rem;
}

.ma-dotaz__info a {
	color: var(--ink);
	font-weight: 600;
}

.ma-dotaz__formular .ma-btn {
	align-self: flex-start;
	min-height: 3rem;
}

@media (prefers-reduced-motion: reduce) {
	.ma-dotaz__cta > .ma-ikona {
		transition: none;
	}
}

.ma-hotovo {
	display: flex;
	align-items: center;
	gap: .625rem;
	padding: .875rem 1.125rem;
	border-radius: var(--r-md);
	background: var(--ok-bg);
	color: var(--ok-strong);
	font-size: .875rem;
	font-weight: 600;
}

/* Pruh výhod (USP) */
.ma-usp {
	padding: 0 var(--vnitrek) 4.5rem;
}

.ma-usp__seznam {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
	gap: 1rem 2rem;
	padding: 1.5rem 1.75rem;
	border-radius: var(--r-lg);
	background: var(--sand);
}

.ma-usp__polozka {
	display: grid;
	grid-template-columns: 2.75rem 1fr;
	gap: .875rem;
	align-items: center;
}

.ma-usp__ikona {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	border-radius: 50%;
	background: var(--white);
	color: var(--accent-text);
	font-size: 1.375rem;
}

.ma-usp__texty {
	display: flex;
	flex-direction: column;
	gap: .125rem;
	color: var(--muted);
	font-size: .84375rem;
	line-height: 1.45;
}

.ma-usp__texty strong {
	color: var(--ink);
	font-size: .9375rem;
	font-weight: 700;
}

@media (max-width: 47.99rem) {
	.ma-usp {
		padding: 1.75rem var(--okraj) 0;
	}

	.ma-usp__seznam {
		grid-template-columns: minmax(0, 1fr);
		gap: .875rem;
		padding: 1.125rem 1.25rem;
	}
}

/* Popis a parametry */
.ma-detail__info {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 32.5rem);
	gap: 3rem;
	align-items: start;
	padding: 0 var(--vnitrek) 5rem;
}

.ma-detail__popis,
.ma-detail__parametry {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.ma-detail__popis {
	max-width: 40rem;
}

.ma-detail__parametry {
	grid-column: 2;
}

.ma-detail__info h2,
.ma-detail__clanky h2 {
	font-size: 1.875rem;
	letter-spacing: -.025em;
}

/* Související články (sdílené druhy, značky, země a série s blogem) */
.ma-detail__clanky {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
	padding: 0 var(--vnitrek) 5rem;
}

.ma-parametry {
	display: flex;
	flex-direction: column;
	padding: .375rem 1.375rem;
	border-radius: var(--r-lg);
	background: var(--white);
	font-size: .90625rem;
}

.ma-parametry div {
	display: grid;
	grid-template-columns: 10.625rem 1fr;
	gap: 1rem;
	padding: .75rem 0;
	border-bottom: 1px solid #f1ebde;
}

.ma-parametry div:last-child {
	border-bottom: 0;
}

.ma-parametry dt {
	color: var(--muted);
}

.ma-parametry dd {
	font-weight: 600;
}

.ma-parametry dd a {
	color: var(--ink);
	text-decoration: underline;
	text-decoration-color: var(--line-strong);
	text-underline-offset: .2em;
}

.ma-parametry__vse {
	display: none;
}

.ma-detail__serie {
	padding-bottom: 5rem;
}

/* Mobil i tablet na výšku: jeden sloupec (název nad fotkou, pod ní cena a další informace)
   a připnutá lišta s košíkem. Na tabletu je sloupec užší, viz blok níž. */
@media (max-width: 63.99rem) {
	.ma-detail__drobecky {
		padding: 0 var(--okraj) .75rem;
	}

	.ma-detail__hlavni {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: .75rem;
		padding: 0 var(--okraj);
	}

	.ma-galerie {
		grid-template-columns: minmax(0, 1fr);
		gap: .625rem;
	}

	.ma-galerie__nahledy {
		display: none;
	}

	.ma-galerie__serie,
	.ma-galerie__stitek {
		top: .75rem;
		left: .75rem;
		padding: .375rem .6875rem;
		font-size: .75rem;
	}

	.ma-galerie__serie + .ma-galerie__stitek {
		top: 2.875rem;
	}

	/* Na mobilu stačí tečky pod fotkou. */
	.ma-galerie__zoom,
	.ma-galerie__pocitadlo {
		display: none;
	}

	.ma-galerie__tecky {
		display: flex;
		justify-content: center;
		gap: .375rem;
	}

	.ma-galerie__tecky span {
		width: .375rem;
		height: .375rem;
		border-radius: 3px;
		background: #d6cdb9;
		transition: width .15s;
	}

	.ma-galerie__tecky .is-aktivni {
		width: 1.125rem;
		background: var(--ink);
	}

	/* Panel se rozpustí do sloupce detailu, aby šel název nad fotku (fotka zůstává 4 : 5). */
	.ma-detail__panel {
		display: contents;
	}

	.ma-detail__titulek {
		order: -1;
	}

	.ma-detail__stitky {
		display: none;
	}

	.ma-detail__titulek {
		gap: .625rem;
	}

	.ma-detail__nazev {
		font-size: 1.75rem;
	}

	.ma-detail__podtitul {
		font-size: .90625rem;
	}

	.ma-detail__cena {
		margin-top: .375rem;
		padding: 1rem;
		border-radius: var(--r-md);
		background: var(--white);
	}

	.ma-detail__castka {
		font-size: 1.875rem;
	}

	.ma-detail__sklad {
		padding: .4375rem .75rem;
		font-size: .84375rem;
	}

	/* Připnutá lišta s košíkem dole. */
	.ma-koupit {
		position: fixed;
		z-index: 50;
		inset: auto 0 0;
		flex-wrap: nowrap;
		gap: .625rem;
		padding: .75rem var(--okraj) calc(1.5rem + env(safe-area-inset-bottom, 0px));
		background: var(--white);
		box-shadow: var(--stin-lista);
	}

	.single-produkt .ma-paticka {
		padding-bottom: 6rem;
	}

	.ma-koupit .ma-pocet {
		flex: none;
		grid-template-columns: 2.5rem 1.75rem 2.5rem;
		height: 3.25rem;
	}

	.ma-koupit__tlacitko {
		min-height: 3.25rem;
		font-size: .96875rem;
	}

	.ma-koupit__text {
		display: none;
	}

	.ma-koupit__text-mobil {
		display: inline;
	}

	.ma-kroky {
		display: none;
	}

	.ma-vek {
		gap: .75rem;
		padding: .75rem .875rem;
		border-radius: var(--r-lg);
		background: var(--sand-2);
		color: var(--ink-2);
		font-size: .8125rem;
		line-height: 1.45;
	}

	.ma-vek__ikona {
		width: 2.25rem;
		height: 2.25rem;
		background: var(--ink);
		color: var(--white);
		font-size: .75rem;
	}

	.ma-hlidani {
		padding: 1.25rem;
	}

	.ma-hlidani__formular {
		flex-direction: column;
	}

	.ma-detail__info {
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 1.5rem;
		padding: 1.5rem var(--okraj) 2.5rem;
	}

	.ma-detail__info h2,
	.ma-detail__clanky h2 {
		font-size: 1.375rem;
	}

	.ma-detail__clanky {
		gap: 1rem;
		padding: 0 var(--okraj) 2.5rem;
	}

	.ma-detail__popis .ma-text {
		font-size: .9375rem;
		line-height: 1.65;
	}

	.ma-parametry {
		padding: .125rem 1rem;
		border-radius: var(--r-md);
		font-size: .875rem;
	}

	.ma-parametry div {
		grid-template-columns: 7.5rem 1fr;
		gap: .75rem;
		padding: .6875rem 0;
	}

	.ma-parametry.is-sbalene .ma-parametry__navic {
		display: none;
	}

	.ma-parametry.is-sbalene div:nth-child(6) {
		border-bottom: 0;
	}

	.ma-parametry__vse {
		display: flex;
		align-items: center;
		gap: .375rem;
		margin-top: -1.125rem;
		padding: .75rem 1rem;
		border: 0;
		border-radius: 0 0 var(--r-md) var(--r-md);
		background: var(--white);
		color: var(--accent-text);
		font-size: .875rem;
		font-weight: 700;
	}

	.ma-parametry.is-sbalene {
		border-radius: var(--r-md) var(--r-md) 0 0;
	}

	.ma-detail__serie {
		padding: 1.75rem var(--okraj-panel) 1.5rem;
	}
}

/* Tablet: mobilní rozložení se stejnými okraji jako hlavička, jen fotka 4 : 5 je užší uprostřed. */
@media (min-width: 48rem) and (max-width: 63.99rem) {
	.ma-detail__hlavni {
		gap: 1rem;
	}

	.ma-galerie {
		align-self: center;
		width: min(100%, 26rem);
	}

	.ma-detail__nazev {
		font-size: 2.125rem;
	}

	/* Výhody pod nákupem se stejnými okraji jako hlavička a obsah, s mezerou jako na mobilu. */
	.ma-usp {
		padding: 1.75rem var(--okraj) 0;
	}
}

/* ------------------------------------------------------------------ Košík */

.ma-kosik {
	width: min(30rem, 100vw);
	max-width: none;
	height: 100dvh;
	max-height: none;
	margin: 0 0 0 auto;
	padding: 0;
	border: 0;
	background: var(--bg);
	color: var(--ink);
	overflow: hidden;
}

.ma-kosik[open] {
	display: flex;
	flex-direction: column;
	animation: ma-vyjet .2s ease-out;
}

.ma-kosik::backdrop {
	background: rgba(18, 51, 43, .55);
}

@keyframes ma-vyjet {
	from {
		transform: translateX(2rem);
		opacity: 0;
	}
}

.ma-kosik__hlavicka {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 1.5rem 1.75rem;
	background: var(--ink);
	color: var(--white);
}

.ma-kosik__nadpis {
	display: flex;
	align-items: center;
	gap: .625rem;
	font-size: 1.75rem;
	letter-spacing: -.02em;
}

/* Počet kusů v kolečku jako u tlačítka košíku v hlavičce. */
.ma-kosik__pocet {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2rem;
	height: 2rem;
	padding: 0 .375rem;
	border-radius: 1rem;
	background: var(--accent);
	color: var(--ink);
	font-family: var(--font-text);
	font-size: .875rem;
	font-weight: 800;
	letter-spacing: 0;
}

.ma-kosik__pocet[hidden] {
	display: none;
}

.ma-kosik__telo {
	flex: 1;
	overflow-y: auto;
	overscroll-behavior: contain;
}

.ma-kosik__prazdny {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	align-items: flex-start;
	padding: 2rem 1.75rem;
}

/* Prázdný košík s ilustrací (noscript varianta zůstává jen textová). */
.ma-kosik__prazdny[data-ma-kosik-prazdny] {
	align-items: center;
	gap: .5rem;
	padding-top: 2.5rem;
	text-align: center;
}

.ma-kosik__prazdny[data-ma-kosik-prazdny][hidden] {
	display: none;
}

.ma-kosik__prazdny-obrazek {
	width: min(15rem, 70%);
	height: auto;
	margin-bottom: .5rem;
}

.ma-kosik__prazdny-nadpis {
	color: var(--ink);
	font-family: var(--font-nadpis);
	font-size: 1.625rem;
	font-weight: 800;
	letter-spacing: -.02em;
	line-height: 1.15;
}

.ma-kosik__prazdny-text {
	max-width: 19rem;
	margin-bottom: 1rem;
	color: var(--muted);
	font-size: .9375rem;
	line-height: 1.55;
}

.ma-kosik__obsah {
	display: flex;
	flex-direction: column;
	gap: .625rem;
	padding: 1.25rem 1.25rem 1.25rem;
}

.ma-kosik__polozky {
	display: flex;
	flex-direction: column;
	gap: .625rem;
}

.ma-polozka {
	display: grid;
	grid-template-columns: 4rem minmax(0, 1fr) auto;
	gap: .875rem;
	align-items: center;
	padding: .75rem;
	border-radius: var(--r-md);
	background: var(--white);
}

.ma-polozka__foto {
	position: relative;
	display: block;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	border-radius: var(--r-sm);
	background: var(--photo);
}

/* Rámeček přes fotku: inset stín na samotném odkazu by fotka překryla. */
.ma-polozka__foto::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	box-shadow: inset 0 0 0 1px var(--line-2);
	pointer-events: none;
}

.ma-polozka__foto img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.ma-polozka__info {
	display: flex;
	flex-direction: column;
	gap: .25rem;
	min-width: 0;
}

.ma-polozka__nazev {
	color: var(--ink);
	font-size: .90625rem;
	font-weight: 700;
	line-height: 1.3;
}

.ma-polozka__nazev:hover {
	color: var(--ink);
	text-decoration: underline;
}

.ma-polozka__meta {
	color: var(--muted);
	font-size: .8125rem;
}

.ma-polozka__ovladani {
	display: flex;
	align-items: center;
	gap: .75rem;
	margin-top: .25rem;
}

.ma-polozka__odebrat {
	margin: -.5rem -.5rem -.5rem -.375rem;
	padding: .875rem .5rem .875rem .375rem;
	border: 0;
	background: none;
	color: var(--muted);
	font-size: .8125rem;
	text-decoration: underline;
	text-underline-offset: .15em;
}

.ma-polozka__odebrat:hover {
	color: var(--ink);
}

.ma-polozka__cena {
	align-self: start;
	font-size: .9375rem;
	font-weight: 800;
	white-space: nowrap;
}

.ma-kosik__soucet {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	padding: .875rem .5rem 0;
	font-size: .9375rem;
	font-weight: 600;
}

.ma-kosik__soucet strong {
	font-family: var(--font-nadpis);
	font-size: 1.625rem;
	font-weight: 800;
}

.ma-kosik__poznamka {
	padding: 0 .5rem;
	color: var(--muted);
	font-size: .8125rem;
	line-height: 1.5;
}

.ma-kosik__dalsi {
	display: flex;
	flex-direction: column;
	gap: .625rem;
	margin-top: .75rem;
	padding: 0 .5rem;
}

.ma-kosik__dalsi .ma-btn {
	min-height: 3.5rem;
	font-weight: 800;
}

.ma-kosik__dalsi .ma-kosik__poznamka {
	text-align: center;
}

.ma-kosik__podnadpis {
	font-family: var(--font-nadpis);
	font-size: 1.25rem;
	font-weight: 800;
	letter-spacing: -.01em;
}

h3.ma-kosik__podnadpis {
	margin-top: .5rem;
}

.ma-kosik__odeslat {
	display: flex;
	flex-direction: column;
	gap: .75rem;
	margin-top: .25rem;
}

.ma-kosik__odeslat .ma-btn {
	min-height: 3.5rem;
	font-weight: 800;
}

.ma-kosik__odeslat .ma-kosik__poznamka {
	text-align: center;
	text-wrap: pretty;
}

@media (max-width: 47.99rem) {
	.ma-kosik {
		width: 100vw;
	}

	.ma-kosik__hlavicka {
		padding: 1.125rem 1rem;
	}

	.ma-kosik__nadpis {
		font-size: 1.5rem;
	}

	.ma-kosik__obsah {
		padding: .875rem .75rem 0;
	}

	.ma-polozka {
		grid-template-columns: 3.5rem minmax(0, 1fr) auto;
		gap: .75rem;
		padding: .625rem;
	}

	.ma-polozka .ma-pocet--maly {
		grid-template-columns: 2.5rem 1.5rem 2.5rem;
		height: 2.5rem;
	}

	/* Pokračování připnuté dole. */
	.ma-kosik__dalsi {
		position: sticky;
		bottom: 0;
		margin: .75rem -.75rem 0;
		padding: .75rem .75rem calc(1.5rem + env(safe-area-inset-bottom, 0px));
		background: var(--white);
		box-shadow: var(--stin-lista);
	}
}

/* ------------------------------------------------------------------ Příspěvek a záložní šablony */

.ma-clanek {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
	max-width: calc(45rem + 2 * var(--okraj));
	margin: 0 auto;
	padding: 2.5rem var(--okraj) var(--sekce);
}

/* Pod článkem panel lahviček: menší mezera než konec stránky. */
.ma-clanek:has(+ .ma-panel-produktu) {
	padding-bottom: 3rem;
}

.ma-clanek__hlavicka {
	display: flex;
	flex-direction: column;
	gap: .75rem;
}

.ma-clanek h1 {
	font-size: clamp(2rem, 5vw, 3.25rem);
}

.ma-clanek time {
	color: var(--muted);
	font-size: .875rem;
}

.ma-clanek__foto {
	aspect-ratio: 4 / 3;
	overflow: hidden;
	border-radius: var(--r);
	background: var(--photo);
}

.ma-clanek__foto img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ------------------------------------------------------------------ Blog: karty článků */

.ma-mrizka--clanky {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.25rem;
}

@media (max-width: 63.99rem) {
	.ma-mrizka--clanky {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 39.99rem) {
	.ma-mrizka--clanky {
		grid-template-columns: minmax(0, 1fr);
		gap: 1rem;
	}
}

.ma-clanek-karta {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 1rem;
	height: 100%;
	padding: .75rem;
	border: 1px solid var(--line-card);
	border-radius: var(--r);
	background: var(--white);
	color: var(--ink);
	transition: border-color .15s, box-shadow .15s;
}

.ma-clanek-karta:hover {
	border-color: #d9cfbc;
	box-shadow: var(--stin-karta);
}

.ma-clanek-karta__foto {
	aspect-ratio: 4 / 3;
	overflow: hidden;
	border-radius: var(--r-sm);
	background: var(--photo);
}

.ma-clanek-karta__foto img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ma-clanek-karta__info {
	display: flex;
	flex-direction: column;
	gap: .5rem;
	padding: 0 .375rem .375rem;
}

.ma-clanek-karta time {
	color: var(--muted);
	font-size: .8125rem;
}

.ma-clanek-karta__nazev {
	font-size: 1.25rem;
	line-height: 1.25;
	text-wrap: balance;
}

.ma-clanek-karta__odkaz {
	color: inherit;
}

/* Celá karta je klikací. */
.ma-clanek-karta__odkaz::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
}

.ma-clanek-karta__odkaz:hover {
	color: inherit;
}

.ma-clanek-karta__odkaz:focus-visible {
	outline: 0;
}

.ma-clanek-karta__odkaz:focus-visible::after {
	outline: 2px solid var(--accent-text);
	outline-offset: 2px;
}

.ma-clanek-karta__uryvek {
	color: var(--ink-2);
	font-size: .9375rem;
	line-height: 1.55;
}

.ma-404 {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 24rem);
	align-items: center;
	gap: 2rem 3rem;
	margin-bottom: var(--sekce);
}

.ma-404__text {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 1.125rem;
}

.ma-404__akce {
	display: flex;
	flex-wrap: wrap;
	gap: .625rem;
	margin-top: .5rem;
}

.ma-404__obrazek {
	width: 100%;
	height: auto;
}

@media (max-width: 47.99rem) {
	.ma-404 {
		grid-template-columns: 1fr;
		gap: 1rem;
	}

	.ma-404__obrazek {
		order: -1;
		width: min(15rem, 70%);
		justify-self: center;
	}

	.ma-404__text {
		gap: .75rem;
	}
}

/* ------------------------------------------------------------------ View Transitions */

/*
 * Přechody mezi stránkami (Chrome, Edge, Safari 18.2+). Ostatní prohlížeče je ignorují.
 * Jména ma-produkt-foto a ma-produkt-nazev nastavuje assets/js/prechody.js jen na kartu,
 * na kterou se kliklo, a na fotku a nadpis detailu.
 */
@media (prefers-reduced-motion: no-preference) {
	@view-transition {
		navigation: auto;
	}

	::view-transition-group(root) {
		animation-duration: .2s;
	}

	::view-transition-group(ma-produkt-foto),
	::view-transition-group(ma-produkt-nazev) {
		animation-duration: .35s;
		animation-timing-function: cubic-bezier(.2, .8, .2, 1);
	}

	/* Karta je 4 : 5, detail 1 : 1: snímky se ořezávají, ne deformují. */
	::view-transition-old(ma-produkt-foto),
	::view-transition-new(ma-produkt-foto) {
		height: 100%;
		object-fit: contain;
		overflow: hidden;
	}

	::view-transition-image-pair(ma-produkt-foto) {
		overflow: hidden;
		border-radius: var(--r-lg);
	}

	/* Filtry a řazení: karty se přesunou na nové místo, nové se objeví, vyřazené zmizí. */
	::view-transition-group(*.ma-karta) {
		animation-duration: .4s;
		animation-timing-function: cubic-bezier(.2, .8, .2, 1);
	}

	::view-transition-old(*.ma-karta):only-child {
		animation: .2s ease-in both ma-karta-pryc;
	}

	::view-transition-new(*.ma-karta):only-child {
		animation: .3s ease-out .1s both ma-karta-sem;
	}

	/* Text názvu se mění velikostí, jen se prolne bez roztahování. */
	::view-transition-old(ma-produkt-nazev),
	::view-transition-new(ma-produkt-nazev) {
		height: 100%;
		width: auto;
	}
}

/* ------------------------------------------------------------------ Našeptávač */

.ma-hledani {
	position: relative;
}

.ma-hledani[aria-busy="true"] .ma-hledani__tlacitko .ma-ikona {
	opacity: .4;
}

.ma-naseptavac {
	position: absolute;
	z-index: 150;
	top: calc(100% + .5rem);
	left: 0;
	right: 0;
	display: flex;
	flex-direction: column;
	gap: .25rem;
	max-height: min(36rem, 70dvh);
	overflow-y: auto;
	overscroll-behavior: contain;
	padding: .5rem;
	border-radius: var(--r-lg);
	background: var(--white);
	box-shadow: 0 0 0 1px var(--line-2), var(--stin);
	color: var(--ink);
	font-size: .875rem;
}

.ma-naseptavac__skupina {
	display: flex;
	flex-direction: column;
}

.ma-naseptavac__skupina + .ma-naseptavac__skupina {
	margin-top: .25rem;
	padding-top: .5rem;
	border-top: 1px solid var(--line);
}

.ma-naseptavac__nadpis {
	padding: .375rem .625rem .25rem;
	color: var(--muted);
	font-size: .71875rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.ma-naseptavac__moznost {
	display: flex;
	align-items: center;
	gap: .75rem;
	min-height: 2.75rem;
	padding: .375rem .625rem;
	border-radius: var(--r);
	color: var(--ink);
}

.ma-naseptavac__moznost:hover,
.ma-naseptavac__moznost[aria-selected="true"] {
	background: var(--sand);
	color: var(--ink);
}

.ma-naseptavac mark {
	background: none;
	color: inherit;
	font-weight: 800;
}

.ma-naseptavac__typ {
	flex: none;
	min-width: 3.75rem;
	padding: .1875rem .5rem;
	border-radius: var(--r-pill);
	background: var(--sand-2);
	font-size: .71875rem;
	font-weight: 700;
	text-align: center;
}

.ma-naseptavac__kategorie .ma-naseptavac__nazev {
	font-weight: 600;
}

.ma-naseptavac__rodic {
	color: var(--muted);
	font-size: .8125rem;
}

.ma-naseptavac__pocet {
	margin-left: auto;
	color: var(--muted);
	font-size: .78125rem;
}

.ma-naseptavac__foto {
	flex: none;
	width: 2.5rem;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	border-radius: var(--r-sm);
	background: var(--photo);
}

.ma-naseptavac__foto img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.ma-naseptavac__info {
	display: flex;
	flex-direction: column;
	flex: 1;
	min-width: 0;
	line-height: 1.3;
}

.ma-naseptavac__znacka {
	color: var(--muted);
	font-size: .6875rem;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.ma-naseptavac__produkt .ma-naseptavac__nazev {
	overflow: hidden;
	font-weight: 600;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.ma-naseptavac__meta {
	color: var(--muted);
	font-size: .78125rem;
}

.ma-naseptavac__cena {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	flex: none;
	font-weight: 700;
	white-space: nowrap;
}

.ma-naseptavac__cena small {
	color: var(--muted);
	font-size: .71875rem;
	font-weight: 500;
}

.ma-naseptavac__cena.is-vyprodano {
	color: var(--muted);
}

.ma-naseptavac__vse {
	justify-content: center;
	margin-top: .25rem;
	border-top: 1px solid var(--line);
	border-radius: 0 0 var(--r) var(--r);
	color: var(--accent-text);
	font-weight: 700;
}

.ma-naseptavac__prazdno {
	padding: 1rem .625rem;
	color: var(--muted);
	text-align: center;
}

@media (max-width: 47.99rem) {
	.ma-naseptavac {
		max-height: 65dvh;
		padding: .375rem;
	}

	.ma-naseptavac__rodic {
		display: none;
	}
}

@keyframes ma-karta-pryc {
	to {
		opacity: 0;
		transform: scale(.94);
	}
}

@keyframes ma-karta-sem {
	from {
		opacity: 0;
		transform: scale(.94);
	}
}

/* ------------------------------------------------------------------ Košík: doprava, platba, rekapitulace */

.ma-kosik__volby {
	display: flex;
	flex-direction: column;
	gap: .5rem;
}

.ma-kosik__volby legend {
	margin-bottom: .75rem;
}

.ma-volba {
	position: relative;
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	gap: .75rem;
	align-items: center;
	padding: .75rem .875rem;
	border-radius: var(--r);
	background: var(--sand);
	box-shadow: inset 0 0 0 1.5px transparent;
	font-size: .875rem;
	cursor: pointer;
	transition: box-shadow .15s, background-color .15s;
}

.ma-volba:hover {
	background: var(--sand-3);
}

.ma-volba input {
	position: absolute;
	opacity: 0;
	width: 1rem;
	height: 1rem;
	margin: 0;
}

.ma-volba__kolecko {
	width: 1.125rem;
	height: 1.125rem;
	border: 1.5px solid var(--line-strong);
	border-radius: 50%;
	background: var(--white);
}

.ma-volba:has(input:checked) {
	background: var(--white);
	box-shadow: inset 0 0 0 1.5px var(--ink);
}

.ma-volba input:checked + .ma-volba__kolecko {
	border: 5px solid var(--ink);
}

.ma-volba input:focus-visible + .ma-volba__kolecko {
	outline: 2px solid var(--accent-text);
	outline-offset: 2px;
}

.ma-volba:has(input:disabled) {
	opacity: .45;
	cursor: not-allowed;
}

.ma-volba__text {
	display: flex;
	flex-direction: column;
	gap: .125rem;
	min-width: 0;
}

.ma-volba__nazev {
	font-weight: 700;
}

.ma-volba__popis {
	color: var(--muted);
	font-size: .78125rem;
	line-height: 1.4;
}

.ma-volba__cena {
	font-weight: 700;
	white-space: nowrap;
}

/* Karta dopravy s výběrem výdejního místa (Zásilkovna s widgetem): volba + řádek s místem a tlačítkem. */
.ma-volba-obal {
	border-radius: var(--r);
	background: var(--sand);
	transition: box-shadow .15s, background-color .15s;
}

.ma-volba-obal:has(input:checked) {
	background: var(--white);
	box-shadow: inset 0 0 0 1.5px var(--ink);
}

.ma-volba-obal .ma-volba,
.ma-volba-obal .ma-volba:has(input:checked) {
	background: transparent;
	box-shadow: none;
}

.ma-volba__misto {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem .75rem;
	align-items: center;
	padding: 0 .875rem .875rem 2.75rem;
	font-size: .84375rem;
}

.ma-volba__misto-text {
	flex: 1 1 12rem;
	min-width: 0;
	color: var(--muted);
}

.ma-volba__misto-text.is-vybrano {
	color: var(--ink);
	font-weight: 600;
}

.ma-volba__misto .ma-pole__chyba {
	flex-basis: 100%;
}

.ma-kosik__misto,
.ma-kosik__adresa {
	display: flex;
	flex-direction: column;
	gap: .625rem;
}

.ma-kosik__mesto {
	display: grid;
	grid-template-columns: 7rem minmax(0, 1fr);
	gap: .625rem;
}

.ma-pole__napoveda {
	color: var(--muted);
	font-size: .78125rem;
}

.ma-pole__napoveda a {
	text-decoration: underline;
}

.ma-kosik__rekapitulace {
	display: flex;
	flex-direction: column;
	gap: .375rem;
	padding: 1rem 0 .25rem;
	border-top: 1px solid var(--line);
	font-size: .875rem;
}

.ma-kosik__rekapitulace div {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
}

.ma-kosik__rekapitulace dt {
	color: var(--muted);
}

.ma-kosik__rekapitulace .ma-kosik__celkem {
	align-items: baseline;
	margin-top: .25rem;
	font-size: .9375rem;
	font-weight: 700;
}

.ma-kosik__rekapitulace .ma-kosik__celkem dt {
	color: var(--ink);
}

.ma-kosik__rekapitulace .ma-kosik__celkem dd {
	font-family: var(--font-nadpis);
	font-size: 1.625rem;
	font-weight: 800;
}

@media (max-width: 47.99rem) {
	.ma-kosik-tlacitko:has(.ma-kosik-tlacitko__pocet[hidden]) {
		padding-right: .875rem;
	}
}

/* ------------------------------------------------------------------ Mobilní menu (panel zprava přes celou obrazovku) */

.ma-menu {
	width: min(100vw, 28rem);
	max-width: none;
	height: 100dvh;
	max-height: none;
	margin: 0 0 0 auto;
	padding: 0;
	border: 0;
	background: var(--bg);
	color: var(--ink);
}

.ma-menu[open] {
	display: flex;
	flex-direction: column;
	animation: ma-menu-vyjet .25s ease-out;
}

/* Po otevření má focus celý panel (autofocus), ne logo; obrys by orámoval celou obrazovku. */
.ma-menu:focus {
	outline: none;
}

.ma-menu::backdrop {
	background: rgba(18, 51, 43, .55);
}

@keyframes ma-menu-vyjet {
	from {
		transform: translateX(100%);
	}
}

.ma-menu__hlavicka {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
	padding: 1rem var(--okraj);
	border-bottom: 1px solid var(--sand-3);
}

/* Logo vlevo, křížek vpravo (mobilní pravidlo hlavičky dává logu order: 1). */
.ma-menu__hlavicka .ma-logo {
	order: 0;
	flex: none;
}

.ma-menu__hlavicka [data-ma-menu-zavrit] {
	order: 1;
	margin-left: auto;
}

.ma-menu__hledani {
	padding: 1rem var(--okraj) .25rem;
}

.ma-menu__hledani:empty {
	display: none;
}

.ma-menu .ma-hledani {
	max-width: none;
	height: 3rem;
	padding-left: 1rem;
}

.ma-menu__nav {
	flex: 1;
	overflow-y: auto;
	overscroll-behavior: contain;
	padding: .5rem var(--okraj) 1.5rem;
}

.ma-menu__druhy a {
	display: flex;
	justify-content: space-between;
	align-items: center;
	min-height: 3.25rem;
	border-bottom: 1px solid var(--sand-3);
	color: var(--ink);
	font-family: var(--font-nadpis);
	font-size: 1.25rem;
	font-weight: 800;
	letter-spacing: -.02em;
}

.ma-menu__druhy a[aria-current] {
	color: var(--accent-text);
}

.ma-menu__druhy span {
	padding: .1875rem .5rem;
	border-radius: var(--r-pill);
	background: var(--sand);
	font-family: var(--font-text);
	font-size: .75rem;
	font-weight: 700;
	letter-spacing: 0;
}

.ma-menu__odkazy {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 1rem;
	margin-top: 1rem;
}

.ma-menu__odkazy a {
	display: flex;
	align-items: center;
	min-height: 2.75rem;
	color: var(--ink);
	font-weight: 600;
}

.ma-menu__kontakty {
	display: flex;
	flex-direction: column;
	gap: .25rem;
	padding: 1rem var(--okraj) calc(1.5rem + env(safe-area-inset-bottom, 0px));
	background: var(--ink);
}

.ma-menu__kontakty a {
	display: flex;
	align-items: center;
	gap: .75rem;
	min-height: 2.75rem;
	color: var(--white);
	font-weight: 600;
}

.ma-menu__kontakty .ma-ikona {
	color: var(--accent-on-dark);
	font-size: 1.25rem;
}