/*
 * Redesign "Návrh 3" (P08a) – loaded on every page while the switch HST_RESKIN is on (includes/reskin.php).
 * Design tokens, buttons and focus, promo bar, header (Kadence Blocks header "Hlavička – Návrh 3"), footer
 * (Kadence Element "Pätička – Návrh 3"), golden thread pieces used by the footer. Template: design/navrh3/.
 * The rest of the components and the sections of the new home page: reskin-page.css.
 */

:root {
	/* Colours (README "Farby"). */
	--hst-ink: #16110f;
	--hst-ink-deep: #0e0a09;
	--hst-ink-card: #1d1716;
	--hst-photo-bg: #2a201d;
	--hst-oxblood: #5e0b14;
	--hst-oxblood-deep: #3a070c;
	--hst-bone: #efe6da;
	--hst-concrete: #d9d6d1;
	--hst-thread: #b8954f;
	--hst-on-dark: #d8cdc2;
	--hst-on-dark-2: #cfc3b6;
	--hst-on-dark-3: #c4b7a9;
	--hst-on-light: #54473f;
	--hst-on-light-2: #4d423b;
	--hst-on-oxblood: #f0dcd6;
	/* Type. */
	--hst-serif: "Bodoni Moda", Georgia, serif;
	--hst-sans: Archivo, system-ui, sans-serif;
	--hst-narrow: 87.5%;
	/* Layout. */
	--hst-content: 1360px;
	--hst-gutter: clamp(20px, 4vw, 56px);
	--hst-radius: 3px;
	/* Focus ring: gold on dark areas, ink on light ones (gold on bone is only 2.3 : 1). */
	--hst-focus: var(--hst-ink);
}

/* ---- Base ------------------------------------------------------------------------------------------------------- */
.hst-reskin :focus-visible {
	outline: 2px solid var(--hst-focus);
	outline-offset: 3px;
}

/* Anchor targets (#napis-nam, #cely-look, #kusky, #novinky …): the theme scrolls to them and focuses them by script
   (tabindex="-1") – on arrival from a link without a ring; with the keyboard (html.hst-kbd, reskin-home.js) it stays
   (P09k, bod 4). Controls and dialogs are not affected. */
html:not(.hst-kbd) .hst-reskin [tabindex="-1"]:focus-visible:not(a, button, input, select, textarea, summary, dialog, [role="dialog"]) {
	outline: none;
}

/* A dialog of the redesign opened by a tap or a click holds the focus itself (reskin-home.js, P10d) – no ring around
   the whole panel; its controls keep theirs. */
.hst-reskin dialog[class*="hst-"]:focus {
	outline: none;
}

.hst-reskin .wp-block-kadence-header,
.hst-reskin .hst-footer,
.hst-reskin .hst-on-dark {
	--hst-focus: var(--hst-thread);
}

/* Buttons and menus use the narrow width of Archivo (README "Písmo"). */
.hst-reskin .button,
.hst-reskin button,
.hst-reskin input[type="submit"],
.hst-reskin .wp-element-button,
.hst-reskin .kb-button,
.hst-reskin .kb-nav-link-content {
	font-stretch: var(--hst-narrow);
}

/* ---- Promo bar (top row of the header): oxblood with two golden stitches ----------------------------------------- */
.hst-reskin .hst-promo {
	position: relative;
	color: var(--hst-bone);
}

.hst-reskin .hst-promo::before,
.hst-reskin .hst-promo::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	border-top: 1.5px dashed rgba(184, 149, 79, 0.75);
	pointer-events: none;
}

.hst-reskin .hst-promo::before {
	top: 4px;
}

.hst-reskin .hst-promo::after {
	bottom: 4px;
}

.hst-reskin .hst-promo .hst-promo__text {
	margin: 0;
	padding: 11px 0;
	text-align: center;
	color: var(--hst-bone);
	font-size: 14px;
	font-weight: 500;
	font-stretch: var(--hst-narrow);
	line-height: 1.45;
	letter-spacing: 0.01em;
}

/* ---- Header -------------------------------------------------------------------------------------------------------- */
.hst-reskin .hst-header-main {
	border-bottom: 1px solid rgba(239, 230, 218, 0.1);
	color: var(--hst-bone);
}

.hst-reskin .hst-header-main .wp-block-site-logo img,
.hst-reskin .hst-header-main .custom-logo {
	width: auto !important;
	height: 22px;
}

.hst-reskin .hst-header-main .kb-nav-link-content {
	font-size: 16px;
	font-weight: 500;
}

/* Current page in the menu: golden underline 2 px, 9 px below the text (P09a; aria-current: includes/reskin.php). */
.hst-reskin :is(.hst-header-main, .hst-offcanvas) .current-menu-item > .kb-link-wrap > .kb-nav-link-content {
	text-decoration: underline;
	text-decoration-color: var(--hst-thread);
	text-decoration-thickness: 2px;
	text-underline-offset: 9px;
}

/* Icons (search, account, cart): 44 px targets, bone. */
.hst-reskin .hst-header-main .kb-search .kb-button,
.hst-reskin .hst-header-main .wc-block-customer-account a,
.hst-reskin .hst-header-main .wc-block-mini-cart__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: 0;
	color: var(--hst-bone);
}

/* "Only icon" in Kadence hides the text with display: none – the search button then has no accessible name.
   The text stays for screen readers (and TranslatePress translates it as text), only visually hidden. */
.hst-reskin .hst-header-main .kb-search .kb-button .kt-btn-inner-text {
	display: block !important;
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

.hst-reskin .hst-header-main .wc-block-customer-account svg,
.hst-reskin .hst-header-main .wc-block-mini-cart__icon {
	width: 22px;
	height: 22px;
}

/* Logged in: the circle with the initials (the avatar of Môj účet, P09k bod 17) in the 44 px target.
   The ring is a border (whole device pixels – a box-shadow of 1.5 px was uneven at 125 / 150 % zoom); the box keeps
   its size on hover (border-box), the initials stay in the middle. The inner span is trimmed to the cap height
   (text-box), so the flex centring centres the letters themselves, not the line box of Bodoni. */
.hst-reskin .hst-head-avatar {
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 30px;
	height: 30px;
	border: 1px solid rgba(239, 230, 218, 0.35);
	border-radius: 50%;
	background: var(--hst-oxblood);
	color: var(--hst-bone);
	font-family: var(--hst-serif);
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	text-decoration: none;
	transition: border-color 0.15s ease;
}

.hst-reskin .hst-head-avatar__i {
	display: block;
	letter-spacing: 0.02em;
	margin-right: -0.02em;
	text-box: trim-both cap alphabetic;
}

.hst-reskin .hst-header-main .wc-block-customer-account__link,
.hst-reskin .hst-header-main .wc-block-customer-account__link:hover,
.hst-reskin .hst-header-main .wc-block-customer-account__link:focus {
	text-decoration: none;
}

.hst-reskin .wc-block-customer-account__link:hover .hst-head-avatar {
	border-width: 2px;
	border-color: var(--hst-thread);
}

/* Cart badge: bone with an ink number (site.css sets white/black with !important – more specific here). */
.hst-reskin .hst-header-main .wc-block-mini-cart__badge {
	background-color: var(--hst-bone) !important;
	color: var(--hst-ink) !important;
	font-weight: 700;
}

/* Mini-cart (WooCommerce 11): the closed drawer is only transparent and moved aside (aria-hidden), its links stayed
   in the Tab order. Hidden for the keyboard and screen readers too; the delay keeps the 0.3 s slide-out. */
.hst-reskin .wc-block-components-drawer__screen-overlay--is-hidden {
	visibility: hidden;
	transition: opacity 0.3s, visibility 0s linear 0.3s;
}

/* Language switcher: only "EN" (the other language), muted bone. */
.hst-reskin .hst-header-main .hst-lang--compact {
	margin: 0 2px 0 0;
	font-size: 14px;
	font-weight: 600;
	font-stretch: var(--hst-narrow);
	color: var(--hst-on-dark-3);
}

.hst-reskin .hst-header-main .hst-lang--compact .hst-lang__item {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 10px;
	opacity: 1;
}

.hst-reskin .hst-header-main .hst-lang--compact a.hst-lang__item:hover {
	color: var(--hst-bone);
}

/* Off-canvas menu (tablet / phone). */
.hst-reskin .hst-offcanvas .kb-nav-link-content {
	font-family: var(--hst-serif);
	font-size: 24px;
	font-weight: 600;
	font-stretch: normal;
}

.hst-reskin .hst-offcanvas__links {
	margin: 28px 0 0;
	font-size: 15px;
	line-height: 2;
}

.hst-reskin .hst-offcanvas__links a {
	color: var(--hst-on-dark-3);
}

@media (max-width: 767px) {
	.hst-reskin .hst-promo .hst-promo__text {
		font-size: 13px;
	}

	.hst-reskin .hst-header-main .wp-block-site-logo img,
	.hst-reskin .hst-header-main .custom-logo {
		height: 18px;
	}

	.hst-reskin .hst-header-main .hst-lang--compact {
		font-size: 13px;
	}

	.hst-reskin .hst-header-main .hst-lang--compact .hst-lang__item {
		padding: 0 8px;
	}
}

/* ---- Golden thread pieces shared with the footer (the rest is in reskin-page.css) -------------------------------- */
.hst-reskin .hst-seam-straight {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 24px;
	z-index: 2;
	display: block;
	color: var(--hst-thread);
	pointer-events: none;
}

.hst-reskin .hst-knot {
	position: absolute;
	width: 10px;
	height: 10px;
	margin: -5px 0 0 -5px;
	border-radius: 50%;
	background: var(--hst-thread);
	z-index: 3;
	pointer-events: none;
}

.hst-reskin .hst-knot--end {
	left: 3%;
	top: 12px;
}

.hst-reskin .hst-knot--start {
	left: 97%;
	top: 12px;
}

/* Pages built entirely from the redesign sections: the theme's old page background (pattern image) is never seen –
   overriding it also stops its download (P09a, includes/reskin.php). */
body.hst-reskin.hst-covered {
	background-image: none;
}

/* ---- Short pages (P09l bod 1): the page fills the window, the footer is at its bottom ------------------------------
   Kadence makes #wrapper a column of min-height 100vh and lets #inner-wrap grow – but the sections inside did not
   grow, so between the last one and the footer the light background of #wrapper showed. The column goes on down the
   wrappers of the theme (none has a padding or margin) to the container of the sections, and the last section grows
   in its own colour (any colour, no list of pages). The top-level sections have no vertical margins, so the flex
   column changes nothing on long pages (nothing to grow). dvh = the visible window on phones (with the browser bars),
   vh is the fallback; the keyboard does not change it. The seam above the footer belongs to the footer and stays. */
body.hst-reskin #wrapper {
	min-height: 100vh;
	min-height: 100dvh;
}

body.hst-reskin.admin-bar #wrapper {
	min-height: calc(100vh - var(--wp-admin--admin-bar--height, 32px));
	min-height: calc(100dvh - var(--wp-admin--admin-bar--height, 32px));
}

body.hst-reskin #inner-wrap,
body.hst-reskin #inner-wrap > #primary,
body.hst-reskin #primary > .content-container,
body.hst-reskin #primary > .content-container > #main,
body.hst-reskin #primary #main > .content-wrap,
body.hst-reskin #primary .content-wrap > article.entry,
body.hst-reskin #primary article.entry > .entry-content-wrap {
	display: flex;
	flex-direction: column;
}

body.hst-reskin #inner-wrap > :is(#primary, .site-main),
body.hst-reskin #primary > .content-container,
body.hst-reskin #primary > .content-container > #main,
body.hst-reskin #primary #main > .content-wrap,
body.hst-reskin #primary .content-wrap > article.entry,
body.hst-reskin #primary article.entry > .entry-content-wrap,
body.hst-reskin #primary .entry-content-wrap > .entry-content {
	flex: 1 0 auto;
	width: 100%;
}

/* Containers of the sections: the content of a page, a shortcode of WooCommerce (Môj účet, košík …) and the own
   templates of the redesign (obchod, produkt, blog, 404 – main.site-main right in #inner-wrap). */
body.hst-reskin #primary .entry-content-wrap > .entry-content,
body.hst-reskin #primary .entry-content > .woocommerce:only-of-type,
body.hst-reskin #inner-wrap > .site-main {
	display: flex;
	flex-direction: column;
}

body.hst-reskin :is(#primary .entry-content-wrap > .entry-content, #primary .entry-content > .woocommerce:only-of-type, #inner-wrap > .site-main) > :nth-last-child(1 of :not(script, style, link, template, dialog, [hidden])) {
	flex-grow: 1;
}

/* Thread switched off (Customizer): wins over the display rules of reskin-page.css. */
.hst-thread-off :is(.hst-seam__stitch, .hst-thread, .hst-knot, .hst-page-hero__stitch) {
	display: none !important;
}

/* ---- Footer ------------------------------------------------------------------------------------------------------- */
.hst-reskin .hst-footer {
	position: relative;
	margin: 0;
	background: var(--hst-ink-deep);
	color: var(--hst-on-dark-3);
	font-family: var(--hst-sans);
	font-size: 14px;
	line-height: 1.6;
}

.hst-reskin .hst-footer p {
	margin: 0;
}

.hst-reskin .hst-footer a {
	color: var(--hst-on-dark-3);
	text-decoration: none;
}

.hst-reskin .hst-footer a:hover {
	color: var(--hst-bone);
	text-decoration: underline;
	text-underline-offset: 4px;
}

/* Kadence (a classic theme) wraps the content of a group block in .wp-block-group__inner-container – the layout goes
   on that wrapper, or on the group itself when there is none. */
.hst-reskin .hst-footer__grid {
	box-sizing: border-box;
	max-width: var(--hst-content);
	margin: 0 auto;
	padding: 56px var(--hst-gutter) 28px;
}

.hst-reskin .hst-footer__grid > .wp-block-group__inner-container,
.hst-reskin .hst-footer__grid:not(:has(> .wp-block-group__inner-container)) {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr));
	gap: 36px;
}

.hst-reskin .hst-footer__brand > .wp-block-group__inner-container,
.hst-reskin .hst-footer__brand:not(:has(> .wp-block-group__inner-container)) {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 16px;
}

.hst-reskin .hst-footer__crest {
	margin: 0;
}

.hst-reskin .hst-footer__crest img {
	display: block;
	width: 58px;
	height: auto;
}

.hst-reskin .hst-footer .hst-footer__ig a {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 6px 0;
	color: var(--hst-bone);
	text-decoration: underline;
	text-underline-offset: 4px;
}

/* Line icon of Instagram (P09k, bod 16 – includes/reskin.php). */
.hst-reskin .hst-footer .hst-footer__igicon {
	flex: none;
	color: var(--hst-thread);
}

/* "Made with ☕ and ❤️" instead of the VAT sentence (it stays in the imprint and the terms): small line icons, the
   heart in the accent colour. */
.hst-reskin .hst-footer .hst-made {
	margin: 0;
}

.hst-reskin .hst-made__text {
	display: inline-flex;
	align-items: center;
	gap: 5px;
}

.hst-reskin .hst-made__ico {
	flex: none;
	color: var(--hst-bone);
}

.hst-reskin .hst-made__ico--heart {
	color: var(--hst-thread);
}

.hst-reskin .hst-footer .hst-footer__title {
	margin: 0 0 12px;
	color: var(--hst-bone);
	font-family: var(--hst-sans);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0;
}

.hst-reskin .hst-footer__links {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.hst-reskin .hst-footer__links li {
	margin: 0;
}

.hst-reskin .hst-footer__links a {
	display: inline-block;
	padding: 3px 0;
}

/* "Nastavenia cookies" (P09j, includes/reskin-consent.php): the button of Complianz that reopens its banner, in the
   look of the links; without JavaScript Complianz shows no banner – the button is hidden. */
.hst-reskin .hst-footer .hst-footer__consent-btn {
	display: inline-block;
	margin: 0;
	padding: 3px 0;
	border: 0;
	border-radius: 0;
	background: none;
	color: var(--hst-on-dark-3);
	font: inherit;
	font-stretch: normal;
	line-height: inherit;
	text-align: left;
	cursor: pointer;
}

.hst-reskin .hst-footer .hst-footer__consent-btn:hover {
	color: var(--hst-bone);
	text-decoration: underline;
	text-underline-offset: 4px;
}

html.no-js .hst-reskin .hst-footer__consent {
	display: none;
}

.hst-reskin .hst-footer__bottom {
	box-sizing: border-box;
	max-width: var(--hst-content);
	margin: 0 auto;
	padding: 18px var(--hst-gutter) 30px;
	border-top: 1px solid rgba(239, 230, 218, 0.1);
	font-size: 13px;
}

.hst-reskin .hst-footer__bottom > .wp-block-group__inner-container,
.hst-reskin .hst-footer__bottom:not(:has(> .wp-block-group__inner-container)) {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 8px 24px;
}

/* Mobile design: the brand on its own row, the link columns two by two. */
@media (max-width: 767px) {
	.hst-reskin .hst-footer__grid > .wp-block-group__inner-container,
	.hst-reskin .hst-footer__grid:not(:has(> .wp-block-group__inner-container)) {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 28px 16px;
	}

	.hst-reskin .hst-footer__brand {
		grid-column: 1 / -1;
	}
}

/* =================================================================================================================
   P09g – header, megamenu, language, search, phone menu (includes/reskin-menu.php, design/menu/README.md)
   ================================================================================================================= */

:root {
	--hst-header-h: 76px;
}

@media (max-width: 1024px) {
	:root {
		--hst-header-h: 60px;
	}
}

/* Anchors (#kusky, #napis-nam, contents of a post) clear the sticky row. */
html:has(> body.hst-reskin) {
	scroll-padding-top: calc(var(--hst-header-h) + 20px);
}

/* ---- Sticky header (P09k, bod 20) --------------------------------------------------------------------------------- */
/* position: sticky instead of the script of Kadence (its sticky options are off – migration 2026-10-27-reskin-polish-pc):
   the header is in its place right after the load, after a reload of a scrolled page and with the delayed JavaScript
   of WP Rocket; the promo strip scrolls away (--hst-promo-h, measured by reskin-home.js; without it 42 / 60 px). */
:root {
	--hst-promo-h: 42px;
}

@media (max-width: 599px) {
	:root {
		--hst-promo-h: 60px;
	}
}

.hst-reskin header.wp-block-kadence-header.hst-sticky-css {
	position: sticky;
	top: calc(var(--wp-admin--admin-bar--height, 0px) - var(--hst-promo-h));
	z-index: 100;
}

/* The admin bar scrolls away on phones (absolute in WordPress). */
@media (max-width: 600px) {
	.hst-reskin header.wp-block-kadence-header.hst-sticky-css {
		top: calc(-1 * var(--hst-promo-h));
	}
}

/* Stuck (reskin-home.js – hst-is-stuck once the promo strip is gone): the dark under-layer of the header goes, so the
   glass of the row (::before) blurs the page under it. The sticky header carries its container along – with the ink
   background the glass blurred only that (the script of Kadence used to fix the row alone). At the top of the page
   and without the script the row stays on ink as before. */
.hst-reskin header.hst-sticky-css.hst-is-stuck .kb-header-container {
	background: transparent;
}

/* ---- Glass of the main row ------------------------------------------------------------------------------------ */
/* The row is transparent, the frosted layer is its ::before: a backdrop-filter (or opacity, filter …) on the row would
   make the row the Backdrop Root of the panels, which then could not blur the page under them (README §1). */
.hst-reskin .wp-block-kadence-header .kb-header-container {
	background: var(--hst-ink);
}

.hst-reskin .hst-header-main {
	--kb-header-row-bg: transparent;
	--kb-stuck-header-bg: transparent;
	position: relative;
	z-index: 0;
	border-bottom: 0;
	background: transparent !important;
}

.hst-reskin .hst-header-main::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	border-bottom: 1px solid rgba(239, 230, 218, 0.12);
	background: rgba(22, 17, 15, 0.78);
	-webkit-backdrop-filter: blur(18px) saturate(1.35);
	backdrop-filter: blur(18px) saturate(1.35);
	pointer-events: none;
}

.hst-reskin .hst-header-main:has(.hst-nav__item.is-open, .hst-search[open], .hst-langs--dropdown[open])::before {
	background: rgba(22, 17, 15, 0.88);
}

/* The page under an open panel or the search darkens; a click on it closes them (reskin-home.js). */
.hst-reskin .hst-header-main::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	z-index: 1;
	display: none;
	height: 100vh;
	background: rgba(14, 10, 9, 0.5);
}

.hst-reskin .hst-header-main:has(.hst-nav__item.is-open, .hst-search[open])::after {
	display: block;
}

@media (hover: hover) {
	.hst-reskin .hst-header-main:has(.hst-nav:not([data-hst-js]) .hst-nav__item--mega:hover)::after {
		display: block;
	}
}

/* Row: logo | menu (and the language and the lupa at its end) | account, cart. */
.hst-reskin .wp-block-kadence-header-row.hst-header-main .kadence-header-row-inner {
	grid-template-columns: auto minmax(0, 1fr) auto;
	column-gap: 0;
	max-width: var(--hst-content);
	min-height: var(--hst-header-h);
	padding: 0 var(--hst-gutter);
}

.hst-reskin .hst-header-main .wp-block-kadence-header-column-center {
	justify-content: flex-start;
	gap: 2px;
	min-width: 0;
}

/* 32 px after the logo; the icons (language, lupa | account, cart) stay one group with 2 px gaps. */
.hst-reskin .hst-header-main .kadence-header-row-inner > .wp-block-kadence-header-section:first-child {
	margin-right: clamp(18px, 2.2vw, 32px);
}

.hst-reskin .hst-header-main .wp-block-kadence-header-column-center + .wp-block-kadence-header-section {
	margin-left: 2px;
}

.hst-reskin .hst-header-main .wp-block-kadence-header-column-right,
.hst-reskin .hst-header-main .wp-block-kadence-header-column-tablet-right {
	gap: 2px;
}

/* Buttons of the header without the theme's button look. */
.hst-reskin :is(.hst-nav__toggle, .hst-search__close, .hst-sfield__clear, .hst-drawer__open, .hst-drawer__close, .hst-acc__toggle, .hst-pill) {
	margin: 0;
	border-radius: 0;
	background: none;
	box-shadow: none;
	color: var(--hst-bone);
	font-family: var(--hst-sans);
	line-height: 1.2;
	text-transform: none;
	letter-spacing: 0;
	cursor: pointer;
}

.hst-reskin :is(.hst-search__toggle, .hst-langs__toggle) {
	list-style: none;
	cursor: pointer;
}

.hst-reskin :is(.hst-search__toggle, .hst-langs__toggle)::-webkit-details-marker {
	display: none;
}

/* ---- Desktop menu ---------------------------------------------------------------------------------------------- */
.hst-reskin .hst-nav {
	min-width: 0;
	margin: 0 auto;
}

.hst-reskin .hst-nav__list {
	display: flex;
	align-items: center;
	/* 26 px at 1440, 12 px at 1025 – the menu fits with Unisex and the language (measured at 1025, 1100, 1280). */
	gap: 0 clamp(12px, calc(3.4vw - 23px), 26px);
	margin: 0;
	padding: 0;
	list-style: none;
}

.hst-reskin .hst-nav__item {
	display: flex;
	align-items: center;
	height: var(--hst-header-h);
	margin: 0;
}

.hst-reskin .hst-nav__link {
	position: relative;
	display: block;
	padding: 12px 0;
	color: var(--hst-bone);
	font-size: 16px;
	font-weight: 500;
	font-stretch: var(--hst-narrow);
	line-height: 1.4;
	text-decoration: none;
	white-space: nowrap;
}

.hst-reskin .hst-nav__link:hover {
	color: #fff;
}

/* Current section: golden underline (aria-current). With an open panel the open item is underlined in bone. */
.hst-reskin .hst-nav__link::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 4px;
	border-top: 2px solid var(--hst-thread);
	opacity: 0;
}

.hst-reskin .hst-nav__item.is-current > .hst-nav__link::after {
	opacity: 1;
}

.hst-reskin .hst-nav:has(.hst-nav__item.is-open) .hst-nav__item:not(.is-open) > .hst-nav__link::after {
	opacity: 0;
}

.hst-reskin .hst-nav .hst-nav__item.is-open > .hst-nav__link::after {
	border-top-color: var(--hst-bone);
	opacity: 1;
}

.hst-reskin .hst-nav__toggle {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 44px;
	padding: 0;
	border: 0;
	color: var(--hst-on-dark-3);
}

.hst-reskin .hst-nav__toggle:hover {
	color: var(--hst-bone);
}

.hst-reskin .hst-nav__toggle svg,
.hst-reskin .hst-acc__toggle svg,
.hst-reskin .hst-langs__arrow {
	transition: transform 0.2s ease;
}

.hst-reskin .hst-nav__item.is-open .hst-nav__toggle svg {
	transform: rotate(180deg);
}

/* ---- Panels (megamenu) ------------------------------------------------------------------------------------------- */
.hst-reskin .hst-mega {
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	z-index: 2;
	display: none;
	background: rgba(22, 17, 15, 0.88);
	-webkit-backdrop-filter: blur(26px) saturate(1.25);
	backdrop-filter: blur(26px) saturate(1.25);
	box-shadow: 0 34px 60px -24px rgba(0, 0, 0, 0.7);
	color: var(--hst-bone);
	text-align: left;
	cursor: default;
}

.hst-reskin .hst-nav[data-hst-js] .hst-nav__item.is-open > .hst-mega {
	display: block;
}

/* Without the script (also while WP Rocket delays it): the panel on hover, the keyboard opens it by focus. */
@media (hover: hover) {
	.hst-reskin .hst-nav:not([data-hst-js]) .hst-nav__item--mega:hover > .hst-mega {
		display: block;
	}
}

.hst-reskin .hst-nav:not([data-hst-js]) .hst-nav__item--mega:focus-within > .hst-mega {
	display: block;
}

@media (prefers-reduced-motion: no-preference) {
	.hst-reskin .hst-mega,
	.hst-reskin .hst-sres--d,
	.hst-reskin .hst-langs--dropdown[open] .hst-langs__panel {
		animation: hst-drop-in 0.18s ease-out;
	}
}

/* With the script (P09k, bod 6): one glass under all the panels (.hst-mega-glass, reskin-home.js) – the panels are
   transparent; from one panel to the next the glass stays, the content fades (150 ms) and the glass changes its
   height (200 ms). The first opening drops in as before. */
.hst-reskin .hst-mega-glass {
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	z-index: 2;
	display: none;
	height: 0;
	background: rgba(22, 17, 15, 0.88);
	-webkit-backdrop-filter: blur(26px) saturate(1.25);
	backdrop-filter: blur(26px) saturate(1.25);
	box-shadow: 0 34px 60px -24px rgba(0, 0, 0, 0.7);
	pointer-events: none;
}

.hst-reskin .hst-mega-glass.is-on {
	display: block;
}

.hst-reskin .hst-nav[data-hst-js] .hst-mega {
	z-index: 3;
	background: transparent;
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
	box-shadow: none;
}

.hst-reskin .hst-nav[data-hst-js] .hst-nav__item.is-leaving > .hst-mega {
	display: block;
	opacity: 0;
	pointer-events: none;
}

@media (prefers-reduced-motion: no-preference) {
	.hst-reskin .hst-mega-glass.is-on:not(.is-swap) {
		animation: hst-drop-in 0.18s ease-out;
	}

	.hst-reskin .hst-mega-glass.is-swap {
		transition: height 0.2s ease;
	}

	.hst-reskin .hst-nav[data-hst-js] .hst-mega {
		animation: hst-fade-in 0.15s ease-out;
	}

	.hst-reskin .hst-nav[data-hst-js] .hst-nav__item:not(.is-swap) > .hst-mega {
		animation: hst-drop-in 0.18s ease-out;
	}

	.hst-reskin .hst-nav[data-hst-js] .hst-nav__item.is-leaving > .hst-mega {
		transition: opacity 0.15s ease-out;
	}
}

@keyframes hst-fade-in {
	from {
		opacity: 0;
	}
}

/* A browser without backdrop-filter: the full background on the glass too. */
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
	.hst-reskin .hst-mega-glass {
		background: rgba(22, 17, 15, 0.96);
	}
}

@keyframes hst-drop-in {
	from {
		opacity: 0;
		transform: translateY(-6px);
	}
}

.hst-reskin .hst-mega__inner {
	max-width: var(--hst-content);
	margin: 0 auto;
	padding: 32px var(--hst-gutter) 54px;
}

.hst-reskin .hst-mega__head {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px 48px;
	padding-bottom: 22px;
	border-bottom: 1px dashed rgba(239, 230, 218, 0.2);
}

.hst-reskin .hst-mega__intro {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 8px 28px;
}

.hst-reskin .hst-mega__title {
	margin: 0;
	color: var(--hst-bone);
	font-family: var(--hst-serif);
	font-size: 44px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: -0.015em;
}

.hst-reskin .hst-mega__text {
	max-width: 40em;
	margin: 0;
	color: var(--hst-on-dark);
	font-size: 15px;
	line-height: 1.55;
}

.hst-reskin .hst-mega__links {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 26px;
}

.hst-reskin :is(.hst-mega__all, .hst-sres__all, .hst-drawer__alllink) {
	padding: 6px 0;
	color: var(--hst-bone);
	font-size: 15px;
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 5px;
}

.hst-reskin :is(.hst-mega__n, .hst-drawer__n) {
	color: var(--hst-on-dark-3);
	font-weight: 500;
}

.hst-reskin .hst-mega__grid {
	display: grid;
	gap: 32px;
	align-items: start;
	margin-top: 28px;
}

.hst-reskin .hst-mega__grid--cat {
	gap: 24px;
}

.hst-reskin :is(.hst-mega__rule, .hst-sres__rule) {
	align-self: stretch;
	border-left: 1px dashed rgba(239, 230, 218, 0.2);
}

.hst-reskin .hst-mega a:hover,
.hst-reskin .hst-drawer a:hover,
.hst-reskin .hst-sres a:hover {
	color: #fff;
}

/* Columns of the shop panel. */
.hst-reskin .hst-mega__coltitle {
	display: inline-block;
	color: var(--hst-bone);
	font-family: var(--hst-serif);
	font-size: 28px;
	font-weight: 600;
	line-height: 1.1;
	text-decoration: none;
}

.hst-reskin .hst-mega__note {
	margin: 6px 0 0;
	color: var(--hst-on-dark-3);
	font-size: 14px;
}

.hst-reskin .hst-mega__rows {
	margin: 14px 0 0;
	padding: 0;
	border-top: 1px dashed rgba(239, 230, 218, 0.18);
	list-style: none;
}

.hst-reskin .hst-mega__rows > li {
	margin: 0;
	border-bottom: 1px dashed rgba(239, 230, 218, 0.18);
}

.hst-reskin .hst-mega__row {
	display: block;
	padding: 11px 0;
	color: var(--hst-bone);
	font-size: 16px;
	font-weight: 500;
	text-decoration: none;
}

/* Golden rail of the next level (Postroje → Vrchné diely, Spodné diely …). */
.hst-reskin .hst-rail {
	margin: -2px 0 12px 2px;
	padding: 0;
	border-left: 1.5px dashed rgba(184, 149, 79, 0.75);
	list-style: none;
}

.hst-reskin .hst-rail li {
	margin: 0;
}

.hst-reskin .hst-rail__link {
	display: block;
	padding: 5px 0 5px 14px;
	color: var(--hst-on-dark);
	font-size: 15px;
	line-height: 1.5;
	text-decoration: none;
}

.hst-reskin .hst-mcard .hst-rail {
	margin: 10px 0 0 2px;
}

/* Category and piece cards. */
.hst-reskin :is(.hst-mcard__media, .hst-mprod__img) {
	position: relative;
	display: block;
	height: 240px;
	overflow: hidden;
	border-radius: 4px;
	background: var(--hst-photo-bg);
}

.hst-reskin .hst-mcard__media::after,
.hst-reskin .hst-dcard__media::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 3px;
	background: var(--hst-oxblood);
}

.hst-reskin :is(.hst-mega__img, .hst-tile__img, .hst-dcard__img, .hst-sres__thumb img, .hst-sres__img img, .hst-sres__rimg img) {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: var(--hst-pos, 50% 50%);
}

.hst-reskin .hst-mcard__name {
	display: inline-block;
	margin-top: 14px;
	color: var(--hst-bone);
	font-family: var(--hst-serif);
	font-size: 25px;
	font-weight: 600;
	line-height: 1.1;
	text-decoration: none;
}

.hst-reskin :is(.hst-mprod__media, .hst-sres__media) {
	position: relative;
}

.hst-reskin .hst-mprod__pill {
	position: absolute;
	left: 12px;
	top: 12px;
	padding: 4px 11px;
	border-radius: 999px;
	background: rgba(239, 230, 218, 0.94);
	color: var(--hst-ink);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.01em;
}

.hst-reskin .wp-block-kadence-header .hst-price-tag {
	position: absolute;
	z-index: 1;
	left: -10px;
	bottom: 18px;
	display: flex;
	align-items: center;
	margin: 0;
	padding: 7px 15px 7px 27px;
	background: var(--hst-oxblood);
	color: var(--hst-bone) !important;
	clip-path: polygon(13px 0, 100% 0, 100% 100%, 13px 100%, 0 50%);
	font-family: var(--hst-serif);
	font-size: 19px !important;
	font-weight: 600;
	line-height: 1.1 !important;
	white-space: nowrap;
}

.hst-reskin .wp-block-kadence-header .hst-price-tag::before {
	content: "";
	position: absolute;
	left: 12px;
	top: 50%;
	width: 7px;
	height: 7px;
	margin-top: -3.5px;
	border-radius: 50%;
	background: var(--hst-bone);
}

.hst-reskin .wp-block-kadence-header .hst-sres .hst-price-tag {
	bottom: 16px;
	padding: 6px 14px 6px 25px;
	clip-path: polygon(12px 0, 100% 0, 100% 100%, 12px 100%, 0 50%);
	font-size: 18px !important;
}

.hst-reskin .hst-mprod__name {
	display: block;
	margin-top: 14px;
	color: var(--hst-bone);
	font-size: 17px;
	font-weight: 600;
	line-height: 1.3;
	text-decoration: none;
}

.hst-reskin :is(.hst-mprod__desc, .hst-sres__desc) {
	margin: 3px 0 0;
	color: var(--hst-on-dark-3);
	font-size: 14px;
	line-height: 1.45;
}

.hst-reskin .hst-mega__more {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 24px;
	margin: 20px 0 0;
	padding: 0;
	list-style: none;
}

.hst-reskin .hst-mega__more-link {
	color: var(--hst-on-dark);
	font-size: 15px;
	text-underline-offset: 4px;
}

/* Promo tile: one link, photo, gradient, golden stitch inside. */
.hst-reskin .hst-tile {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	height: 300px;
	overflow: hidden;
	border-radius: 4px;
	background: var(--hst-photo-bg);
	color: var(--hst-bone);
	text-decoration: none;
}

.hst-reskin .hst-tile__img {
	position: absolute;
	inset: 0;
}

.hst-reskin .hst-tile__shade {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 78%;
	background: linear-gradient(to top, rgba(14, 10, 9, 0.94) 0%, rgba(14, 10, 9, 0.62) 45%, rgba(14, 10, 9, 0) 100%);
}

.hst-reskin .hst-tile__stitch {
	position: absolute;
	inset: 8px;
	border: 1.5px dashed rgba(184, 149, 79, 0.7);
	border-radius: 2px;
}

.hst-reskin .hst-tile__body {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 0 24px 24px;
}

.hst-reskin .hst-tile__title {
	font-family: var(--hst-serif);
	font-size: 27px;
	font-weight: 600;
	line-height: 1.05;
}

.hst-reskin .hst-tile__text {
	color: var(--hst-on-dark);
	font-size: 14px;
	line-height: 1.5;
}

.hst-reskin .hst-tile__cta {
	margin-top: 4px;
	font-size: 15px;
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 5px;
}

/* Hem of the panels: the golden stitch with two knots, 14 px above the bottom (the stitch above the footer). */
.hst-reskin .hst-mega__hem {
	position: absolute;
	left: 3%;
	right: 3%;
	bottom: 15px;
	height: 2px;
	background: repeating-linear-gradient(to right, var(--hst-thread) 0 8px, transparent 8px 14px);
	pointer-events: none;
}

.hst-reskin .hst-mega__knot {
	position: absolute;
	top: -4px;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--hst-thread);
}

.hst-reskin .hst-mega__knot--l {
	left: -5px;
}

.hst-reskin .hst-mega__knot--r {
	right: -5px;
}

.hst-thread-off :is(.hst-mega__hem, .hst-tile__stitch) {
	display: none;
}

/* ---- Language ----------------------------------------------------------------------------------------------------- */
.hst-reskin .hst-flag {
	display: block;
	flex: none;
	border-radius: 2px;
	box-shadow: 0 0 0 1px rgba(239, 230, 218, 0.3);
	object-fit: cover;
}

.hst-reskin .hst-langs--dropdown {
	position: relative;
	flex: none;
}

.hst-reskin .hst-langs__toggle {
	display: flex;
	align-items: center;
	gap: 8px;
	height: 44px;
	padding: 0 10px;
	border-radius: 4px;
	color: var(--hst-bone);
	font-size: 14px;
	font-weight: 600;
	font-stretch: var(--hst-narrow);
}

.hst-reskin .hst-langs__arrow {
	color: var(--hst-on-dark-3);
}

.hst-reskin .hst-langs--dropdown[open] .hst-langs__arrow {
	transform: rotate(180deg);
}

.hst-reskin .hst-langs--dropdown .hst-langs__panel {
	position: absolute;
	right: -6px;
	top: calc(100% + 16px);
	z-index: 3;
	width: 244px;
	padding: 8px;
	border: 1px solid rgba(239, 230, 218, 0.14);
	border-radius: 6px;
	background: rgba(22, 17, 15, 0.9);
	-webkit-backdrop-filter: blur(24px) saturate(1.3);
	backdrop-filter: blur(24px) saturate(1.3);
	box-shadow: 0 26px 50px -18px rgba(0, 0, 0, 0.75);
}

.hst-reskin .hst-langs__items {
	display: flex;
	flex-direction: column;
	gap: 4px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.hst-reskin .hst-langs__items li {
	margin: 0;
}

.hst-reskin .hst-langs__link {
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 48px;
	padding: 0 12px;
	border-radius: 4px;
	color: var(--hst-bone);
	font-size: 15px;
	font-weight: 500;
	text-decoration: none;
}

.hst-reskin .hst-langs__link:hover {
	background: rgba(239, 230, 218, 0.06);
	color: #fff;
}

.hst-reskin .hst-langs__link[aria-current] {
	background: rgba(239, 230, 218, 0.09);
}

.hst-reskin .hst-langs__name {
	flex: 1;
}

.hst-reskin .hst-langs__check {
	color: var(--hst-thread);
	opacity: 0;
}

.hst-reskin .hst-langs__link[aria-current] .hst-langs__check {
	opacity: 1;
}

/* Phone menu: the languages as buttons side by side (without a heading since P09k – the room above it stays). */
.hst-reskin .hst-langs--list {
	margin-top: 28px;
}

.hst-reskin .hst-langs--list .hst-langs__items {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
}

.hst-reskin .hst-langs--list .hst-langs__link {
	gap: 10px;
	min-height: 50px;
	padding: 0 14px;
	border: 1.5px solid rgba(239, 230, 218, 0.22);
}

.hst-reskin .hst-langs--list .hst-langs__link[aria-current] {
	border-color: rgba(239, 230, 218, 0.7);
}

/* ---- Search (desktop) --------------------------------------------------------------------------------------------- */
.hst-reskin .hst-search {
	display: flow-root;
	flex: none;
}

.hst-reskin .hst-search__toggle {
	float: right;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	color: var(--hst-bone);
}

.hst-reskin .hst-search[open] {
	flex: 1 1 auto;
	min-width: 0;
}

.hst-reskin .hst-search[open] .hst-search__toggle {
	margin-top: 3px;
	background: rgba(239, 230, 218, 0.14);
}

/* Search mode: the field instead of the menu and the language. */
.hst-reskin .hst-header-main:has(.hst-search[open]) :is(.hst-nav, .hst-langs--dropdown) {
	display: none;
}

/* The lupa floats right; the box keeps its width + 32 px free (no reliance on the float of the details' content). */
.hst-reskin .hst-search__box {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 0 calc(44px + clamp(18px, 2.2vw, 32px)) 0 8px;
}

.hst-reskin .hst-search__close {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1.5px solid rgba(239, 230, 218, 0.35);
	border-radius: 50%;
}

.hst-reskin .hst-search__close[hidden] {
	display: none;
}

.hst-reskin .hst-sfield {
	position: relative;
	flex: 1;
	min-width: 0;
	margin: 0;
}

.hst-reskin .hst-sfield__icon {
	position: absolute;
	left: 17px;
	top: 15px;
	color: var(--hst-on-dark-3);
	pointer-events: none;
}

.hst-reskin .hst-sfield .hst-sfield__input {
	box-sizing: border-box; /* The theme gives type="search" content-box – the padding would push the field under the lupa. */
	width: 100%;
	height: 50px;
	margin: 0;
	padding: 0 50px; /* Right: room for the small × (clear). */
	border: 1px solid rgba(239, 230, 218, 0.26);
	border-radius: 4px;
	background: rgba(239, 230, 218, 0.08);
	box-shadow: none;
	color: var(--hst-bone);
	font-family: var(--hst-sans);
	font-size: 17px;
	outline: none;
	-webkit-appearance: none;
	appearance: none;
}

.hst-reskin .hst-sfield .hst-sfield__input:focus-visible {
	border-color: rgba(239, 230, 218, 0.6);
	box-shadow: none;
}

.hst-reskin .hst-sfield__input::placeholder {
	color: var(--hst-on-dark-3);
	opacity: 1;
}

.hst-reskin .hst-sfield__input::-webkit-search-cancel-button {
	display: none;
}

/* Panel of the results. */
.hst-reskin .hst-sres--d {
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	z-index: 2;
	padding: 30px max(var(--hst-gutter), calc((100% - var(--hst-content)) / 2 + var(--hst-gutter))) 56px;
	background: rgba(22, 17, 15, 0.88);
	-webkit-backdrop-filter: blur(26px) saturate(1.25);
	backdrop-filter: blur(26px) saturate(1.25);
	box-shadow: 0 34px 60px -24px rgba(0, 0, 0, 0.7);
	color: var(--hst-bone);
	text-align: left;
}

.hst-reskin .hst-sres[hidden],
.hst-reskin .hst-sres [hidden] {
	display: none !important;
}

.hst-reskin .hst-sres--d :is(.hst-sres__empty, .hst-sres__hits) {
	display: grid;
	grid-template-columns: 300px 1px minmax(0, 1fr);
	gap: 32px;
	align-items: start;
}

.hst-reskin .hst-sres__label {
	margin: 0 0 12px;
	color: var(--hst-on-dark-3);
	font-size: 14px;
}

.hst-reskin .hst-sres__label--try {
	margin-top: 28px;
}

.hst-reskin .hst-sres__note {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 22px;
	color: var(--hst-on-dark);
	font-size: 15px;
	line-height: 1.5;
}

.hst-reskin .hst-sres__note::before {
	content: "";
	flex: none;
	width: 18px;
	height: 18px;
	background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b8954f' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v5.5M12 7.6v.2'/%3E%3C/svg%3E") center / contain no-repeat;
}

.hst-reskin .hst-sres__cats {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.hst-reskin .hst-sres li {
	margin: 0;
}

.hst-reskin .hst-sres__cat {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 0 -6px;
	padding: 6px;
	border-radius: 4px;
	color: var(--hst-bone);
	text-decoration: none;
}

.hst-reskin .hst-sres__cat:hover {
	background: rgba(239, 230, 218, 0.06);
}

.hst-reskin .hst-sres__thumb {
	flex: none;
	width: 52px;
	height: 64px;
	overflow: hidden;
	border-radius: 3px;
	background: var(--hst-photo-bg);
}

.hst-reskin .hst-sres__catbody {
	display: flex;
	flex-direction: column;
	gap: 3px;
	line-height: 1.2;
}

.hst-reskin .hst-sres__catname {
	font-family: var(--hst-serif);
	font-size: 21px;
	font-weight: 600;
}

.hst-reskin .hst-sres__catmeta {
	color: var(--hst-on-dark-3);
	font-size: 13px;
}

.hst-reskin .hst-sres mark {
	background: none;
	box-shadow: inset 0 -2px 0 var(--hst-thread);
	color: inherit;
}

.hst-reskin .hst-sres__nocat {
	margin: 0;
	color: var(--hst-on-dark);
	font-size: 14px;
}

.hst-reskin .hst-sres__bar {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 8px 24px;
	margin-bottom: 14px;
}

.hst-reskin .hst-sres__bar .hst-sres__label {
	margin: 0;
}

.hst-reskin .hst-sres__cards {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 20px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.hst-reskin .hst-sres__img {
	display: block;
	height: 236px;
	overflow: hidden;
	border-radius: 4px;
	background: var(--hst-photo-bg);
}

.hst-reskin .hst-sres__name {
	margin: 13px 0 0;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.3;
}

.hst-reskin .hst-sres__name a {
	color: var(--hst-bone);
	text-decoration: none;
}

.hst-reskin .hst-sres__desc {
	font-size: 13px;
}

.hst-reskin .hst-sres--d .hst-sres__none {
	max-width: 680px;
	padding: 8px 0 6px;
}

.hst-reskin .hst-sres__none-title {
	margin: 0;
	font-family: var(--hst-serif);
	font-size: 34px;
	font-weight: 600;
	line-height: 1.1;
}

.hst-reskin .hst-sres__none-text {
	margin: 12px 0 18px;
	color: var(--hst-on-dark);
	font-size: 16px;
	line-height: 1.6;
}

.hst-reskin .hst-sres__custom {
	margin: 24px 0 0;
	color: var(--hst-on-dark);
	font-size: 15px;
	line-height: 1.55;
}

.hst-reskin .hst-sres__custom a {
	color: var(--hst-bone);
	font-weight: 600;
	text-underline-offset: 4px;
}

/* Pills: quick searches, categories of the phone results, subcategories in the phone menu. 44 px high (design 42). */
.hst-reskin .hst-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.hst-reskin .hst-pills li {
	margin: 0;
}

.hst-reskin .hst-pill {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 0 16px;
	border: 1.5px solid rgba(239, 230, 218, 0.45);
	border-radius: 999px;
	background: rgba(14, 10, 9, 0.25);
	font-size: 15px;
	font-weight: 600;
	font-stretch: var(--hst-narrow);
	text-decoration: none;
}

.hst-reskin .hst-pill:hover {
	border-color: var(--hst-bone);
}

.hst-reskin .hst-pill__n {
	color: var(--hst-on-dark-3);
	font-weight: 500;
}

/* ---- Phone menu (tablet and phone) ------------------------------------------------------------------------------- */
.hst-reskin .hst-drawer__open,
.hst-reskin .hst-drawer__close {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
}

.hst-reskin .hst-drawer {
	position: fixed;
	inset: 0;
	width: 100%;
	max-width: 100%;
	height: 100%;
	max-height: 100%;
	margin: 0;
	padding: 0;
	overflow-y: auto;
	overscroll-behavior: contain;
	border: 0;
	background: rgba(22, 17, 15, 0.94);
	-webkit-backdrop-filter: blur(24px) saturate(1.2);
	backdrop-filter: blur(24px) saturate(1.2);
	color: var(--hst-bone);
	font-family: var(--hst-sans);
	font-size: 16px;
	line-height: 1.6;
	text-align: left;
}

.hst-reskin .hst-drawer::backdrop {
	background: transparent;
}

@media (min-width: 768px) {
	.hst-reskin .hst-drawer {
		left: auto;
		width: 440px;
	}

	.hst-reskin .hst-drawer::backdrop {
		background: rgba(14, 10, 9, 0.5);
	}
}

@media (prefers-reduced-motion: no-preference) {
	.hst-reskin .hst-drawer[open] {
		animation: hst-drawer-in 0.22s ease-out;
	}
}

@keyframes hst-drawer-in {
	from {
		opacity: 0;
		transform: translateX(24px);
	}
}

html:has(.hst-drawer[open]) {
	overflow: hidden;
}

.hst-reskin .hst-drawer__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 60px;
	padding: 0 4px 0 20px;
	border-bottom: 1px solid rgba(239, 230, 218, 0.12);
}

.hst-reskin .hst-drawer__logo {
	display: flex;
	padding: 12px 0;
}

.hst-reskin .hst-drawer__logo-img {
	display: block;
	width: auto;
	height: 18px;
}

.hst-reskin .hst-drawer__body {
	padding: 18px 20px 32px;
}

.hst-reskin .hst-sfield--m .hst-sfield__icon {
	left: 15px;
	top: 15px;
	width: 19px;
	height: 19px;
}

.hst-reskin .hst-sfield--m .hst-sfield__input {
	padding: 0 50px 0 44px;
	background: rgba(239, 230, 218, 0.07);
	font-size: 16px;
}

.hst-reskin .hst-sfield__clear {
	position: absolute;
	right: 3px;
	top: 3px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	color: var(--hst-on-dark-3);
}

.hst-reskin .hst-sfield__clear:hover {
	color: var(--hst-bone);
}

.hst-reskin .hst-sfield__clear[hidden] {
	display: none;
}

.hst-reskin .hst-sres--m {
	margin-top: 18px;
}

.hst-reskin .hst-sres--m .hst-sres__note {
	margin: 0 0 14px;
	font-size: 14px;
}

.hst-reskin .hst-sres--m .hst-sres__label {
	margin: 20px 0 2px;
	font-size: 13px;
}

.hst-reskin .hst-sres--m [data-hst-catlabel] {
	margin: 0 0 8px;
}

.hst-reskin .hst-sres--m .hst-sres__cats {
	flex-direction: row;
	flex-wrap: wrap;
	gap: 8px;
}

.hst-reskin .hst-sres__rows {
	margin: 0;
	padding: 0;
	list-style: none;
}

.hst-reskin .hst-sres__rows li {
	border-bottom: 1px dashed rgba(239, 230, 218, 0.16);
}

.hst-reskin .hst-sres__row {
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr) auto;
	gap: 14px;
	align-items: center;
	padding: 10px 0;
	color: var(--hst-bone);
	text-decoration: none;
}

.hst-reskin .hst-sres__rimg {
	display: block;
	width: 56px;
	height: 70px;
	overflow: hidden;
	border-radius: 3px;
	background: var(--hst-photo-bg);
}

.hst-reskin .hst-sres__rbody {
	min-width: 0;
}

.hst-reskin .hst-sres__rname {
	display: block;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.3;
}

.hst-reskin .hst-sres__rdesc {
	display: block;
	margin-top: 2px;
	overflow: hidden;
	color: var(--hst-on-dark-3);
	font-size: 13px;
	line-height: 1.4;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.hst-reskin .hst-sres__rprice {
	font-family: var(--hst-serif);
	font-size: 18px;
	font-weight: 600;
	white-space: nowrap;
}

.hst-reskin .hst-sres__allbtn {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 50px;
	margin-top: 18px;
	border: 1.5px solid rgba(239, 230, 218, 0.55);
	border-radius: 3px;
	color: var(--hst-bone);
	font-size: 15px;
	font-weight: 700;
	font-stretch: var(--hst-narrow);
	text-decoration: none;
}

.hst-reskin .hst-sres--m .hst-sres__none-title {
	margin: 6px 0 0;
	font-size: 27px;
}

.hst-reskin .hst-sres--m .hst-sres__none-text {
	margin: 10px 0 16px;
	font-size: 15px;
	line-height: 1.55;
}

.hst-reskin .hst-drawer .hst-pill {
	background: none;
}

/* Accordion Obchod / Dámy / Páni. Without the script all sections are open and the toggles are not shown. */
.hst-reskin .hst-drawer__nav {
	margin-top: 10px;
}

.hst-reskin .hst-drawer__nav[hidden] {
	display: none;
}

.hst-reskin .hst-acc {
	margin: 0;
	padding: 0;
	list-style: none;
}

.hst-reskin .hst-acc__item {
	margin: 0;
	border-bottom: 1px dashed rgba(239, 230, 218, 0.2);
}

.hst-reskin .hst-acc__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	min-height: 66px;
}

.hst-reskin .hst-acc__link {
	padding: 10px 0;
	color: var(--hst-bone);
	font-family: var(--hst-serif);
	font-size: 32px;
	font-weight: 600;
	line-height: 1;
	text-decoration: none;
}

.hst-reskin :is(.hst-acc__link, .hst-drawer__link)[aria-current] {
	text-decoration: underline;
	text-decoration-color: var(--hst-thread);
	text-decoration-thickness: 2px;
	text-underline-offset: 8px;
}

.hst-reskin .hst-acc__toggle {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1.5px solid rgba(239, 230, 218, 0.32);
	border-radius: 50%;
}

.hst-reskin .hst-acc__item.is-open .hst-acc__toggle svg {
	transform: rotate(180deg);
}

.hst-reskin .hst-drawer:not([data-hst-js]) .hst-acc__toggle {
	display: none;
}

.hst-reskin .hst-acc__panel {
	padding: 0 0 22px;
}

.hst-reskin .hst-acc__panel[hidden] {
	display: none;
}

.hst-reskin .hst-rail--drawer {
	margin: 0;
	padding: 0;
}

.hst-reskin .hst-rail--drawer .hst-rail__link {
	padding: 9px 0 9px 16px;
	color: var(--hst-bone);
	font-size: 17px;
	font-weight: 500;
}

.hst-reskin .hst-dcards {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.hst-reskin .hst-dcards--strip {
	display: flex;
	/* Room for the scrollbar under the names (P09l bod 3): the overlay scrollbar of phones is drawn in the bottom
	   padding, the negative margin keeps the place of what follows. */
	margin: 0 -20px -10px;
	padding: 0 20px 16px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-padding: 0 20px;
	scrollbar-width: thin;
	scrollbar-color: #75665b transparent;
}

/* Safari (no scrollbar-color): the same thin thumb, 3.4 : 1 on the dark menu. */
.hst-reskin .hst-dcards--strip::-webkit-scrollbar {
	height: 6px;
}

.hst-reskin .hst-dcards--strip::-webkit-scrollbar-track {
	background: transparent;
}

.hst-reskin .hst-dcards--strip::-webkit-scrollbar-thumb {
	border-radius: 3px;
	background: #75665b;
}

.hst-reskin .hst-dcard {
	margin: 0;
}

.hst-reskin .hst-dcards--strip .hst-dcard {
	flex: none;
	width: 138px;
	scroll-snap-align: start;
}

.hst-reskin .hst-dcard__link {
	display: block;
	color: var(--hst-bone);
	text-decoration: none;
}

.hst-reskin .hst-dcard__media {
	position: relative;
	display: block;
	height: 190px;
	overflow: hidden;
	border-radius: 4px;
	background: var(--hst-photo-bg);
}

.hst-reskin .hst-dcards--strip .hst-dcard__media {
	height: 172px;
}

.hst-reskin .hst-dcard__name {
	display: block;
	margin-top: 8px;
	font-family: var(--hst-serif);
	font-size: 20px;
	font-weight: 600;
	line-height: 1.1;
}

.hst-reskin .hst-drawer__label {
	margin: 16px 0 8px;
	color: var(--hst-on-dark-3);
	font-size: 13px;
}

.hst-reskin .hst-drawer__all {
	margin: 16px 0 0;
}

.hst-reskin .hst-drawer__alllink {
	display: inline-block;
	padding: 4px 0;
}

.hst-reskin .hst-drawer__links {
	margin: 8px 0 0;
	padding: 0;
	list-style: none;
}

.hst-reskin .hst-drawer__links li {
	margin: 0;
	border-bottom: 1px dashed rgba(239, 230, 218, 0.14);
}

.hst-reskin .hst-drawer__link {
	display: flex;
	align-items: center;
	min-height: 54px;
	color: var(--hst-bone);
	font-size: 18px;
	font-weight: 500;
	text-decoration: none;
}

.hst-reskin .hst-drawer__vision {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	margin-top: 28px;
	padding: 18px;
	border: 1.5px dashed rgba(184, 149, 79, 0.8);
	border-radius: 4px;
	color: var(--hst-bone);
	text-decoration: none;
}

.hst-reskin .hst-drawer__vision svg {
	flex: none;
	margin-top: 2px;
	color: var(--hst-thread);
}

.hst-reskin .hst-drawer__vision-title {
	display: block;
	font-family: var(--hst-serif);
	font-size: 22px;
	font-weight: 600;
	line-height: 1.1;
}

.hst-reskin .hst-drawer__vision-text {
	display: block;
	margin-top: 6px;
	color: var(--hst-on-dark);
	font-size: 14px;
	line-height: 1.5;
}

.hst-reskin .hst-drawer__vision-cta {
	display: block;
	margin-top: 8px;
	font-size: 15px;
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 4px;
}

.hst-reskin .hst-drawer__foot {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 26px;
	margin-top: 24px;
	padding-top: 16px;
	border-top: 1px dashed rgba(239, 230, 218, 0.18);
}

.hst-reskin .hst-drawer__footlink {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-height: 44px;
	color: var(--hst-bone);
	font-size: 15px;
	font-weight: 500;
	text-decoration: none;
}

/* Logged in: the initials instead of the figure (P09l bod 4) – the circle of the header, the size of the icon. */
.hst-reskin .hst-drawer__footlink .hst-head-avatar--drawer {
	flex: none;
	width: 26px;
	height: 26px;
	font-size: 11px;
}

.hst-reskin .hst-drawer__footlink:hover .hst-head-avatar--drawer {
	border-color: var(--hst-thread);
}

/* A browser without backdrop-filter: full background instead of the glass. */
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
	.hst-reskin .hst-header-main::before,
	.hst-reskin :is(.hst-mega, .hst-sres--d, .hst-langs--dropdown .hst-langs__panel, .hst-drawer) {
		background: rgba(22, 17, 15, 0.96);
	}
}

@media (prefers-reduced-motion: reduce) {
	.hst-reskin :is(.hst-nav__toggle svg, .hst-acc__toggle svg, .hst-langs__arrow) {
		transition: none;
	}
}

/* ---- Cart of the redesign (P09h, includes/reskin-cart*.php – option hst_reskin_cart): the icon in the header, the
   side cart (README §3) and the parts shared with the cart page, checkout and thank-you page (reskin-cart.css):
   buttons, a piece (README §2), quantity, the thread of free delivery. ------------------------------------------- */
body.hst-reskin :is(a, button).hst-cbtn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 54px;
	margin: 0;
	padding: 0 24px;
	border: 1.5px solid transparent;
	border-radius: 3px;
	box-shadow: none;
	font-family: var(--hst-sans);
	font-size: 17px;
	font-weight: 700;
	font-stretch: var(--hst-narrow);
	line-height: 1.2;
	letter-spacing: 0;
	text-align: center;
	text-decoration: none;
	text-transform: none;
	cursor: pointer;
}

/* WooCommerce and the theme style their buttons (.checkout-button, #place_order, .button.alt …) with stronger
   selectors – display: block, padding and line-height moved the text of "Prejsť do pokladne" up. The text of every
   button of the cart, checkout, thank-you page, account, pay for order and newsletter stays in the middle, also when it
   wraps (P09k, bod 13). */
body.hst-reskin :is(a, button).hst-cbtn:is(.button, .checkout-button, .wc-forward, .wc-backward, .alt) {
	display: inline-flex;
	float: none;
}

body.hst-reskin :is(a, button).hst-cbtn {
	align-items: center !important;
	justify-content: center !important;
	padding-top: 8px !important;
	padding-bottom: 8px !important;
	line-height: 1.2 !important;
	box-sizing: border-box;
}

body.hst-reskin :is(a, button).hst-cbtn.hst-cbtn--primary {
	border-color: var(--hst-oxblood);
	background: var(--hst-oxblood);
	color: var(--hst-bone);
}

body.hst-reskin :is(a, button).hst-cbtn.hst-cbtn--primary:hover {
	border-color: var(--hst-oxblood-deep);
	background: var(--hst-oxblood-deep);
	color: var(--hst-bone);
}

body.hst-reskin :is(a, button).hst-cbtn.hst-cbtn--line {
	border-color: rgba(22, 17, 15, 0.55);
	background: transparent;
	color: var(--hst-ink);
	font-size: 16px;
	font-weight: 600;
}

body.hst-reskin :is(a, button).hst-cbtn.hst-cbtn--line:hover {
	border-color: var(--hst-ink);
	background: transparent;
	color: var(--hst-ink);
}

body.hst-reskin :is(a, button).hst-cbtn.hst-cbtn--bone {
	border-color: var(--hst-bone);
	background: var(--hst-bone);
	color: var(--hst-ink);
	font-size: 16px;
}

body.hst-reskin :is(a, button).hst-cbtn.hst-cbtn--tall {
	width: 100%;
	min-height: 57px;
}

body.hst-reskin :is(a, button).hst-cbtn:focus-visible,
.hst-reskin :is(.hst-qty__btn, .hst-ci__bin, .hst-sc__close, .hst-sc__undo, .hst-cartbtn__link, .hst-copy):focus-visible {
	outline: 2px solid var(--hst-focus, var(--hst-ink));
	outline-offset: 3px;
}

/* Icon of the cart in the header (instead of the Mini-Cart block): a link to the cart, the script opens the panel. */
.hst-reskin .hst-cartbtn {
	display: flex;
}

.hst-reskin .hst-cartbtn__link {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	color: var(--hst-bone);
}

.hst-reskin .hst-cartbtn__link:hover {
	color: var(--hst-bone);
}

.hst-reskin .hst-cartbtn__count {
	position: absolute;
	top: 3px;
	right: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 18px;
	height: 18px;
	padding: 0 5px;
	border-radius: 9px;
	background: var(--hst-bone);
	color: var(--hst-ink);
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
}

.hst-reskin .hst-cartbtn__count[hidden] {
	display: none;
}

/* Side cart: a modal <dialog> from the right, 440 px (phones the whole screen), the left edge sewn on (README §3). */
.hst-reskin .hst-sc {
	position: fixed;
	inset: 0 0 0 auto;
	width: 440px;
	max-width: 100vw;
	height: 100%;
	max-height: none;
	margin: 0 0 0 auto;
	padding: 0;
	border: 0;
	background: #f8f3eb;
	color: var(--hst-ink);
	box-shadow: -30px 0 60px -20px rgba(0, 0, 0, 0.45);
	font-family: var(--hst-sans);
	overflow: hidden;
}

.hst-reskin .hst-sc::backdrop {
	background: rgba(14, 10, 9, 0.55);
}

html:has(.hst-sc[open]) {
	overflow: hidden;
}

@media (prefers-reduced-motion: no-preference) {
	.hst-reskin .hst-sc[open] {
		animation: hst-sc-in 0.2s ease-out;
	}

	.hst-reskin .hst-sc[open]::backdrop {
		animation: hst-sc-fade 0.2s ease-out;
	}
}

@keyframes hst-sc-in {
	from {
		transform: translateX(100%);
	}
}

@keyframes hst-sc-fade {
	from {
		opacity: 0;
	}
}

.hst-reskin .hst-sc__panel {
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
}

.hst-reskin .hst-sc__panel::before {
	content: "";
	position: absolute;
	top: 22px;
	bottom: 22px;
	left: 10px;
	border-left: 1.5px dashed rgba(184, 149, 79, 0.95);
	pointer-events: none;
}

.hst-reskin .hst-sc__panel::after {
	content: "";
	position: absolute;
	top: 14px;
	bottom: 14px;
	left: 6px;
	width: 10px;
	background:
		radial-gradient(circle at 5px 5px, var(--hst-thread) 4.6px, transparent 5px) top / 10px 10px no-repeat,
		radial-gradient(circle at 5px 5px, var(--hst-thread) 4.6px, transparent 5px) bottom / 10px 10px no-repeat;
	pointer-events: none;
}

.hst-reskin .hst-sc__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 20px 12px 0 36px;
}

.hst-reskin .hst-sc__heading {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 12px;
}

.hst-reskin .hst-sc .hst-sc__title {
	margin: 0;
	font-family: var(--hst-serif);
	font-size: 32px;
	font-weight: 600;
	line-height: 1.05;
	color: var(--hst-ink);
	text-transform: none;
}

.hst-reskin .hst-sc .hst-sc__count {
	margin: 0;
	font-size: 15px;
	font-weight: 500;
	color: var(--hst-on-light);
}

.hst-reskin .hst-sc__close {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--hst-ink);
	cursor: pointer;
}

.hst-reskin .hst-sc__free {
	padding: 12px 24px 0 36px;
}

.hst-reskin .hst-sc__free:empty {
	display: none;
}

.hst-reskin .hst-sc__notice:not(:empty) {
	margin: 12px 24px 0 36px;
	padding: 10px 14px;
	border-left: 3px solid var(--hst-thread);
	border-radius: 0 3px 3px 0;
	background: var(--hst-bone);
	font-size: 14px;
	line-height: 1.45;
}

.hst-reskin .hst-sc__undo {
	padding: 0;
	border: 0;
	background: none;
	color: var(--hst-ink);
	font: inherit;
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
}

.hst-reskin .hst-sc__scroll {
	flex: 1;
	min-height: 0;
	padding: 6px 24px 8px 36px;
	overflow-y: auto;
	overscroll-behavior: contain;
}

.hst-reskin .hst-sc__foot {
	padding: 16px 24px 24px 36px;
	border-top: 1px dashed rgba(22, 17, 15, 0.3);
}

.hst-reskin .hst-sc__total {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
}

.hst-reskin .hst-sc__total-label {
	font-size: 17px;
	font-weight: 700;
}

.hst-reskin .hst-sc__total-sum {
	font-family: var(--hst-serif);
	font-size: 30px;
	font-weight: 600;
	line-height: 1;
}

.hst-reskin .hst-sc .hst-sc__later {
	margin: 4px 0 0;
	font-size: 13px;
	line-height: 1.45;
	color: var(--hst-on-light);
}

.hst-reskin .hst-sc__buttons {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr);
	gap: 10px;
	margin-top: 16px;
}

body.hst-reskin .hst-sc__buttons .hst-cbtn {
	padding: 0 12px;
}

body.hst-reskin .hst-sc__buttons .hst-cbtn--line {
	font-size: 16px;
}

.hst-reskin .hst-sc__empty {
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	gap: 14px;
	padding: 28px 24px 24px 36px;
}

.hst-reskin .hst-sc__empty-icon {
	color: #8a6d36;
}

.hst-reskin .hst-sc .hst-sc__empty-title {
	margin: 0;
	font-family: var(--hst-serif);
	font-size: 28px;
	font-weight: 600;
	line-height: 1.1;
}

.hst-reskin .hst-sc .hst-sc__empty-text {
	margin: 0;
	font-size: 15px;
	line-height: 1.55;
	color: #4d423b;
}

body.hst-reskin .hst-sc__shop.hst-cbtn {
	min-height: 52px;
	margin-top: 6px;
	font-size: 16px;
}

/* Skeleton while the content is on its way. */
.hst-reskin .hst-sc__ghosts {
	margin: 12px 0 0;
	padding: 0;
	list-style: none;
}

.hst-reskin .hst-sc__ghost {
	display: grid;
	grid-template-columns: 76px minmax(0, 1fr);
	gap: 14px;
	margin: 0;
	padding: 18px 0;
	border-bottom: 1px dashed rgba(22, 17, 15, 0.18);
}

.hst-reskin .hst-sc__ghost span:first-child {
	height: 95px;
	border-radius: 3px;
	background: #e9e0d4;
}

.hst-reskin .hst-sc__ghost span:last-child {
	height: 60px;
	background: linear-gradient(#e9e0d4 0 14px, transparent 14px 24px, #e9e0d4 24px 36px, transparent 36px 46px, #e9e0d4 46px 58px, transparent 58px) left top / 70% 100% no-repeat;
}

@media (max-width: 767px) {
	.hst-reskin .hst-sc {
		width: 100vw;
	}

	.hst-reskin .hst-sc .hst-sc__title {
		font-size: 30px;
	}

	.hst-reskin .hst-sc__buttons {
		grid-template-columns: minmax(0, 1fr);
	}

	.hst-reskin .hst-sc__checkout {
		order: -1;
	}
}

/* A piece – the same renderer in the side cart, cart, checkout and thank-you page (README §2). */
.hst-reskin .hst-cart-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.hst-reskin .hst-ci {
	position: relative;
	display: grid;
	grid-template-columns: 76px minmax(0, 1fr) auto;
	grid-template-areas: "photo main sum" "photo ctrl ctrl";
	gap: 0 14px;
	align-items: start;
	margin: 0;
	padding: 18px 0;
	border-bottom: 1px dashed rgba(22, 17, 15, 0.3);
	font-family: var(--hst-sans);
	color: var(--hst-ink);
}

.hst-reskin .hst-ci.hst-ci--parent {
	padding-bottom: 12px;
	border-bottom: 0;
}

.hst-reskin .hst-ci.hst-ci--hangs {
	grid-template-columns: 56px minmax(0, 1fr) auto;
	padding: 0 0 18px 56px;
}

.hst-reskin .hst-ci__photo {
	grid-area: photo;
	position: relative;
	display: block;
	width: 76px;
	height: 95px;
	border-radius: 3px;
	background: #ddd2c4;
}

.hst-reskin .hst-ci__photo--square,
.hst-reskin .hst-ci--hangs .hst-ci__photo {
	width: 56px;
	height: 56px;
}

.hst-reskin .hst-ci--panel:not(.hst-ci--hangs) .hst-ci__photo--square {
	width: 76px;
	height: 76px;
}

.hst-reskin .hst-ci__img {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: inherit;
	object-fit: cover;
}

.hst-reskin .hst-ci__thread {
	position: absolute;
	top: -12px;
	left: 37px;
	width: 16px;
	height: 40px;
	border-bottom: 1.5px dashed var(--hst-thread);
	border-left: 1.5px dashed var(--hst-thread);
	pointer-events: none;
}

.hst-reskin .hst-ci__main {
	grid-area: main;
	min-width: 0;
}

.hst-reskin .hst-ci__sum {
	grid-area: sum;
	text-align: right;
}

.hst-reskin .hst-ci__ctrl {
	grid-area: ctrl;
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 10px;
}

.hst-reskin .hst-ci .hst-ci__of {
	margin: 0 0 2px;
	font-size: 13px;
	line-height: 1.35;
	color: var(--hst-on-light);
}

.hst-reskin .hst-ci .hst-ci__name {
	margin: 0;
	font-family: var(--hst-sans);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: 0;
	text-transform: none;
}

.hst-reskin .hst-ci__link {
	color: var(--hst-ink);
	text-decoration: none;
}

.hst-reskin .hst-ci__link:hover {
	color: var(--hst-ink);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.hst-reskin .hst-ci__price {
	font-size: 15px;
	font-weight: 700;
	line-height: 1.3;
	white-space: nowrap;
}

.hst-reskin .hst-ci__each {
	display: block;
	font-size: 12px;
	line-height: 1.4;
	color: var(--hst-on-light);
	white-space: nowrap;
}

.hst-reskin .hst-ci__opts {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 14px;
	margin: 6px 0 0;
	padding: 0;
	list-style: none;
	font-size: 13px;
	line-height: 1.4;
	color: #4d423b;
}

/* Output of woocommerce_after_cart_item_name (other plugins). */
.hst-reskin .hst-ci__extra {
	margin: 4px 0 0;
	font-size: 13px;
	line-height: 1.4;
	color: #4d423b;
}

.hst-reskin .hst-ci__extra > :last-child {
	margin-bottom: 0;
}

.hst-reskin .hst-ci__opt {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin: 0;
}

.hst-reskin .hst-ci__swatch,
.hst-reskin .hst-ci__metal {
	display: block;
	flex: none;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	object-fit: cover;
}

.hst-reskin .hst-ci__swatch {
	box-shadow: 0 0 0 1px rgba(22, 17, 15, 0.25);
}

.hst-reskin .hst-ci__metal {
	box-shadow: inset 0 0 0 1px rgba(22, 17, 15, 0.25);
}

.hst-reskin .hst-ci__oico {
	flex: none;
	color: #8a6d36;
}

.hst-reskin .hst-ci .hst-ci__optline {
	margin: 2px 0 0;
	font-size: 13px;
	line-height: 1.4;
	color: #4d423b;
}

.hst-reskin .hst-ci .hst-ci__status {
	display: flex;
	align-items: flex-start;
	gap: 7px;
	margin: 6px 0 0;
	font-size: 13px;
	line-height: 1.4;
	color: var(--hst-ink);
}

.hst-reskin .hst-ci__status .hst-ico {
	flex: none;
	margin-top: 1px;
	color: var(--hst-oxblood);
}

.hst-reskin .hst-ci__status strong {
	font-weight: 700;
}

/* − n + and the bin (side cart 40 px – README §2). */
.hst-reskin .hst-qty {
	display: inline-flex;
	align-items: center;
	border: 1.5px solid rgba(22, 17, 15, 0.35);
	border-radius: 3px;
	background: var(--hst-bone);
}

.hst-reskin .hst-qty__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	box-shadow: none;
	color: var(--hst-ink);
	cursor: pointer;
}

.hst-reskin .hst-qty__btn[aria-disabled="true"] {
	opacity: 0.35;
	cursor: default;
}

.hst-reskin .hst-qty__n {
	min-width: 24px;
	font-size: 16px;
	font-weight: 700;
	text-align: center;
}

.hst-reskin .hst-ci__bin {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	box-shadow: none;
	color: var(--hst-on-light);
	cursor: pointer;
}

.hst-reskin .hst-ci__bin:hover {
	color: var(--hst-ink);
}

.hst-reskin .hst-ci.is-busy {
	opacity: 0.6;
}

/* Checkout and thank-you page: photo 56 × 70 with the quantity in a circle, options in one line, only the status title. */
.hst-reskin .hst-ci.hst-ci--checkout,
.hst-reskin .hst-ci.hst-ci--order {
	grid-template-columns: 56px minmax(0, 1fr) auto;
	grid-template-areas: "photo main sum";
	gap: 0 12px;
	padding: 10px 0;
	border-bottom: 0;
}

.hst-reskin .hst-ci.hst-ci--checkout.hst-ci--hangs,
.hst-reskin .hst-ci.hst-ci--order.hst-ci--hangs {
	grid-template-columns: 44px minmax(0, 1fr) auto;
	padding: 2px 0 10px 24px;
}

.hst-reskin :is(.hst-ci--checkout, .hst-ci--order) .hst-ci__photo {
	width: 56px;
	height: 70px;
}

.hst-reskin :is(.hst-ci--checkout, .hst-ci--order).hst-ci--hangs .hst-ci__photo {
	width: 44px;
	height: 55px;
}

.hst-reskin :is(.hst-ci--checkout, .hst-ci--order).hst-ci--hangs .hst-ci__thread {
	top: -8px;
	left: 10px;
	width: 12px;
	height: 30px;
}

.hst-reskin :is(.hst-ci--checkout, .hst-ci--order) .hst-ci__name {
	font-size: 14px;
	font-weight: 700;
}

.hst-reskin :is(.hst-ci--checkout, .hst-ci--order) .hst-ci__status {
	margin-top: 2px;
	font-size: 12px;
}

.hst-reskin :is(.hst-ci--checkout, .hst-ci--order) .hst-ci__price {
	font-size: 14px;
}

.hst-reskin .hst-ci__badge {
	position: absolute;
	top: -6px;
	right: -6px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 20px;
	height: 20px;
	padding: 0 5px;
	border-radius: 10px;
	background: var(--hst-ink);
	color: #f8f3eb;
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
}

/* Thread of free delivery (README §7): the text above, the golden part reached, a parcel at the end. */
.hst-reskin .hst-free .hst-free__text {
	margin: 0;
	font-size: 14px;
	line-height: 1.45;
	color: var(--hst-ink);
}

.hst-reskin .hst-free__text strong {
	font-weight: 700;
}

.hst-reskin .hst-free__line {
	position: relative;
	height: 18px;
	margin-top: 6px;
}

.hst-reskin .hst-free__road,
.hst-reskin .hst-free__done {
	position: absolute;
	top: 8px;
	left: 0;
}

.hst-reskin .hst-free__road {
	right: 24px;
	border-top: 2px dashed rgba(22, 17, 15, 0.22);
}

.hst-reskin .hst-free__done {
	width: max(0px, calc(var(--hst-free, 0%) - 24px));
	border-top: 2px dashed var(--hst-thread);
}

.hst-reskin .hst-free__knot {
	position: absolute;
	top: 4px;
	left: max(0px, calc(var(--hst-free, 0%) - 24px));
	width: 10px;
	height: 10px;
	margin-left: -5px;
	border-radius: 50%;
	background: var(--hst-thread);
}

.hst-reskin .hst-free__box {
	position: absolute;
	top: 0;
	right: 0;
	color: #8a6d36;
}

/* Side cart (and the cart page on phones – reskin-cart.css): the options and the status use the width under the price
   too; the price sits on the line of the name. */
/* Side cart: photo | details | price – the options wrap only in the column of the details, never under the price, each
   on its own line; the price of one piece is next to − n + (P09k, bod 11). */
.hst-reskin .hst-ci--panel .hst-ci__main {
	grid-column: 2;
	grid-row: 1;
}

.hst-reskin .hst-ci--panel .hst-ci__sum {
	grid-column: 3;
	grid-row: 1;
}

.hst-reskin .hst-ci--panel .hst-ci__opts {
	flex-direction: column;
	align-items: flex-start;
	gap: 3px;
}

.hst-reskin .hst-ci__ctrl .hst-ci__each {
	margin-left: auto;
	font-size: 13px;
}

.hst-reskin .hst-ci--panel:has(.hst-ci__of) .hst-ci__sum {
	margin-top: 19px;
}

/* ---- "Na začiatok stránky" (P09k, bod 19, reskin-home.js – the button is made by the script, none without it) ----- */
.hst-reskin .hst-totop {
	position: fixed;
	right: 24px;
	/* Above a bar or badge (--hst-totop-lift) and, at the end of the page, above the bottom row of the footer
	   (--hst-totop-dock = distance from the bottom of the window, P09l bod 2). */
	bottom: max(calc(24px + var(--hst-totop-lift, 0px)), var(--hst-totop-dock, 0px));
	z-index: 90;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	margin: 0;
	padding: 0;
	border: 1px solid rgba(184, 149, 79, 0.65);
	border-radius: 50%;
	background: #16110f;
	box-shadow: 0 14px 30px -14px rgba(0, 0, 0, 0.7);
	color: var(--hst-bone);
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity 0.2s ease, transform 0.2s ease, visibility 0s linear 0.2s, bottom 0.2s ease;
	--hst-focus: var(--hst-thread);
}

.hst-reskin .hst-totop.is-on {
	opacity: 1;
	visibility: visible;
	transform: none;
	transition: opacity 0.2s ease, transform 0.2s ease, visibility 0s, bottom 0.2s ease;
}

/* Docked on the footer: it moves with the page, without the easing of bottom (it would trail behind the row). */
.hst-reskin .hst-totop.is-on.is-docked {
	transition: opacity 0.2s ease, transform 0.2s ease, visibility 0s;
}

.hst-reskin .hst-totop:hover {
	border-color: var(--hst-thread);
	background: #2a211d;
	color: #fff;
}

@media (max-width: 767px) {
	.hst-reskin .hst-totop {
		right: 16px;
		bottom: max(calc(16px + var(--hst-totop-lift, 0px)), var(--hst-totop-dock, 0px));
	}
}

@media (prefers-reduced-motion: reduce) {
	.hst-reskin .hst-totop,
	.hst-reskin .hst-totop.is-on {
		transform: none;
		transition: none;
	}
}

/* Gift voucher tile of the megamenu "Obchod" (P10m; in place of "Máš vlastnú víziu?"): the whole voucher on dark
   leather at the top. */
.hst-reskin .hst-tile--gv {
	background: var(--hst-ink);
}

.hst-reskin .hst-tile--gv .hst-tile__img {
	inset: 26px 18px auto;
	width: calc(100% - 36px);
	height: auto;
	aspect-ratio: 1748 / 1240;
	border-radius: 3px;
	object-fit: contain;
	box-shadow: 0 8px 18px rgba(0, 0, 0, 0.45);
	transform: rotate(-2deg);
}

.hst-reskin .hst-tile--gv .hst-tile__shade {
	display: none;
}

.hst-reskin .hst-tile--gv .hst-tile__body {
	padding: 0 20px 22px;
}

.hst-reskin .hst-tile--gv .hst-tile__title {
	font-size: 21px;
}