/**
 * WA Instant Search — results page styling.
 *
 * The card / grid / toolbar / pagination sections are a 1:1 re-implementation of
 * the production WP Grid Builder archive (mobilky.sk/prislusenstvo/): same class
 * names, same resolved values. Production runs Automatic.css with
 * `--root-font-size: 62.5%` (1rem = 10px); this stylesheet must also hold up when
 * automatic.css is absent, so every token below is a RESOLVED PIXEL value with the
 * theme variable only as an optional override.
 *
 * Sources: wooptima-gridbuilder-blocks.css, G2G1C2C1.css (WPGB generated),
 * 39.css (Oxygen/WPGB per-facet), 165/169-header-compiled.css.
 * The structural base (`.wp-grid-builder .wa-is-card …`) used to ship separately
 * in a bundled stylesheet this plugin no longer carries (see commit 77726f76);
 * only the site overrides live here.
 *
 * The facet sidebar is the same kind of re-implementation: production facet
 * markup, with the structural base formerly coming from that same bundled
 * stylesheet (commit 77726f76) and only the site overrides (39.css per-facet-ID
 * rules, universal.css .wa-sidebar-widget, 193-header-compiled.css off-canvas)
 * resolved here.
 */

.wa-is-rc,
.wa-is-pagination-area,
.wa-is-facets {
	/* Brand */
	--wa-primary: #623385;
	--wa-primary-hover: #6f3a98;
	--wa-primary-light: #dbc8ea;
	--wa-primary-ultra-light: #f3edf8;
	--wa-primary-ultra-dark-trans-10: rgba( 27, 14, 37, 0.1 );
	--wa-secondary: #efebf3;
	--wa-accent: #a0c801;
	--wa-accent-hover: #b7e401;
	--wa-base: #444;
	--wa-shade-dark: #404040;
	--wa-shade-medium: gray;
	--wa-shade-light: #f0f0f0;
	--wa-white: #fff;
	--wa-instock: #4ac012;
	--wa-outofstock: #f65713;

	/* ACSS fluid scales, resolved at a desktop viewport (1rem = 10px on prod). */
	--wa-space-xs: 11.11px;
	--wa-space-s: 14.67px;
	--wa-space-m: 22px;
	--wa-space-l: 33px;
	/* Medzera medzi stĺpcami bola doteraz utilita `gap--l` z Automatic.css, teda
	   var(--space-l). Statických 33px by na mobile vyrobilo viditeľne inú medzeru
	   než dnes, tak sme tú krivku prevzali — ale v px, nie v rem: ACSS beží
	   s `--root-font-size: 62.5%`, takže rem-ová podoba by mimo ACSS dala pri
	   1440px ~43px namiesto 33px. Takto dáva 20.1471px pri 390px a 33px pri
	   1440px bez ohľadu na root font-size, čo je aj pravidlo tohto bloku tokenov. */
	--wa-space-l-fluid: clamp( 19.2px, calc( 1.3529411765vw + 14.870588235px ), 33px );
	/* Same treatment as --wa-space-l-fluid above, for the --space-m curve —
	   fázy 5, Task 7 needed it for the sort-facet box's inset, previously
	   inherited from 165-header-compiled.css's `.sorting--filter` rule.
	   Resolves to 16px at 390px and 22px at 1440px, matching production. */
	--wa-space-m-fluid: clamp( 16px, calc( 0.5882352941vw + 14.117647059px ), 22px );
	/* Same treatment again, for --space-s — code review (fáza 5, Task 6/7 fix)
	   found the toolbar-row's borrowed padding-block used the static token,
	   accurate only above ACSS's 1340px upper breakpoint; ACSS's own
	   --space-s is clamp(1.3333rem, 0.1307189542vw + 1.291503268rem, 1.4667rem),
	   i.e. 13.333px..14.667px resolved at 1rem=10px. */
	--wa-space-s-fluid: clamp( 13.333px, calc( 0.1307189542vw + 12.91503268px ), 14.667px );
	--wa-text-s: 12px;
	--wa-text-m: 16px;
	--wa-text-l: 21.33px;
	--wa-text-xl: 28.43px;

	/* NOTE: the ACSS radius scale is inverted — xs is the largest. */
	--wa-radius-s: 11.11px;
	--wa-radius-l: 9px;
	--wa-radius-xxl: 7.29px;

	/* Legacy aliases still used by the facet sidebar / chips below. */
	--rc-brand: var( --wa-primary );
	--rc-ink: var( --wa-base );
	--rc-muted: #6b7280;
	--rc-line: #e7e7e9;
	--rc-soft: #f6f6f7;

	font-family: 'Mukta', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	width: 100%;
}

/* ---------------------------------------------------------------------------
   Dvojstĺpec — kontrakt tried, ktorý vlastní tento plugin.

   Doteraz ho kreslil Oxygen cez triedy témy. Tie
   pravidlá boli štyri a sú reprodukované nižšie 1:1; `gap` k nim pridávala
   utilita `gap--l` z Automatic.css — fluidná, 33px na 1440px a 20.15px na 390px.
   Tú krivku nesie --wa-space-l-fluid (v px, nie v rem — pozri komentár pri
   tokene vyššie), takže medzera sedí na oboch šírkach a na cudzom webe funguje
   bez ACSS, aj bez jeho root-font-size prepočtu.

   Používajú to oba režimy: [wa_instant_search] si obal vykreslí sám, a šablóna,
   ktorá potrebuje do stĺpcov vložiť aj vlastný obsah, si tieto triedy napíše na
   svoje obaly. Kontrakt je zdokumentovaný v README.
--------------------------------------------------------------------------- */
/* `body` prefix len kvôli špecificite — Oxygenov `.ct-div-block` má rovnakú
   váhu a načítava sa neskôr. Bez toho sa dvojstĺpec zloží aj na desktope. */
body .wa-is-shell {
	display: flex;
	flex-direction: row;
	align-items: stretch;
	gap: var( --wa-space-l-fluid );
	width: 100%;
}
body .wa-is-shell__sidebar {
	width: 22%;
	min-width: 22%;
}
body .wa-is-shell__content {
	width: 100%;
}

@media screen and ( max-width: 1024px ) {
	body .wa-is-shell {
		flex-direction: column;
	}
	/* Sidebar je v DOM prvý, aby ho na desktope netreba preskakovať. Na mobile
	   patrí jeho obsah (podporný box) POD výsledky — facety sa aj tak otvárajú
	   v dialógu, nie tu. */
	body .wa-is-shell__sidebar {
		width: 100%;
		min-width: 0;
		order: 2;
	}
	body .wa-is-shell__content {
		order: 1;
	}
}

/* The "Potrebujete poradiť?" box belongs under the facets, not above them: the
   sidebar is a flex column, so this is an order swap and not a DOM move. The
   facets keep the implicit order 0. */
.wa-is-shell__sidebar > .wa-support-box {
	order: 1;
}

/* ---------------------------------------------------------------------------
 * Toolbar — .wa-is-toolbar (sort facet + result count + mobile trigger)
 * ------------------------------------------------------------------------- */

/* Oxygen's .ct-div-block defaults to a flex column; force it, so the toolbar row
   below actually spans the content column instead of shrink-wrapping. */
.wa-is-rc .wa-is-toolbar {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	width: 100%;
}
.wa-is-rc .wa-is-toolbar-row {
	width: 100%;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	margin-bottom: var( --wa-space-xs );
	/* Oxygen used to give this block a --wa-space-s inset on all four sides via
	   universal.css, keyed off the class name below. Renaming the class detaches
	   it from that theme rule, so the block (top/bottom) side of the inset is
	   reproduced here explicitly; the inline side was already zeroed because it
	   pulled the sort control and the result count ~15px inside the content
	   column and left them out of line with the product grid underneath — the
	   toolbar spans the column. --space-s is itself fluid in ACSS (clamp, not a
	   flat rem), so the borrowed inset uses --wa-space-s-fluid, not the static
	   --wa-space-s token — the static one is only accurate above 1340px. */
	padding-block: var( --wa-space-s-fluid );
	padding-inline: 0;
}
/* Sort + result-count row. Oxygen's universal.css styles .wa-archive-sorting-filters
   through a :not(.ct-section):not(.oxy-easy-posts) selector — specificity (0,3,0),
   loaded after this file — so its `align-items: center` beats our `stretch` below
   1024px and the row shrink-wrapped to its content (~390px) instead of spanning the
   column. An explicit width on the child is unopposed, so it fixes it without
   !important. Own class (.wa-is-sorting-row), not the Oxygen utility one. */
.wa-is-rc .wa-is-sorting-row {
	width: 100%;
	flex: 1 1 auto;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	min-width: 0;
}

/* Bunka s počtom výsledkov, zarovnaná doprava. Doteraz to robila utilita
   `justify-content--end` z Automatic.css — jediná z tých, čo markup nosil,
   ktorá naozaj niečo robila (bez nej element spadol z flex na block).
   Odmerané na 1440 aj 390 px, obe hodnoty sú tu reprodukované. */
.wa-is-rc .wa-is-count-cell {
	display: flex;
	justify-content: flex-end;
}

/* "FILTROVAŤ PRODUKTY" — hidden on desktop, full-width button below 1024px.
   flex-direction is spelled out because Oxygen's .ct-link sets `column`, which
   would stack the funnel icon above the label. */
.wa-is-rc .wa-is-filter-trigger {
	display: none !important;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	padding: var( --wa-space-xs ) 24px;
	margin-bottom: var( --wa-space-l );
	border: 0;
	border-radius: var( --wa-radius-s );
	background-color: var( --wa-primary );
	color: var( --wa-white );
	font-size: var( --wa-text-l );
	font-weight: 500;
	line-height: 1.2;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
}
.wa-is-rc .wa-is-filter-trigger:hover {
	background-color: var( --wa-primary-hover );
	color: var( --wa-white );
}
.wa-is-rc .wa-is-filter-trigger .wa-is-icon svg {
	display: block;
	width: 1em;
	height: 1em;
	fill: currentColor;
}

/* `oxy-wa-is-facet` a `wa-sidebar-widget` sa NEPREMENÚVAJÚ: štyluje ich aj
   kompilované CSS scorg postu 169 (téma). Premenovať ich znamená zmeniť aj ten
   post — to do fázy 5 nepatrí, lebo post 169 je hlavička, nie výsledková
   stránka. Zapísané 25. 8. 2026 po overení v DOM.

   Súvisiaci nález (code review, 25. 8. 2026): post 169 má aj
   `.tax-product_cat .sorting--filter { padding: 0 !important }`. Dnes to
   nevadí — .tax-product_cat platí len na kategóriách a SPA tam ešte nebeží —
   ale vo fáze 6, keď sa SPA nasadí aj na kategórie, tento !important prebije
   náš `.wa-is-rc .wa-is-sort-cell` padding (viď nižšie) a treba ho vtedy
   zohľadniť. */

/* universal.css and 165-header-compiled.css also styled `.sorting--filter`
   directly (light background + rounded corners, plus an inset border that
   was quietly worth 2px of box height); renaming it detaches that, so it is
   reproduced here explicitly instead of silently dropped. The horizontal
   inset used --space-m's fluid curve — same treatment as --wa-space-l-fluid
   above, see --wa-space-m-fluid. */
.wa-is-rc .wa-is-sort-cell {
	background-color: var( --wa-shade-light );
	border: 1px solid var( --wa-shade-light );
	border-radius: 10px;
	padding: 0 var( --wa-space-m-fluid );
}

/* Sort facet (production facet 5). The custom WPGB combobox is JS-built there;
   a native select styled the same way is visually identical and keyboard-safe. */
.wa-is-rc .oxy-wa-is-facet.wa-is-sort-cell fieldset {
	margin: 0;
	padding: 0;
	border: 0;
}
.wa-is-rc .wa-is-sr-only {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect( 0, 0, 0, 0 );
	white-space: nowrap;
	border: 0;
}
.wa-is-rc .wa-is-sort-facet > label {
	position: relative;
	display: flex;
	align-items: center;
	margin: 0;
}
.wa-is-rc .wa-is-sort__select {
	appearance: none;
	-webkit-appearance: none;
	box-sizing: border-box;
	min-height: 40px;
	margin: 0;
	padding: 0 34px 0 8px;
	border: 0;
	border-radius: 4px;
	background: transparent;
	color: var( --wa-shade-dark );
	font-family: inherit;
	font-size: 15.2px; /* calc( var(--text-m) * 0.95 ) */
	line-height: 20px;
	cursor: pointer;
}
.wa-is-rc .wa-is-sort__select:focus {
	outline: none;
}
.wa-is-rc .wa-is-select-controls {
	position: absolute;
	right: 8px;
	top: 50%;
	transform: translateY( -50% );
	display: flex;
	align-items: center;
	pointer-events: none;
}
.wa-is-rc .wa-is-select-controls .wa-is-select-separator {
	display: none;
}
.wa-is-rc .wa-is-select-toggle {
	width: 20px;
	height: 20px;
	fill: #ccc;
	stroke: none;
}

/* Result count (production facet 1). */
.wa-is-rc .wa-is-result-count {
	display: inline-block;
	color: var( --wa-shade-dark );
	font-size: var( --wa-text-m );
	line-height: 1.4;
	white-space: nowrap;
}
.wa-is-rc .wa-is-result-count::before {
	content: 'Zobrazuje sa: ';
}

/* ---------------------------------------------------------------------------
 * Grid wrapper — WPGB masonry replaced by a plain CSS grid (gutter 0, exactly
 * like the pre-JS fallback in G2G1C2C1.css: 3 cols ≥993px, 2 cols below).
 * ------------------------------------------------------------------------- */

.wa-is-rc .wp-grid-builder,
.wa-is-rc .wa-is-wrapper,
.wa-is-rc .wa-is-main,
.wa-is-rc .wa-is-layout,
.wa-is-rc .wa-is-viewport {
	position: relative;
	width: 100%;
	height: auto !important;
}
.wa-is-rc .wa-is-masonry {
	display: grid;
	grid-template-columns: repeat( 3, 1fr );
	grid-gap: 0;
	gap: 0;
	align-items: stretch;
}
@media ( max-width: 992px ) {
	.wa-is-rc .wa-is-masonry {
		grid-template-columns: repeat( 2, 1fr );
	}
}

/* No masonry JS here: cards must stay in flow even with .wa-is-enabled set. */
.wa-is-rc .wp-grid-builder .wa-is-card,
.wa-is-rc .wp-grid-builder.wa-is-enabled .wa-is-card {
	position: relative;
	width: auto;
	left: auto;
	top: auto;
	height: auto;
	margin: 0;
	font-size: 16px;
	min-width: 0;
	z-index: 0;
}

/* ---------------------------------------------------------------------------
 * Card
 * ------------------------------------------------------------------------- */

.wa-is-rc .wa-is-card .wa-is-card-wrapper {
	display: block;
	height: calc( 100% + 1px );
	margin: -1px;
	background: var( --wa-white );
	visibility: visible;
	opacity: 1;
	transform: none;
}
.wa-is-rc .wa-is-card .wa-is-card-inner {
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	width: 100%;
	overflow: hidden;
	background: var( --wa-white );
	border: 1px solid var( --wa-shade-light );
}
.wa-is-rc .wa-is-card:hover {
	box-shadow: 0 0 47px var( --wa-shade-light );
	transition: all 0.4s ease;
	z-index: 1;
}

/* Media: empty svg spacer forces the 1:1 box, thumbnail is a background div. */
.wa-is-rc .wa-is-card .wa-is-card-media {
	position: relative;
	display: flex;
}
.wa-is-rc .wa-is-card .wa-is-card-media > svg[ data-ratio ] {
	display: block;
	width: 100%;
	height: 0;
}
.wa-is-rc .wa-is-card .wa-is-card-media-thumbnail {
	position: absolute;
	overflow: hidden;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}
.wa-is-rc .wa-is-card .wa-is-card-media-thumbnail > a {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	display: block;
	pointer-events: auto;
}
.wa-is-rc .wa-is-card .wa-is-card-inner .wa-is-card-media-thumbnail > a > div {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	height: 85%;
	margin-top: auto;
	background-position: bottom;
	background-repeat: no-repeat;
	background-size: contain;
}
.wa-is-rc .wa-is-card .wa-is-card-media-content {
	position: absolute;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	padding: 0;
	pointer-events: none;
}
.wa-is-rc .wa-is-card .wa-is-card-media-content > div {
	display: block;
	width: 100%;
}
.wa-is-rc .wa-is-card-media-content-top {
	position: absolute !important;
	top: 0;
	left: 0;
	right: 0;
	display: grid !important;
	grid-template-columns: 1fr;
	gap: calc( var( --wa-space-xs ) * 0.5 );
	width: 100%;
	padding: var( --wa-space-xs ) var( --wa-space-xs ) var( --wa-space-xs ) 0 !important;
}

/* Content column */
.wa-is-rc .wa-is-card .wa-is-card-content {
	position: relative;
	display: flex !important;
	flex-direction: column !important;
	align-items: center;
	flex-grow: 1;
	width: 100%;
	padding: var( --wa-space-xs ) var( --wa-space-m ) calc( var( --wa-space-m ) * 1.2 ) var( --wa-space-m );
}
.wa-is-rc .wa-is-card .wa-is-card-body {
	position: relative;
	flex: auto;
	width: 100%;
	background: transparent;
}
.wa-is-rc .wa-is-card [class*='wa-is-block-'] {
	position: relative;
	display: block;
	white-space: normal !important;
}
.wa-is-rc .wa-is-card [class*='wa-is-block-'] > a {
	border: none;
	box-shadow: none;
	color: inherit;
	text-decoration: none;
}

/* Stock label (block-3). */
.wa-is-rc .wa-is-card .wa-is-block-3 {
	color: var( --wa-accent ) !important;
	font-size: calc( var( --wa-text-m ) * 0.85 ) !important;
}
.wa-is-rc .wa-is-card .wa-is-card-body .wa-is-block-3 .wooptima-product-labels-block {
	/* Production: column flex with centred items = chip horizontally centred. */
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 5px;
	min-height: 29px;
}
.wa-is-rc .wa-is-card .wa-is-card-body .wooptima-product-label__stock_status {
	padding: 2.5px 5px;
}
.wa-is-rc .wa-is-card .wa-is-card-body .wooptima-product-label__stock_status {
	background: none !important;
}
.wa-is-rc .wa-is-card .wa-is-card-body .wooptima-product-label__stock_status.instock {
	color: var( --wa-instock );
	font-size: calc( var( --wa-text-s ) * 1.2 ) !important;
}
.wa-is-rc .wa-is-card .wa-is-card-body .wooptima-product-label__stock_status.outofstock,
.wa-is-rc .wa-is-card .wa-is-card-body .wooptima-product-label__stock_status.onbackorder {
	color: var( --wa-outofstock );
	font-size: calc( var( --wa-text-s ) * 1.2 ) !important;
}

/* Title (block-1). WPGB's own .wa-is-card-1 default is 700 — the site forces 400. */
.wa-is-rc .wa-is-card .wa-is-card-body .wa-is-block-1 {
	margin: 0 0 var( --wa-space-s );
	min-height: 40px;
	color: var( --wa-base );
	font-size: calc( var( --wa-text-m ) * 1.1 ) !important;
	font-weight: 400 !important;
	line-height: 1.4 !important;
}
.wa-is-rc .wa-is-card .wa-is-card-body .wa-is-block-1 > a {
	color: inherit;
}

/* Media labels (block-5): sale badge. */
.wa-is-rc .wa-is-card .wooptima-product-labels-block .wooptima-product-label__sale_percentage {
	display: inline-block;
	width: max-content !important;
	background: #cd1515 !important;
	color: #fff;
	font-size: var( --wa-text-s ) !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	text-transform: uppercase !important;
	padding: calc( var( --wa-space-xs ) * 0.6 ) var( --wa-space-s );
	border-top-right-radius: var( --wa-radius-xxl );
	border-bottom-right-radius: var( --wa-radius-xxl );
}
.wa-is-rc .wa-is-card .wooptima-product-labels-block .wooptima-product-label__sale_percentage.wooptima-product-label__nominal {
	background-color: #ea7e1e !important;
}

/* Footer: price left, add-to-cart right, both bottom-aligned. */
.wa-is-rc .wa-is-card .wa-is-card-footer {
	position: relative;
	width: 100%;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: flex-end;
	gap: calc( var( --wa-space-xs ) * 0.5 );
	background: transparent;
}
.wa-is-rc .wa-is-card .wa-is-card-footer span {
	white-space: nowrap;
}

/* Price. NOTE the inverted naming: __regular is the CURRENT price, __sale the
   crossed-out old one (ProductLabels.php::get_alza_prices_label_html). */
.wa-is-rc .wa-is-card .wa-al-card-price-wrapper,
.wa-is-rc .wa-is-card .wa-al-card-price--regular,
.wa-is-rc .wa-is-card .wa-al-card-price--onsale,
.wa-is-rc .wa-is-card .wa-al-card-price__bottom {
	display: flex !important;
	flex-direction: column;
}
.wa-is-rc .wa-is-card .wa-al-card-price-wrapper {
	width: 100%;
	max-width: 150px;
}
.wa-is-rc .wa-is-card .wa-al-card-price__regular {
	font-weight: 700;
	font-size: var( --wa-text-xl );
	line-height: 1;
	text-align: center;
}
.wa-is-rc .wa-is-card .wa-al-card-price__sale {
	font-weight: 400;
	font-size: calc( var( --wa-text-s ) * 1.2 );
	text-decoration: line-through;
	text-decoration-thickness: 1px;
	line-height: 1;
	text-align: center;
}
.wa-is-rc .wa-is-card .wa-al-card-price--regular .wa-al-card-price__regular {
	color: var( --wa-base );
	text-align: left;
}
.wa-is-rc .wa-is-card .wa-al-card-price--onsale .wa-al-card-price__top {
	padding: calc( var( --wa-space-xs ) * 0.8 ) calc( var( --wa-space-xs ) * 0.6 ) calc( var( --wa-space-xs ) * 0.5 );
	background: linear-gradient( 90deg, rgb( 255, 147, 147 ) 0%, rgb( 255, 53, 0 ) 100% );
	border-radius: var( --wa-radius-l ) var( --wa-radius-l ) 0 0;
	color: var( --wa-white ) !important;
	font-size: var( --wa-text-m );
	font-weight: 700;
	line-height: 1;
	text-transform: uppercase;
	white-space: nowrap;
	text-align: center;
}
.wa-is-rc .wa-is-card .wa-al-card-price--onsale .wa-al-card-price__bottom {
	padding: calc( var( --wa-space-xs ) * 0.5 ) calc( var( --wa-space-xs ) * 0.6 );
	background-color: #1c1c1c;
	border-radius: 0 0 var( --wa-radius-l ) var( --wa-radius-l );
}
.wa-is-rc .wa-is-card .wa-al-card-price--onsale .wa-al-card-price__regular,
.wa-is-rc .wa-is-card .wa-al-card-price--onsale .wa-al-card-price__sale {
	color: var( --wa-white );
}
.wa-is-rc .wa-is-card .wa-al-card-price__regular .woocommerce-Price-amount,
.wa-is-rc .wa-is-card .wa-al-card-price__sale .woocommerce-Price-amount {
	color: inherit;
	font-size: inherit;
	font-weight: inherit;
}

/* Add-to-cart (block-7) — Wooptima button block. */
.wa-is-rc .wa-is-card .wooptima-button-block {
	position: relative;
	z-index: 2;
	display: flex;
	justify-content: flex-end;
	/* px, nie rem: root font-size 62.5 % nastavuje Automatic.css, takže rem-ová
	   podoba by mimo neho dala 8px namiesto 5px. Túto premennú konzumuje
	   wooptima button block, nie tento súbor. */
	--roundness: 5px;
	--padding: 8.89px 13.5px;
	--text-size: 16px;
}
.wa-is-rc .wa-is-card .wooptima-button__add_to_cart > a {
	width: auto;
	height: auto;
	max-height: 40px;
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: 0 !important;
	box-sizing: border-box;
	padding: calc( var( --wa-space-xs ) * 0.8 ) 13.5px;
	border: none !important;
	border-radius: var( --wa-radius-xxl );
	font-size: var( --wa-text-m );
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: all 400ms ease-in-out;
}
.wa-is-rc .wa-is-card .wooptima-button__add_to_cart > .instock {
	background: var( --wa-accent );
	color: var( --wa-white );
}
/* Production: icon separated from the label (…>.instock>img {margin-right:var(--space-xs)}). */
.wa-is-rc .wa-is-card .wooptima-button__add_to_cart > a > img {
	margin-right: var( --wa-space-xs );
}
.wa-is-rc .wa-is-card .wooptima-button__add_to_cart > .instock:hover {
	background: var( --wa-accent-hover );
	border-color: var( --wa-accent-hover );
	color: var( --wa-white );
}
/* Nedostupný produkt: tlačidlo sa nesmie čítať ako „kúpiť". Produkcia mu dáva
   ružové #FFDCE2 s accent textom (165-header-compiled.css); tu je zámerne šedé
   „disabled" s kontrastným textom „Zobraziť" a ikonou „i" v krúžku — je to
   odkaz na detail produktu, nie akcia košíka. Odchýlka od produkcie je vedomá
   a vyžiadaná; ostatné rozmery (radius, padding, výška) zostávajú spoločné,
   aby sa mriežka nerozskákala, keď sa v riadku miešajú oba stavy. */
/* Špecificita zámerne 6 tried: to isté pravidlo nesie aj kompilované CSS témy
   (uploads/scorg/css/165-header-compiled.css, `.wa-primary-product-grid
   .wa-is-card .wa-is-card-footer .wooptima-button__add_to_cart > .outofstock`,
   5 tried) a naša mriežka tú triedu stále nosí. Slabšie pravidlo by prehralo
   a tlačidlo by zostalo ružové. Šiestu triedu dodáva náš vlastný `.wa-is-block-7`,
   nie ďalšie zopakovanie cudzej — sledovanú väzbu to nerozširuje. */
.wa-is-rc .wa-is-card .wa-is-card-footer .wa-is-block-7 .wooptima-button__add_to_cart > a.outofstock {
	background: #e6e6e9;
	color: #5b5b60;
}
.wa-is-rc .wa-is-card .wa-is-card-footer .wa-is-block-7 .wooptima-button__add_to_cart > a.outofstock:hover {
	background: #dcdce0;
	color: #3f3f44;
}
.wa-is-rc .wa-is-card .wooptima-button__add_to_cart > a > img {
	width: 18px !important;
	height: 18px !important;
	margin-right: var( --wa-space-xs ) !important;
	flex: 0 0 auto;
}
/* CRITICAL: Wooptima's delegated handler tests `event.target.dataset`, not
   closest() — a click landing on the icon or the label would be ignored.
   Production gets this from wooptima-gridbuilder-blocks.css; our cards are not
   inside a real WPGB grid, so it has to be repeated here. */
.wa-is-rc .wooptima-button-block a img,
.wa-is-rc .wooptima-button-block a svg,
.wa-is-rc .wooptima-button-block a span {
	pointer-events: none;
}

/* Whole-card overlay link: below the button, above everything else. */
.wa-is-rc .wa-is-card .wa-is-card-layer-link {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	pointer-events: auto;
	z-index: 1;
}
.wa-is-rc .wa-is-card .wa-is-card-body .wa-is-block-1 {
	z-index: 2;
}

/* ---------------------------------------------------------------------------
 * Skeleton (loading state) — sits in the same grid as the real cards.
 * ------------------------------------------------------------------------- */
.wa-is-card--skeleton {
	pointer-events: none;
	border: 1px solid var( --wa-shade-light );
	background: #fff;
	padding-bottom: 16px;
}
.wa-is-card--skeleton .wa-is-card__media {
	aspect-ratio: 1 / 1;
	background: var( --rc-soft );
}
.wa-is-sk-line {
	height: 12px;
	margin: 10px 22px 0;
	border-radius: 6px;
	background: var( --rc-soft );
}
.wa-is-sk-line--short {
	width: 55%;
}
.wa-is-card--skeleton .wa-is-card__media,
.wa-is-sk-line {
	animation: wa-is-pulse 1.2s ease-in-out infinite;
}
@keyframes wa-is-pulse {
	50% { opacity: .55; }
}

/* States */
.wa-is-state {
	padding: 40px 16px;
	text-align: center;
	color: var( --rc-muted );
	font-size: 15px;
}
.wa-is-sentinel {
	height: 1px;
}

/* ---------------------------------------------------------------------------
 * Pagination area — .wa-is-pagination-area holds the (hidden) load-more facet
 * and the numbered pagination facet, exactly as on production.
 * ------------------------------------------------------------------------- */
.wa-is-pagination-area {
	width: 100%;
	/* Tied specificity with universal.css's own (equal-weight, later-loaded)
	   .wa-archive-pagination rule used to let the theme's real fluid --space-l
	   win here. Renaming detaches it from that rule, so the fluid curve is used
	   directly instead of the desktop-only static token. */
	margin-top: var( --wa-space-l-fluid );
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	font-family: 'Mukta', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}
.wa-is-pagination-area button.wa-is-button {
	width: 100%;
	height: auto;
	max-height: unset;
	margin: 0;
	padding: 15px 36px;
	border: none;
	box-shadow: none;
	border-radius: var( --wa-radius-s );
	background-color: var( --wa-primary );
	color: #fff;
	cursor: pointer;
	font-size: var( --wa-text-m );
	font-weight: 500;
	line-height: 20px;
	letter-spacing: 1px;
	transition: background-color ease 0.25s;
}
.wa-is-pagination-area button.wa-is-button:not( [disabled] ):hover,
.wa-is-pagination-area button.wa-is-button:not( [disabled] ):focus {
	background-color: var( --wa-primary-hover );
}
/* Production runs numbered pagination, so the load-more facet is display:none. */
.wa-is-pagination-area .wa-is-facet-7 {
	display: none;
}
.wa-is-pagination-area .wa-is-pagination-facet {
	margin-left: auto;
}
.wa-is-pagination-area .wa-is-pagination {
	position: relative;
	display: inline-block;
	margin: 0 -10px; /* --wa-is-pagination-horizontal-spacing: 20px */
	padding: 0;
	list-style: none;
}
.wa-is-pagination-area .wa-is-pagination li.wa-is-page {
	position: relative;
	display: inline-block;
	height: auto;
	min-width: auto;
	margin: 0 10px;
	padding: 0;
	cursor: default;
	font-size: var( --wa-text-m );
	font-weight: bold;
	line-height: 32px;
	list-style: none;
	text-align: center;
	vertical-align: middle;
}
.wa-is-pagination-area .wa-is-page > a,
.wa-is-pagination-area .wa-is-page > span {
	position: relative;
	display: block;
	padding: 10px 20px;
	border: none;
	border-radius: var( --wa-radius-s );
	box-shadow: none;
	color: var( --wa-shade-dark );
	font-size: var( --wa-text-m );
	font-weight: normal;
	line-height: 32px;
	text-decoration: none;
}
.wa-is-pagination-area .wa-is-page > a:hover {
	color: var( --wa-primary-hover );
}
.wa-is-pagination-area .wa-is-page > a[ aria-current='true' ] {
	color: var( --wa-primary );
	background-color: var( --wa-primary-ultra-light );
	font-weight: 700;
}
.wa-is-pagination-area .wa-is-page > span.wa-is-dots-page {
	color: var( --wa-shade-medium );
}
.wa-is-pagination-area .wa-is-pagination li:last-child a {
	font-weight: 700;
	color: var( --wa-primary );
}

@media ( max-width: 1024px ) {
	.wa-is-rc .wa-is-filter-trigger {
		display: flex !important;
	}
	.wa-is-rc .wa-is-toolbar-row {
		flex-direction: column;
		align-items: stretch;
		/* Theme's universal.css reset this to 0 on all sides below 1024px too —
		   keep the borrowed padding-block/-inline value in sync here. */
		padding-block: 0;
	}
	.wa-is-pagination-area {
		flex-direction: column;
	}
}
@media ( max-width: 480px ) {
	.wa-is-rc .wa-is-filter-trigger {
		/* 5438-header-compiled.css carried an !important margin-bottom keyed off
		   this element's old, theme-shared class name — but only inside its own
		   max-width:480px block, NOT the 1024px one. Above 480px the static
		   --wa-space-l (33px) below still wins there via specificity, unopposed.
		   Renaming detaches this element from that rule at <=480px, so the fluid
		   value is reproduced here explicitly, scoped to the same breakpoint. */
		margin-bottom: var( --wa-space-l-fluid );
	}
}
@media ( max-width: 768px ) {
	.wa-is-rc .wa-is-card .wa-is-card-content {
		padding-left: var( --wa-space-xs );
		padding-right: var( --wa-space-xs );
		padding-bottom: var( --wa-space-s );
	}
	.wa-is-rc .wa-is-card .wa-al-card-price__regular {
		font-size: calc( var( --wa-text-xl ) * 0.8 );
	}
	.wa-is-rc .wa-is-card .wooptima-button__add_to_cart {
		font-size: 0 !important;
	}
	.wa-is-rc .wa-is-card .wooptima-button__add_to_cart > a > span {
		display: none !important;
	}
	.wa-is-rc .wa-is-card .wooptima-button__add_to_cart > a > img {
		margin-right: 0 !important;
		width: 22px !important;
		height: 22px !important;
	}
	.wa-is-pagination-area .wa-is-page > a,
	.wa-is-pagination-area .wa-is-page > span {
		padding: 6px 10px;
	}
	.wa-is-pagination-area .wa-is-pagination li.wa-is-page {
		margin: 0 2px;
	}
}

/* ---------------------------------------------------------------------------
 * Facet sidebar — rendered into cfg.sidebarSelector (.wa-is-facets) inside the
 * template's .wa-is-shell__sidebar column, i.e. OUTSIDE .wa-is-rc, so the
 * token block at the top of this file lists it explicitly.
 *
 * The structural facet CSS (.wa-is-checkbox-control, .wa-is-range-slider,
 * .wa-is-toggle-hidden, …) used to ship in a bundled stylesheet enqueued
 * alongside this file; that stylesheet is gone (commit 77726f76). Everything
 * below is the SITE layer: the per-facet-ID
 * overrides from 39.css (purple accents, round controls), .wa-sidebar-widget
 * from universal.css and the off-canvas drawer from 193-header-compiled.css —
 * with every value resolved to px (1rem = 10px on production).
 * ------------------------------------------------------------------------- */

.wa-is-facets {
	font-family: 'Mukta', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	color: var( --wa-base );
}

/* universal.css .wa-sidebar-widget — the light-purple facet box. */
.wa-is-facets .wa-sidebar-widget {
	margin-bottom: var( --wa-space-m );
	padding: var( --wa-space-m );
	border-radius: var( --wa-radius-l );
	background-color: var( --wa-secondary );
}

/* Facet titles. WPGB's base is 20px/24px with a 24px bottom margin; every facet
   on production overrides it to --text-m/700/--base with --space-xs below, and
   .wa-sidebar-widget adds --space-m above (0 for the first facet). */
.wa-is-facets .wa-is-facet .wa-is-facet-title {
	margin: var( --wa-space-m ) 0 var( --wa-space-xs );
	padding: 0;
	color: var( --wa-base );
	font-size: var( --wa-text-m );
	font-weight: 700;
	line-height: 1.2;
}
.wa-is-facets .oxy-wa-is-facet:first-child .wa-is-facet .wa-is-facet-title {
	margin-top: 0;
}
/* .oxy-wa-is-facet drops WPGB's 40px fieldset gap; the title margin is the gap. */
.wa-is-facets .oxy-wa-is-facet .wa-is-facet > fieldset:last-child {
	margin-bottom: 0;
}
.wa-is-facets .wa-is-facet fieldset {
	min-width: 0;
	margin: 0;
	padding: 0;
	border: none;
}
.wa-is-facets .wa-is-facet fieldset legend.wa-is-sr-only {
	height: 1px;
	width: 1px;
}
.wa-is-facets .wa-is-sr-only {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect( 0 0 0 0 );
	white-space: nowrap;
	border: 0;
}

/* --- Štruktúra facetov (bola vo vendorovanom CSS, commit 77726f76) --------
   Fáza 1b zmazala bundlované cudzie CSS s auditom podľa NÁZVOV tried: trieda,
   ktorú náš súbor spomínal, sa počítala za pokrytú. Lenže náš súbor tieto
   triedy len prefarboval — `.wa-is-checkbox-control` mal `border-color`, nie
   rozmer, orámovanie ani odfajknutie; `.wa-is-range-slider` nemal dráhu;
   `.wa-is-toggle-hidden` nemal vôbec nič. Výsledok: checkboxy neviditeľné,
   „+ Ďalších N" ako holé systémové tlačidlo, cenový posuvník bez dráhy aj
   úchytov, teda neovládateľný.

   Nasleduje presne tá chýbajúca štruktúra, opísaná z produkčného
   `style(1).css` (bajt v bajt ten istý súbor, čo commit 77726f76 zmazal).
   Ide zámerne o NIŽŠIU špecificitu než sekcie s prefarbením nižšie, aby si
   brandové prepisy (fialová, okrúhle kontrolky) naďalej sadli navrch.
--------------------------------------------------------------------------- */

/* Nedostupná hodnota — pôvodný zdroj ju značí cez tabindex="-1". */
.wa-is-facets .wa-is-facet [class^='wa-is'][role='button'][tabindex='-1'] {
	opacity: 0.4;
	cursor: not-allowed;
}
.wa-is-facets .wa-is-facet [class^='wa-is'][role='button'][tabindex='-1'] * {
	pointer-events: none;
}

.wa-is-facets .wa-is-facet .wa-is-checkbox-facet .wa-is-checkbox {
	display: flex;
	margin: 0;
	padding: 0;
	line-height: 1;
	list-style: none;
	outline: none;
	box-shadow: none;
}
.wa-is-facets .wa-is-facet .wa-is-checkbox-facet .wa-is-checkbox-control {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	height: 20px;
	width: 20px;
	/* Vlastný `box-sizing`, nie zdedený: pôvodné pravidlo sa spoliehalo na reset
	   `* { box-sizing: border-box }` z témy. Bez neho sa 2px rám priráta k
	   rozmeru a kontrolka narastie na 24px — presne to sa stane na webe, ktorý
	   ten reset nemá. To isté platí pre úchyt posuvníka nižšie. */
	box-sizing: border-box;
	border-radius: 4px;
	border-style: solid;
	border-width: 2px;
	cursor: pointer;
	transition: border-color ease 0.25s, background-color ease 0.25s;
}
/* Vodorovná čiarka pre „mixed" (rodič s časťou zaškrtnutých detí). */
.wa-is-facets .wa-is-facet .wa-is-checkbox-facet .wa-is-checkbox-control::before {
	content: '';
	position: absolute;
	z-index: 1;
	height: 2px;
	width: 8px;
	border-style: solid;
	border-width: 2px 0 0;
	box-sizing: border-box;
	transform: scale( 0 );
	transition: transform ease 0.25s, border-color ease 0.25s;
}
/* Odfajknutie: dva okraje otočené o 45°, zväčšené až po zaškrtnutí. */
.wa-is-facets .wa-is-facet .wa-is-checkbox-facet .wa-is-checkbox-control::after {
	content: '';
	position: relative;
	top: -1px;
	height: 10px;
	width: 6px;
	border: solid transparent;
	border-width: 0 2px 2px 0;
	box-sizing: border-box;
	transform: rotate( 45deg ) scale( 0 );
	transition: transform ease 0.25s, border-color ease 0.25s;
}
.wa-is-facets .wa-is-facet .wa-is-checkbox-facet .wa-is-checkbox[ aria-pressed='mixed' ] .wa-is-checkbox-control::before {
	transform: scale( 1 );
}
.wa-is-facets .wa-is-facet .wa-is-checkbox-facet .wa-is-checkbox[ aria-pressed='true' ] .wa-is-checkbox-control::after {
	border: solid #fff;
	border-width: 0 2px 2px 0;
	transform: rotate( 45deg ) scale( 1 );
}
/* Základ menovky; prefarbenie a rozloženie počtu doplní sekcia nižšie. */
.wa-is-facets .wa-is-facet .wa-is-checkbox-label {
	flex: auto;
	margin: 0;
	padding: 0 0 0 8px;
	font-size: 16px;
	font-weight: normal;
	line-height: 20px;
	cursor: pointer;
}

/* Rozsahový (cenový) facet — bez týchto pravidiel nemá posuvník dráhu ani
   úchyty, takže sa nedá chytiť ani myšou. */
.wa-is-facets .wa-is-facet .wa-is-range-facet {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	margin: 0;
	padding: 0;
}
.wa-is-facets .wa-is-facet .wa-is-range-facet .wa-is-range-slider {
	position: relative;
	width: 100%;
	height: 6px;
	margin: 6px 0 16px;
	background-color: rgba( 204, 204, 204, 0.4 );
	border-radius: 4px;
	touch-action: none;
	cursor: pointer;
}
.wa-is-facets .wa-is-facet .wa-is-range-facet .wa-is-range-slider .wa-is-range-progress {
	position: absolute;
	left: 8px;
	right: 8px;
	height: 100%;
	background-color: #2684ff;
	transform: scale( 0 );
	transform-origin: 0 50%;
	will-change: transform;
	cursor: pointer;
}
/* Dráha je z oboch strán zúžená o 8px (polovica úchytu), aby úchyt v krajnej
   polohe nevytŕčal — prepočet pozícií v dragSlider() s tým ráta. */
.wa-is-facets .wa-is-facet .wa-is-range-facet .wa-is-range-slider .wa-is-range-thumbs {
	position: absolute;
	left: 8px;
	right: 8px;
	top: 50%;
	height: 0;
}
.wa-is-facets .wa-is-facet .wa-is-range-facet .wa-is-range-slider .wa-is-range-thumb {
	position: absolute;
	z-index: 2;
	top: 50%;
	height: 16px;
	width: 16px;
	box-sizing: border-box;
	border-radius: 8px;
	background-color: #fff;
	border: 2px solid #2684ff;
	transform: translate( -50%, -50% );
	cursor: pointer;
}
.wa-is-facets .wa-is-facet .wa-is-range-facet .wa-is-range-values {
	position: relative;
	align-items: center;
	flex-grow: 1;
	padding: 4px 0;
	font-size: 16px;
	line-height: 18px;
	font-variant-numeric: tabular-nums;
}
.wa-is-facets .wa-is-facet .wa-is-range-facet .wa-is-range-clear {
	position: relative;
	height: auto;
	max-height: unset;
	margin: 0;
	padding: 8px;
	background: rgba( 204, 204, 204, 0.35 );
	border: none;
	border-radius: 4px;
	box-shadow: none;
	color: #2a2a2a;
	font-style: unset;
	font-size: 14px;
	font-weight: 500;
	line-height: 16px;
	letter-spacing: 0;
	text-decoration: unset;
	text-transform: none;
	cursor: pointer;
	-webkit-appearance: none;
	transition: background-color ease 0.25s;
}
.wa-is-facets .wa-is-facet .wa-is-range-facet .wa-is-range-clear:hover:not( [disabled] ) {
	background: rgba( 204, 204, 204, 0.25 );
}
.wa-is-facets .wa-is-facet .wa-is-range-facet .wa-is-range-clear[ disabled ] {
	opacity: 0.6;
	cursor: not-allowed;
	transition: none;
}

/* „+ Ďalších N" / „- Menej". */
.wa-is-facets .wa-is-facet .wa-is-toggle-hidden {
	position: relative;
	display: block;
	height: auto;
	max-height: unset;
	margin: 16px 0 0;
	padding: 8px;
	background: rgba( 204, 204, 204, 0.35 );
	border: none;
	border-radius: 4px;
	box-shadow: none;
	color: #2a2a2a;
	font-style: unset;
	font-size: 14px;
	font-weight: 500;
	line-height: 16px;
	letter-spacing: 0;
	text-decoration: unset;
	text-transform: none;
	cursor: pointer;
	-webkit-appearance: none;
	transition: background-color ease 0.25s;
}
.wa-is-facets .wa-is-facet .wa-is-toggle-hidden:hover {
	background: rgba( 204, 204, 204, 0.25 );
}

/* --- Checkbox facets ---------------------------------------------------- */
/* Production overrides the WPGB accent (#0069ff) per facet ID; every facet in
   the sidebar gets the brand purple, and the named ones (Cena, Výrobca, Farba,
   Distribúcia, Stav produktu → .wa-is--round) also get a circular control. */
.wa-is-facets .wa-is-facet .wa-is-checkbox-facet .wa-is-checkbox .wa-is-checkbox-control {
	border-color: var( --wa-primary );
}
.wa-is-facets .wa-is-facet .wa-is-checkbox-facet .wa-is-checkbox[ aria-pressed='true' ] .wa-is-checkbox-control {
	background-color: var( --wa-primary );
	border-color: var( --wa-primary );
}
.wa-is-facets .wa-is-facet .wa-is--round .wa-is-checkbox-control,
.wa-is-facets .wa-is--round .wa-is-checkbox-facet .wa-is-checkbox-control {
	border-radius: 50%;
}
.wa-is-facets .wa-is-facet .wa-is-checkbox:focus .wa-is-checkbox-control,
.wa-is-facets .wa-is-facet .wa-is-toggle-hidden:focus,
.wa-is-facets .wa-is-facet .wa-is-range-clear:focus,
.wa-is-facets .wa-is-facet .wa-is-range-thumb:focus {
	outline-color: var( --wa-primary-light ) !important;
}
/* WPGB's sidebar convention: label left, count right. */
.wa-is-facets .wa-is-facet .wa-is-checkbox-label {
	display: flex;
	justify-content: space-between;
	gap: 8px;
	color: var( --wa-base );
}
.wa-is-facets .wa-is-opt__count {
	flex: 0 0 auto;
	color: var( --wa-shade-medium );
	font-size: var( --wa-text-s );
	font-variant-numeric: tabular-nums;
}
/* --- Range (price) facet ------------------------------------------------- */
.wa-is-facets .wa-is-facet .wa-is-range-facet .wa-is-range-slider .wa-is-range-progress {
	background-color: var( --wa-primary );
}
.wa-is-facets .wa-is-facet .wa-is-range-facet .wa-is-range-slider .wa-is-range-thumb {
	background-color: var( --wa-primary );
	border-color: var( --wa-primary );
	border-width: 3px;
}
.wa-is-facets .wa-is-facet .wa-is-range-facet .wa-is-range-values {
	color: var( --wa-base );
	font-size: var( --wa-text-m );
}
/* The state inputs are hidden (WPGB hides them the same way). */
.wa-is-facets .wa-is-facet .wa-is-range-facet input {
	display: none;
}

/* --- Clear all ----------------------------------------------------------- */
/* WPGB's reset facet, recoloured off its default red onto the brand. */
.wa-is-facets .wa-is-clear.wa-is-reset {
	width: 100%;
	margin: var( --wa-space-m ) 0 0;
	padding: 10px 16px;
	background-color: var( --wa-white );
	border-radius: var( --wa-radius-s );
	color: var( --wa-primary );
	font-size: var( --wa-text-m );
	font-weight: 500;
	line-height: 1.2;
	cursor: pointer;
}
.wa-is-facets .wa-is-clear.wa-is-reset:hover {
	background-color: var( --wa-primary );
	color: var( --wa-white );
}

/* --- Facety: stĺpec nad 1024px, modálny drawer pod ním -------------------- */

/* Zatvorený <dialog> je z UA štýlu display:none. Nad breakpointom ho vraciame
   do layoutu — bez tohto pravidla facety zmiznú z celej širokej obrazovky, a je
   to tichá strata, nie chyba. Preto na to existuje test. */
@media screen and ( min-width: 1025px ) {
	dialog.wa-is-facets {
		display: block;
		position: static;
		width: 100%;
		max-width: none;
		max-height: none;
		margin: 0;
		padding: 0;
		border: 0;
		background: none;
		color: inherit;
		overflow: visible;
	}
}

@media screen and ( max-width: 1024px ) {
	dialog.wa-is-facets {
		position: fixed;
		top: 0;
		left: 0;
		right: auto;
		z-index: 10000002;
		width: 80vw;
		max-width: none;
		min-width: 250px;
		height: 100vh;
		max-height: 100vh;
		margin: 0;
		padding: var( --wa-space-m, 22px );
		border: 0;
		overflow-x: hidden;
		overflow-y: auto;
		background: #fff;
		box-shadow: 0 0 20px var( --wa-primary-ultra-dark-trans-10, rgba( 27, 14, 37, 0.1 ) );
		transform: translate( -100% );
		transition: transform 0.4s cubic-bezier( .77, 0, .175, 1 );
	}
	dialog.wa-is-facets[open] {
		transform: translate( 0% );
	}
	dialog.wa-is-facets::backdrop {
		background: rgba( 27, 14, 37, 0.4 );
	}
	/* Widget box nemá vnútri bieleho draweru zmysel. */
	.wa-is-facets .wa-sidebar-widget {
		margin-bottom: 0;
		padding: 0;
		background: none;
	}
}

/* Active filter chips (production facet 4 — empty in the archive, so the look is
   ours; kept in the wpgb key: brand purple on --primary-ultra-light, --radius-s,
   --text-m typography). */
.wa-is-active {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 0 0 var( --wa-space-xs );
}
.wa-is-active[ hidden ] {
	display: none;
}
.wa-is-active__label {
	color: var( --wa-shade-dark );
	font-size: calc( var( --wa-text-m ) * 0.875 );
	font-weight: 700;
}
.wa-is-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	border: 1px solid var( --wa-primary-light );
	border-radius: var( --wa-radius-s );
	background: var( --wa-primary-ultra-light );
	color: var( --wa-primary );
	font-family: inherit;
	font-size: calc( var( --wa-text-m ) * 0.875 );
	line-height: 1.2;
	cursor: pointer;
	transition: border-color .12s, color .12s, background .12s;
}
.wa-is-chip:hover {
	border-color: var( --wa-primary );
	background: var( --wa-primary-light );
	color: var( --wa-primary-hover );
}
.wa-is-chip svg {
	flex: 0 0 auto;
	opacity: .7;
}
.wa-is-active__clear {
	border: 0;
	background: none;
	padding: 4px 6px;
	color: var( --wa-primary );
	font-family: inherit;
	font-size: calc( var( --wa-text-m ) * 0.875 );
	font-weight: 500;
	text-decoration: underline;
	cursor: pointer;
}

/* Rewrite notice ("Zobrazujeme výsledky pre …") */
.wa-is-rewrite {
	font-size: 14px;
	line-height: 1.5;
	color: var( --rc-muted );
	margin: 0 0 12px;
}

/* --- Prevzaté z vendorovaného CSS, ktoré fáza 1b zmazala -------------------
   Týchto päť tried náš vlastný súbor neštýloval; všetko ostatné, čo emitujeme,
   už tu bolo. Pravidlá sú opísané z pôvodného súboru, nie vymyslené — zdroj je
   v histórii, commit 77726f76 (pred zmazaním bundlovaného CSS).             */

body .wa-is-facet ul.wa-is-expanded li[hidden] {
	display: inherit;
}

.wa-is-facet .wa-is-hierarchical-list {
	position: relative;
	display: block;
	margin: 0;
	padding: 0;
	list-style: none;
}

.wa-is-facet .wa-is-hierarchical-list li {
	display: block;
	margin: 12px 0 0;
	padding: 0;
	line-height: 1;
	list-style: none;
}

/* Položky nad `facetLimit` dostávajú `hidden` a odkryje ich až „zobraziť viac".
   Pravidlo vyššie (0,2,1) ale prebíja UA `[hidden] { display: none }` (0,1,0),
   takže sa kreslili všetky — facet Procesor vypisoval 168 hodnôt namiesto 8
   a stránka kategórie merala 14 290 px. Špecificita (0,3,1) je zámerne nižšia
   než `ul.wa-is-expanded li[hidden]` (0,3,3) o pár riadkov vyššie, aby
   „zobraziť viac" naďalej fungovalo. */
.wa-is-facet .wa-is-hierarchical-list li[hidden] {
	display: none;
}

.wa-is-facet .wa-is-hierarchical-list:first-child > li:first-child {
	margin: 0;
}

.wa-is-facet .wa-is-hierarchical-list ul {
	margin: 0 0 0 20px;
	list-style: none;
}

.wa-is-facet .wa-is-hierarchical-list label {
	position: relative;
	display: -ms-flexbox;
	display: flex;
	margin: 0;
	padding: 0;
}

.wa-is-facet .wa-is-hierarchical-list input {
	position: absolute;
	width: 0;
	height: 0;
	opacity: 0;
	-webkit-appearance: none;
}

.rtl .wa-is-facet .wa-is-hierarchical-list li ul {
	margin: 0 20px 0 0;
}

.wa-is-facet .wa-is-apply,
.wa-is-facet .wa-is-load-more {
	background-color: #0069ff;
}

.wp-grid-builder .wa-is-card .wa-is-card-media-thumbnail .wa-is-noscript-img {
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	width: 100%;
	transform: translateY( -50% );
}

@supports ( (-o-object-fit: cover) or (object-fit: cover) ) {
	.wp-grid-builder .wa-is-card .wa-is-card-media-thumbnail .wa-is-noscript-img {
		top: 0;
		height: 100%;
		-o-object-fit: cover;
		object-fit: cover;
		transform: none;
	}
}