/* ═══════════════════════════════════════════════════════════════════
   ARFEKTA – parduotuvė, kategorijos, prekių kortelės

   Kraunamas TIK WooCommerce puslapiuose (žr. functions.php).

   Taikomasi į WooCommerce numatytąjį markup'ą (ul.products, li.product),
   nes savų šablonų neperrašinėjame – vienas woocommerce.php apvalkalas
   plius stiliai. Todėl daug kur reikia didesnio specifiškumo: legacy.css
   turi savo taisykles su !important.

   1rem = 10px (legacy.css nustato html{font-size:62.5%}), todėl čia
   visur px – kad nebūtų netikėtumų.
   ═══════════════════════════════════════════════════════════════════ */

:root {
	--p-oranzine: #f37a1f;
	--p-oranzine-t: #d9640c;
	--p-tamsi: #2b3444;
	--p-tekstas: #22282f;
	--p-silpnas: #6b7480;
	--p-linija: #e4e7ec;
	--p-fonas: #f6f7f9;
	--p-zalia: #2e7d43;
}

/* ── Kategorijos antraštė ──────────────────────────────────────── */

.woocommerce-products-header {
	margin: 0 0 22px;
	padding-bottom: 18px;
	border-bottom: 2px solid var(--p-tamsi);
}

.woocommerce-products-header__title,
.woocommerce-products-header .page-title {
	margin: 0;
	font-size: 30px;
	line-height: 1.2;
	font-weight: 800;
	letter-spacing: -.02em;
	color: var(--p-tamsi);
}

.woocommerce-breadcrumb {
	margin: 0 0 14px;
	font-size: 13px;
	color: var(--p-silpnas);
}

.woocommerce-breadcrumb a {
	color: var(--p-silpnas);
	text-decoration: none;
}

.woocommerce-breadcrumb a:hover {
	color: var(--p-oranzine-t);
}

/* ── Įrankių juosta: kiekis + rūšiavimas ───────────────────────── */

.woocommerce .woocommerce-result-count,
.woocommerce .woocommerce-ordering {
	margin: 0;
}

.woocommerce-notices-wrapper:empty {
	display: none;
}

.arf-toolbar,
.woocommerce .products ~ .woocommerce-ordering {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	align-items: center;
	justify-content: space-between;
	margin: 0 0 22px;
	padding: 12px 15px;
	background: var(--p-fonas);
	border: 1px solid var(--p-linija);
}

.woocommerce .woocommerce-result-count {
	font-size: 14px;
	color: var(--p-silpnas);
}

.woocommerce .woocommerce-ordering select,
.woocommerce-page .woocommerce-ordering select {
	height: 38px;
	padding: 0 34px 0 12px;
	border: 1px solid var(--p-linija);
	background: #fff;
	font-size: 14px;
	font-family: inherit;
	color: var(--p-tekstas);
	border-radius: 0;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7480' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 10px center;
	background-size: 16px;
}

/* ── Prekių tinklelis ──────────────────────────────────────────── */

.woocommerce ul.products,
.woocommerce-page ul.products {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 20px;
	margin: 0 0 30px;
	padding: 0;
	list-style: none;
}

/* Tinklelis su šonine juosta yra siauresnis – mažiau stulpelių */
.arf-shop--su-juosta .woocommerce ul.products,
.arf-shop--su-juosta ul.products {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* WooCommerce numatytieji plotelio stiliai – nuimam */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
	width: auto !important;
	margin: 0 !important;
	float: none !important;
	clear: none !important;
}

@media (max-width: 1200px) {
	.woocommerce ul.products,
	.woocommerce-page ul.products,
	.arf-shop--su-juosta ul.products {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 900px) {
	.woocommerce ul.products,
	.woocommerce-page ul.products,
	.arf-shop--su-juosta ul.products {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 14px;
	}
}

@media (max-width: 480px) {
	.woocommerce ul.products,
	.woocommerce-page ul.products,
	.arf-shop--su-juosta ul.products {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 10px;
	}
}

/* ── Prekės kortelė ────────────────────────────────────────────── */

.woocommerce ul.products li.product {
	position: relative;
	display: flex;
	flex-direction: column;
	min-width: 0;
	background: #fff;
	border: 1px solid var(--p-linija);
	transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.woocommerce ul.products li.product:hover {
	border-color: #cdd3db;
	box-shadow: 0 2px 4px rgba(43, 52, 68, .05), 0 12px 26px rgba(43, 52, 68, .09);
	transform: translateY(-3px);
}

/* Nuotrauka – fiksuotas santykis, todėl kortelės nešokinėja kraunantis */
.woocommerce ul.products li.product a img,
.woocommerce ul.products li.product img.wp-post-image {
	display: block;
	width: 100%;
	height: auto;
	margin: 0;
	aspect-ratio: 1 / 1;
	object-fit: contain;
	background: #fff;
	padding: 14px;
	box-sizing: border-box;
	transition: transform .3s ease;
}

.woocommerce ul.products li.product:hover img.wp-post-image {
	transform: scale(1.04);
}

/* Pavadinimas */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3 {
	margin: 0;
	padding: 0 16px;
	font-size: 14.5px;
	line-height: 1.4;
	font-weight: 600;
	color: var(--p-tekstas);
	/* Dvi eilutės – kad kortelės liktų vienodo aukščio */
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 41px;
}

.woocommerce ul.products li.product a:hover .woocommerce-loop-product__title {
	color: var(--p-oranzine-t);
}

/* Kaina */
.woocommerce ul.products li.product .price {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 8px;
	margin: 10px 0 0;
	padding: 0 16px;
	font-size: 19px;
	font-weight: 800;
	color: var(--p-tamsi);
	font-variant-numeric: tabular-nums;
}

.woocommerce ul.products li.product .price del {
	order: 2;
	font-size: 14px;
	font-weight: 500;
	color: var(--p-silpnas);
	opacity: 1;
	text-decoration: line-through;
}

.woocommerce ul.products li.product .price ins {
	order: 1;
	background: none;
	text-decoration: none;
	color: var(--p-oranzine-t);
	font-weight: 800;
}

/* Trumpas aprašymas kortelėje – telefone slepiam (žr. legacy) */
.woocommerce ul.products li.product .woocommerce-product-details__short-description {
	padding: 0 16px;
	font-size: 13px;
	color: var(--p-silpnas);
}

/* Sandėlio ženkleliai – iš 05-konversijos.php */
.woocommerce ul.products li.product .arf-badge {
	margin: 10px 16px 0;
	align-self: flex-start;
}

/* Į krepšelį – dabar <button>, ne <a> (žr. functions.php) */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .add_to_cart_button {
	display: block;
	width: calc(100% - 32px);
	margin: 14px 16px 16px;
	padding: 11px 14px;
	border: 0;
	background: var(--p-oranzine);
	color: #fff;
	font: 700 14px/1.2 inherit;
	font-family: inherit;
	text-align: center;
	text-transform: none;
	letter-spacing: .01em;
	border-radius: 3px;
	cursor: pointer;
	transition: background .18s ease;
}

.woocommerce ul.products li.product .button:hover,
.woocommerce ul.products li.product .add_to_cart_button:hover {
	background: var(--p-oranzine-t);
	color: #fff;
}

.woocommerce ul.products li.product .added_to_cart {
	display: block;
	margin: -6px 16px 14px;
	font-size: 13px;
	font-weight: 600;
	color: var(--p-zalia);
	text-align: center;
}

/* Kortelės apačia prilipdyta – mygtukai vienoje linijoje visose kortelėse */
.woocommerce ul.products li.product .price {
	margin-top: auto;
}

/* Nuolaidos ženkliukas */
.woocommerce ul.products li.product .onsale,
.woocommerce span.onsale {
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 2;
	min-height: 0;
	min-width: 0;
	margin: 0;
	padding: 5px 10px;
	border-radius: 3px;
	background: var(--p-oranzine);
	color: #fff;
	font-size: 11px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: .04em;
	text-transform: uppercase;
}

/* Palyginimas – antrinis veiksmas (žr. functions.php hierarchiją) */
.woocommerce ul.products li.product .palyginti-btn {
	margin: 0 16px 14px;
	width: calc(100% - 32px);
	justify-content: center;
}

/* ── Puslapiavimas ─────────────────────────────────────────────── */

.woocommerce nav.woocommerce-pagination ul {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	justify-content: center;
	margin: 8px 0 0;
	padding: 0;
	border: 0;
}

.woocommerce nav.woocommerce-pagination ul li {
	border: 0;
	margin: 0;
	overflow: visible;
}

.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	border: 1px solid var(--p-linija);
	background: #fff;
	color: var(--p-tekstas);
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
}

.woocommerce nav.woocommerce-pagination ul li a:hover {
	border-color: var(--p-oranzine);
	color: var(--p-oranzine-t);
	background: #fff;
}

.woocommerce nav.woocommerce-pagination ul li span.current {
	background: var(--p-tamsi);
	border-color: var(--p-tamsi);
	color: #fff;
}

/* ── Filtrų juosta ─────────────────────────────────────────────── */

.arf-shop__juosta .widget {
	margin-bottom: 24px;
	padding-bottom: 20px;
	border-bottom: 1px solid var(--p-linija);
}

.arf-shop__juosta .widget:last-child {
	border-bottom: 0;
}

.arf-shop__juosta .widget-title {
	margin: 0 0 12px;
	padding: 0 0 8px;
	border-bottom: 2px solid var(--p-tamsi);
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--p-tamsi);
}

.product-categories li {
	margin-bottom: 6px;
	font-size: 14px;
}

.product-categories .count {
	color: var(--p-silpnas);
	font-size: 12px;
}

.product-categories .children {
	margin: 6px 0 10px 14px;
	padding-left: 10px;
	border-left: 2px solid var(--p-linija);
}

.arf-shop__juosta .current-cat > a {
	color: var(--p-oranzine-t);
	font-weight: 700;
}

/* Kainos filtras */
.arf-shop__juosta .price_slider_wrapper .ui-slider {
	height: 4px;
	background: var(--p-linija);
	border: 0;
	border-radius: 0;
	margin: 14px 0;
}

.arf-shop__juosta .ui-slider .ui-slider-range {
	background: var(--p-oranzine);
}

.arf-shop__juosta .ui-slider .ui-slider-handle {
	width: 16px;
	height: 16px;
	top: -6px;
	border-radius: 50%;
	background: #fff;
	border: 2px solid var(--p-oranzine);
	box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
}

.arf-shop__juosta .price_slider_amount .button {
	padding: 9px 16px;
	background: var(--p-tamsi);
	color: #fff;
	border: 0;
	font: 700 13px/1 inherit;
	border-radius: 3px;
	cursor: pointer;
}

.arf-shop__juosta .price_slider_amount .price_label {
	font-size: 13px;
	color: var(--p-silpnas);
}

/* ── Tuščia kategorija ─────────────────────────────────────────── */

.woocommerce-info,
.woocommerce-no-products-found .woocommerce-info {
	border-top: 0;
	border-left: 3px solid var(--p-oranzine);
	background: var(--p-fonas);
	color: var(--p-tekstas);
	font-size: 15px;
	padding: 16px 18px;
}

.woocommerce-info::before {
	display: none;
}

/* ── Prekės puslapis ───────────────────────────────────────────── */

.woocommerce div.product .product_title {
	font-size: 27px;
	line-height: 1.25;
	font-weight: 800;
	letter-spacing: -.01em;
	color: var(--p-tamsi);
	margin-bottom: 10px;
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 10px;
	font-size: 28px;
	font-weight: 800;
	color: var(--p-tamsi);
	font-variant-numeric: tabular-nums;
}

.woocommerce div.product p.price del {
	font-size: 18px;
	font-weight: 500;
	color: var(--p-silpnas);
	opacity: 1;
}

.woocommerce div.product p.price ins {
	background: none;
	text-decoration: none;
	color: var(--p-oranzine-t);
}

.woocommerce div.product form.cart .button {
	padding: 14px 30px;
	background: var(--p-oranzine);
	color: #fff;
	border: 0;
	font: 700 16px/1.2 inherit;
	border-radius: 3px;
	cursor: pointer;
}

.woocommerce div.product form.cart .button:hover {
	background: var(--p-oranzine-t);
}

.woocommerce div.product .woocommerce-tabs ul.tabs {
	padding: 0;
	margin: 0 0 -1px;
	border-bottom: 1px solid var(--p-linija);
}

.woocommerce div.product .woocommerce-tabs ul.tabs::before {
	display: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
	margin: 0 4px 0 0;
	padding: 0;
	border: 1px solid var(--p-linija);
	border-bottom: 0;
	border-radius: 0;
	background: var(--p-fonas);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after {
	display: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
	background: #fff;
	border-bottom: 1px solid #fff;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	padding: 12px 20px;
	font-size: 14px;
	font-weight: 700;
	color: var(--p-silpnas);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
	color: var(--p-tamsi);
}

.woocommerce div.product .woocommerce-tabs .panel {
	padding: 22px 0 0;
	border: 0;
}

/* ── Susijusios prekės ─────────────────────────────────────────── */

.woocommerce .related > h2,
.woocommerce .upsells > h2,
.woocommerce .cross-sells > h2 {
	margin: 44px 0 18px;
	padding-bottom: 12px;
	border-bottom: 2px solid var(--p-tamsi);
	font-size: 21px;
	font-weight: 800;
	color: var(--p-tamsi);
}

/* ═══════════════════════════════════════════════════════════════════
   PREKĖS NE WOOCOMMERCE PUSLAPIUOSE

   Kortelės rodomos ir ten, kur nėra .woocommerce apvalkalo:
   /kategorija/akcijos/ (paprasta WP kategorija), pagrindiniame
   puslapyje, straipsniuose per [arf_produktai].

   Tie patys stiliai, tik be .woocommerce prefikso – todėl kortelės
   atrodo vienodai visur.
   ═══════════════════════════════════════════════════════════════════ */

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

ul.products li.product {
	position: relative;
	display: flex;
	flex-direction: column;
	min-width: 0;
	width: auto !important;
	margin: 0 !important;
	float: none !important;
	background: #fff;
	border: 1px solid var(--p-linija);
	transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

ul.products li.product:hover {
	border-color: #cdd3db;
	box-shadow: 0 2px 4px rgba(43, 52, 68, .05), 0 12px 26px rgba(43, 52, 68, .09);
	transform: translateY(-3px);
}

ul.products li.product img.wp-post-image {
	display: block;
	width: 100%;
	height: auto;
	margin: 0;
	aspect-ratio: 1 / 1;
	object-fit: contain;
	padding: 14px;
	box-sizing: border-box;
}

ul.products li.product .woocommerce-loop-product__title {
	margin: 0;
	padding: 0 16px;
	font-size: 14.5px;
	line-height: 1.4;
	font-weight: 600;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 41px;
}

ul.products li.product .price {
	margin: auto 0 0;
	padding: 10px 16px 0;
	font-size: 19px;
	font-weight: 800;
	color: var(--p-tamsi);
	font-variant-numeric: tabular-nums;
}

ul.products li.product .button,
ul.products li.product .add_to_cart_button {
	display: block;
	width: calc(100% - 32px);
	margin: 14px 16px 16px;
	padding: 11px 14px;
	border: 0;
	background: var(--p-oranzine);
	color: #fff;
	font: 700 14px/1.2 inherit;
	text-align: center;
	border-radius: 3px;
	cursor: pointer;
}

ul.products li.product .button:hover {
	background: var(--p-oranzine-t);
	color: #fff;
}

@media (max-width: 1200px) { ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px)  { ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; } }
@media (max-width: 480px)  { ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } }

/* ═══════════════════════════════════════════════════════════════════
   TINKLELIS – PRIVERSTINAI

   WooCommerce woocommerce-layout.css iki šiol laimėdavo:
       ul.products li.product { float:left; width:22.05%; margin-right:3.8% }
   Dėl float išdėstymo kortelės pasiskirstydavo netolygiai, o skirtingo
   aukščio kortelės kabindavosi viena už kitos.

   Čia viskas su !important ir be .woocommerce prefikso, kad veiktų ir
   tuose puslapiuose, kur to apvalkalo nėra (akcijos, pagrindinis).
   Šis blokas failo GALE – vadinasi, laimi prieš viską, kas aukščiau.
   ═══════════════════════════════════════════════════════════════════ */

ul.products {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
	gap: 20px !important;
	align-items: stretch !important;
	margin: 0 0 30px !important;
	padding: 0 !important;
	list-style: none !important;
	float: none !important;
}

ul.products::before,
ul.products::after {
	display: none !important;   /* senų temų clearfix'ai griauna grid'ą */
}

ul.products li.product {
	display: flex !important;
	flex-direction: column !important;
	float: none !important;
	clear: none !important;
	width: auto !important;
	max-width: none !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	height: auto !important;
}

/* Su filtrų juosta vietos mažiau – trys stulpeliai */
.arf-shop--su-juosta ul.products {
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

@media (max-width: 1200px) {
	ul.products,
	.arf-shop--su-juosta ul.products {
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 900px) {
	ul.products,
	.arf-shop--su-juosta ul.products {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: 14px !important;
	}
}

@media (max-width: 480px) {
	ul.products,
	.arf-shop--su-juosta ul.products {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: 10px !important;
	}
}

/* Kaina prilipdyta prie apačios – mygtukai visose kortelėse vienoje linijoje */
ul.products li.product .price {
	margin-top: auto !important;
}

/* Palyginimas – antrinis veiksmas. Taisyklės buvo style.css, bet jos
   nepasiekdavo dėl kešo; laikom čia, kad būtų vienoje vietoje. */
ul.products li.product .palyginti-btn {
	display: block !important;
	width: calc(100% - 32px) !important;
	margin: 0 16px 14px !important;
	padding: 8px 12px !important;
	background: transparent !important;
	background-image: none !important;
	border: 1px solid #d1d5db !important;
	color: #6b7280 !important;
	font-weight: 400 !important;
	font-size: 13px !important;
	text-align: center !important;
	box-shadow: none !important;
	text-transform: none !important;
}

ul.products li.product .palyginti-btn:hover {
	background: #f3f4f6 !important;
	border-color: #9ca3af !important;
	color: #374151 !important;
}

/* ═══════════════════════════════════════════════════════════════════
   KORTELĖS SUTVARKYMAS

   1. „Į krepšelį" išlįsdavo pro kortelę.
      Priežastis: width:calc(100% - 32px) plius vidinis padding. Jei
      kur nors box-sizing nėra border-box, padding pridedamas VIRŠ
      pločio ir mygtukas tampa platesnis už kortelę.
      Sprendimas: display:block su auto pločiu – blokinis elementas
      pats užima vietą minus paraštės, jokių skaičiavimų.

   2. Kaina buvo priplokšta prie krašto – trūko šoninio padding'o.

   3. Palyginimas perkeltas ant nuotraukos kaip maža ikona.
      Funkcija naudojama retai, o kortelėje ji atimdavo tiek pat
      dėmesio kiek pirkimas.
   ═══════════════════════════════════════════════════════════════════ */

ul.products li.product {
	overflow: hidden !important;   /* niekas neišlenda pro rėmelį */
}

/* ── Mygtukas ── */
ul.products li.product .button,
ul.products li.product .add_to_cart_button,
ul.products li.product a.button {
	display: block !important;
	box-sizing: border-box !important;
	width: auto !important;
	max-width: none !important;
	margin: 14px 16px 16px !important;
	padding: 12px 14px !important;
	font-size: 14px !important;
	line-height: 1.2 !important;
	text-align: center !important;
	white-space: normal !important;
}

/* ── Tekstinė dalis ── */
ul.products li.product .woocommerce-loop-product__title,
ul.products li.product h2,
ul.products li.product h3 {
	box-sizing: border-box !important;
	padding: 0 16px !important;
	margin: 10px 0 0 !important;
}

ul.products li.product .price {
	box-sizing: border-box !important;
	padding: 8px 16px 0 !important;
	margin: auto 0 0 !important;
}

ul.products li.product .arf-badge {
	margin: 10px 16px 0 !important;
}

/* ── Palyginimas ant nuotraukos ── */
ul.products li.product .palyginti-btn {
	position: absolute !important;
	top: 10px !important;
	right: 10px !important;
	z-index: 3 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 34px !important;
	height: 34px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 1px solid #e0e4e9 !important;
	border-radius: 50% !important;
	background: rgba(255, 255, 255, .94) !important;
	color: #8b929d !important;
	box-shadow: 0 1px 3px rgba(43, 52, 68, .1) !important;
	font-size: 0 !important;          /* paslepia tekstą, palieka ikoną */
	white-space: nowrap !important;
	overflow: hidden !important;
	transition: background .18s ease, color .18s ease, border-color .18s ease;
}

ul.products li.product .palyginti-btn:hover {
	background: #fff !important;
	border-color: var(--p-oranzine) !important;
	color: var(--p-oranzine) !important;
}

/* Tekstas „Pridėti palyginimui" lieka skaitytuvams, bet nematomas */
ul.products li.product .palyginti-btn .palyginti-text {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
	clip: rect(0 0 0 0) !important;
	clip-path: inset(50%) !important;
	white-space: nowrap !important;
}

ul.products li.product .palyginti-btn svg,
ul.products li.product .palyginti-btn i {
	width: 16px !important;
	height: 16px !important;
	font-size: 15px !important;
	display: block !important;
}

/* Nuolaidos ženkliukas lieka kairėje – su palyginimu dešinėje nesikerta */
ul.products li.product .onsale {
	right: auto !important;
	left: 10px !important;
}

/* ═══════════════════════════════════════════════════════════════════
   ĮRANKIŲ JUOSTA IR FILTRAI – GALUTINIS DERINIMAS

   .arf-toolbar niekada nesuveikdavo: WooCommerce išveda
   .woocommerce-result-count ir .woocommerce-ordering kaip du atskirus
   elementus BE bendro apvalkalo, o mes savo šablonų neperrašinėjame.
   Todėl juostą sudėliojam iš pačių elementų.
   ═══════════════════════════════════════════════════════════════════ */

.woocommerce-result-count {
	float: left !important;
	margin: 0 0 20px !important;
	padding: 9px 0 !important;
	font-size: 14px !important;
	color: var(--p-silpnas) !important;
}

.woocommerce-ordering {
	float: right !important;
	margin: 0 0 20px !important;
}

/* Tinklelis prasideda tik po juosta – anksčiau kortelės lipdavo iškart */
ul.products {
	clear: both !important;
	margin-top: 6px !important;
}

/* ── Rūšiavimo laukelis ── */
.woocommerce-ordering select,
select.orderby {
	box-sizing: border-box !important;
	height: 40px !important;
	min-width: 230px !important;
	padding: 0 38px 0 14px !important;
	border: 1px solid var(--p-linija) !important;
	border-radius: 4px !important;
	background-color: #fff !important;
	color: var(--p-tekstas) !important;
	font-size: 14px !important;
	font-family: inherit !important;
	line-height: 38px !important;
	text-align: left !important;
	text-align-last: left !important;   /* tekstas kairėje, ne per vidurį */
	cursor: pointer !important;

	/* Sava rodyklė. appearance:none nuima gimtąją – kitaip matėsi dvi. */
	-webkit-appearance: none !important;
	-moz-appearance: none !important;
	appearance: none !important;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232b3444' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right 13px center !important;
	background-size: 15px !important;
}

.woocommerce-ordering select:hover,
select.orderby:hover {
	border-color: #c3c9d2 !important;
}

.woocommerce-ordering select:focus,
select.orderby:focus {
	border-color: var(--p-oranzine) !important;
	outline: 2px solid rgba(243, 122, 31, .25) !important;
	outline-offset: 0 !important;
}

.woocommerce-ordering select option {
	text-align: left !important;
	padding: 8px !important;
}

/* ── Kainos slankiklis ────────────────────────────────────────────
   jQuery UI numatytoji tema piešia violetinį – čia brand oranžinė.  */

.price_slider_wrapper .ui-slider,
.arf-shop__juosta .ui-slider {
	height: 5px !important;
	margin: 16px 0 18px !important;
	border: 0 !important;
	border-radius: 3px !important;
	background: #e4e7ec !important;
	background-image: none !important;
}

.price_slider_wrapper .ui-slider .ui-slider-range,
.arf-shop__juosta .ui-slider-range {
	background: var(--p-oranzine) !important;
	background-image: none !important;
	border: 0 !important;
	border-radius: 3px !important;
}

.price_slider_wrapper .ui-slider .ui-slider-handle,
.arf-shop__juosta .ui-slider-handle {
	width: 18px !important;
	height: 18px !important;
	top: -7px !important;
	margin-left: -9px !important;
	border: 2px solid var(--p-oranzine) !important;
	border-radius: 50% !important;
	background: #fff !important;
	background-image: none !important;
	box-shadow: 0 1px 4px rgba(43, 52, 68, .25) !important;
	cursor: grab !important;
}

.price_slider_amount .button,
.arf-shop__juosta .price_slider_amount .button {
	height: 38px !important;
	padding: 0 18px !important;
	border: 0 !important;
	border-radius: 4px !important;
	background: var(--p-tamsi) !important;
	color: #fff !important;
	font: 700 13px/38px inherit !important;
	text-transform: uppercase !important;
	letter-spacing: .04em !important;
}

.price_slider_amount .button:hover {
	background: var(--p-oranzine) !important;
}

.price_slider_amount .price_label {
	font-size: 13px !important;
	color: var(--p-silpnas) !important;
}

/* ── Kategorijų filtras ───────────────────────────────────────────
   Sąrašas buvo toks aukštas, kad kitų filtrų nesimatė. Ribojam aukštį
   ir leidžiam slinkti viduje.                                        */

.product-categories,
.widget_product_categories > ul {
	max-height: 340px !important;
	overflow-y: auto !important;
	padding-right: 6px !important;
	scrollbar-width: thin;
}

.product-categories li {
	margin: 0 !important;
	padding: 0 !important;
	border-bottom: 1px solid #eef0f3;
}

.product-categories li:last-child {
	border-bottom: 0;
}

.product-categories li > a {
	display: block !important;
	padding: 9px 0 !important;
	font-size: 14px !important;
	line-height: 1.35 !important;
	color: var(--p-tekstas) !important;
}

.product-categories li > a:hover {
	color: var(--p-oranzine-t) !important;
}

/* Skaičius atsitraukia nuo pavadinimo */
.product-categories .count {
	margin-left: 7px !important;
	color: #9aa2ae !important;
	font-size: 12.5px !important;
	font-weight: 400 !important;
}

/* Pošakiai – įtraukti, su linija, be papildomo aukščio */
.product-categories .children {
	margin: 0 0 6px 12px !important;
	padding-left: 10px !important;
	border-left: 2px solid #eef0f3 !important;
	border-bottom: 0 !important;
}

.product-categories .children li {
	border-bottom: 0 !important;
}

.product-categories .children li > a {
	padding: 6px 0 !important;
	font-size: 13.5px !important;
	color: var(--p-silpnas) !important;
}

.product-categories .current-cat > a {
	color: var(--p-oranzine-t) !important;
	font-weight: 700 !important;
}

/* Filtrų antraštės – vienodos su visa tema */
.arf-shop__juosta .widget-title {
	margin: 0 0 10px !important;
	padding: 0 0 8px !important;
	border-bottom: 2px solid var(--p-tamsi) !important;
	font-size: 13px !important;
	font-weight: 800 !important;
	letter-spacing: .06em !important;
	text-transform: uppercase !important;
	color: var(--p-tamsi) !important;
}

/* ═══════════════════════════════════════════════════════════════════
   KATEGORIJŲ FILTRAS – PERDARYTA

   Dvi ankstesnės klaidos:

   1. Skaičius nukrisdavo į naują eilutę. WooCommerce markup'e jis yra
      UŽ nuorodos ribų: <a>Pavadinimas</a> <span class="count">(400)</span>
      Uždėjus nuorodai display:block, span'ui nebelikdavo vietos šalia.
      Dabar <li> yra flex eilutė – vardas ir skaičius vienoje linijoje.

   2. max-height su slinkimu. Sąrašas tilpo, bet reikėjo slinkti viduje.
      Vietoj to pošakiai suskleidžiami, o išskleidžia mygtukas.
   ═══════════════════════════════════════════════════════════════════ */

.product-categories,
.widget_product_categories > ul {
	max-height: none !important;
	overflow: visible !important;
	padding-right: 0 !important;
}

/* Vardas ir skaičius vienoje eilutėje */
.product-categories li {
	display: flex !important;
	flex-wrap: wrap !important;
	align-items: baseline !important;
	gap: 0 8px !important;
	margin: 0 !important;
	padding: 0 !important;
	border-bottom: 1px solid #eef0f3 !important;
}

.product-categories li > a {
	display: inline !important;
	flex: 1 1 auto !important;
	min-width: 0 !important;
	padding: 9px 0 !important;
	font-size: 14px !important;
	line-height: 1.35 !important;
}

.product-categories .count {
	flex: 0 0 auto !important;
	margin: 0 !important;
	color: #9aa2ae !important;
	font-size: 12.5px !important;
	font-weight: 400 !important;
}

/* ── Pošakių išskleidimas ── */

/* Mygtukas pridedamas per JS tik ten, kur pošakiai yra */
.arf-cat-toggle {
	flex: 0 0 auto;
	width: 26px;
	height: 26px;
	margin-left: 2px;
	padding: 0;
	border: 1px solid var(--p-linija);
	border-radius: 4px;
	background: #fff;
	color: var(--p-silpnas);
	font: 700 15px/1 inherit;
	cursor: pointer;
	transition: background .15s, border-color .15s, color .15s;
}

.arf-cat-toggle:hover {
	border-color: var(--p-oranzine);
	color: var(--p-oranzine);
}

.arf-cat-toggle::before {
	content: "+";
}

.arf-cat-toggle[aria-expanded="true"]::before {
	content: "–";
}

/* Suskleisti pošakiai */
.product-categories .children {
	flex: 0 0 100% !important;
	margin: 0 0 8px 4px !important;
	padding-left: 12px !important;
	border-left: 2px solid #eef0f3 !important;
	border-bottom: 0 !important;
}

.product-categories .children[hidden] {
	display: none !important;
}

.product-categories .children li {
	border-bottom: 0 !important;
}

.product-categories .children li > a {
	padding: 6px 0 !important;
	font-size: 13.5px !important;
	color: var(--p-silpnas) !important;
}

.product-categories .current-cat > a {
	color: var(--p-oranzine-t) !important;
	font-weight: 700 !important;
}

/* ═══════════════════════════════════════════════════════════════════
   PALYGINIMO IKONA – su paaiškinimu

   Vien ikona neaiški. Užvedus pele iššoka užrašas; jis piešiamas CSS'u
   iš aria-label, todėl nereikia nei JS, nei papildomo markup'o.
   ═══════════════════════════════════════════════════════════════════ */

ul.products li.product .palyginti-btn {
	overflow: visible !important;   /* kad užrašas nebūtų nukirstas */
}

ul.products li.product .palyginti-btn::after {
	content: "Palyginti";
	position: absolute;
	top: 50%;
	right: calc(100% + 8px);
	transform: translateY(-50%);
	padding: 5px 9px;
	border-radius: 4px;
	background: var(--p-tamsi);
	color: #fff;
	font-size: 12px;
	font-weight: 600;
	line-height: 1;
	white-space: nowrap;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity .15s ease, visibility .15s;
}

ul.products li.product .palyginti-btn:hover::after,
ul.products li.product .palyginti-btn:focus-visible::after {
	opacity: 1;
	visibility: visible;
}

/* Kai prekė jau palyginime – oranžinė, kad matytųsi būsena */
ul.products li.product .palyginti-btn.aktyvus,
ul.products li.product .palyginti-btn.active {
	background: var(--p-oranzine) !important;
	border-color: var(--p-oranzine) !important;
	color: #fff !important;
}

/* ═══════════════════════════════════════════════════════════════════
   RŪŠIAVIMO FORMA – paslėpti tarnybiniai laukai

   WooCommerce formoje šalia <select> yra paslėpti laukai:
       <input type="hidden" name="paged">
       <input type="hidden" name="post_type">
   legacy.css visiems input elementams uždeda rėmelį ir foną, todėl jie
   tapdavo matomi kaip tuščias kvadratėlis dešinėje nuo select'o.

   Paslepiam viską, kas formoje nėra pats select'as. Formos veikimui
   tai netrukdo – laukai lieka DOM'e ir siunčiami kartu.
   ═══════════════════════════════════════════════════════════════════ */

.woocommerce-ordering > *:not(select),
.woocommerce-ordering input[type="hidden"],
.woocommerce-ordering input[type="submit"],
form.woocommerce-ordering input {
	display: none !important;
	width: 0 !important;
	height: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	border: 0 !important;
	background: none !important;
	visibility: hidden !important;
}

.woocommerce-ordering {
	display: inline-flex !important;
	align-items: center !important;
	line-height: 0 !important;   /* nulinis tarpelis šalia select'o */
}

/* ═══════════════════════════════════════════════════════════════════
   PUSLAPIAVIMAS

   Aktyvus langelis rodė baltą tekstą ant šviesaus fono – legacy.css
   perrašydavo tamsų foną, o balta spalva likdavo. Nebeskaitoma.
   Čia viskas su !important.
   ═══════════════════════════════════════════════════════════════════ */

.woocommerce nav.woocommerce-pagination ul,
nav.woocommerce-pagination ul {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 6px !important;
	justify-content: center !important;
	margin: 30px 0 0 !important;
	padding: 0 !important;
	border: 0 !important;
}

.woocommerce nav.woocommerce-pagination ul li,
nav.woocommerce-pagination ul li {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	overflow: visible !important;
}

.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span,
nav.woocommerce-pagination ul li a,
nav.woocommerce-pagination ul li span {
	box-sizing: border-box !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-width: 42px !important;
	height: 42px !important;
	padding: 0 12px !important;
	border: 1px solid var(--p-linija) !important;
	border-radius: 4px !important;
	background: #fff !important;
	color: var(--p-tekstas) !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	line-height: 1 !important;
	text-decoration: none !important;
}

.woocommerce nav.woocommerce-pagination ul li a:hover,
nav.woocommerce-pagination ul li a:hover {
	border-color: var(--p-oranzine) !important;
	background: #fff !important;
	color: var(--p-oranzine-t) !important;
}

/* Aktyvus – tamsus fonas, baltas tekstas */
.woocommerce nav.woocommerce-pagination ul li span.current,
.woocommerce nav.woocommerce-pagination ul li .current,
nav.woocommerce-pagination ul li span.current,
nav.woocommerce-pagination ul li .current {
	background: var(--p-tamsi) !important;
	background-color: var(--p-tamsi) !important;
	border-color: var(--p-tamsi) !important;
	color: #fff !important;
	font-weight: 800 !important;
}

/* Daugtaškis – be rėmelio, tai ne mygtukas */
.woocommerce nav.woocommerce-pagination ul li span.dots,
nav.woocommerce-pagination ul li span.dots {
	border-color: transparent !important;
	background: transparent !important;
	color: var(--p-silpnas) !important;
	min-width: 28px !important;
}

/* ═══════════════════════════════════════════════════════════════════
   FILTRŲ JUOSTA – slenka kartu su ekranu
   ═══════════════════════════════════════════════════════════════════ */

@media (min-width: 992px) {
	.arf-shop--su-juosta {
		align-items: start !important;   /* be to sticky neturi kur judėti */
	}

	.arf-shop--su-juosta .arf-shop__juosta {
		position: -webkit-sticky !important;
		position: sticky !important;
		/* 46px lipni navigacija + 16px oro */
		top: 62px !important;
		max-height: calc(100vh - 80px) !important;
		overflow-y: auto !important;
		overscroll-behavior: contain;   /* pasiekus galą neslenka puslapis */
		scrollbar-width: thin;
	}

	/* Su admin juosta viršuje reikia daugiau vietos */
	.admin-bar .arf-shop--su-juosta .arf-shop__juosta {
		top: 94px !important;
		max-height: calc(100vh - 112px) !important;
	}
}

/* ═══════════════════════════════════════════════════════════════════
   PALYGINIMAS – su visada matomu tekstu

   Vien ikona buvo neaiški, o užrašas tik hover'e nepadėjo – lietimo
   ekrane hover'io nėra. Dabar juostelė su ikona ir tekstu.
   ═══════════════════════════════════════════════════════════════════ */

ul.products li.product .palyginti-btn {
	position: absolute !important;
	top: 10px !important;
	right: 10px !important;
	z-index: 3 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 6px !important;
	width: auto !important;
	height: auto !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 6px 10px !important;
	border: 1px solid #dfe3e8 !important;
	border-radius: 999px !important;
	background: rgba(255, 255, 255, .95) !important;
	color: #5d6774 !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	line-height: 1 !important;
	white-space: nowrap !important;
	overflow: visible !important;
	box-shadow: 0 1px 3px rgba(43, 52, 68, .1) !important;
	transition: background .18s ease, color .18s ease, border-color .18s ease;
}

/* Tekstas matomas visada */
ul.products li.product .palyginti-btn .palyginti-text {
	position: static !important;
	width: auto !important;
	height: auto !important;
	overflow: visible !important;
	clip: auto !important;
	clip-path: none !important;
	white-space: nowrap !important;
	font-size: 12px !important;
	font-weight: 600 !important;
}

ul.products li.product .palyginti-btn svg,
ul.products li.product .palyginti-btn i {
	width: 14px !important;
	height: 14px !important;
	font-size: 13px !important;
	flex: 0 0 auto !important;
	display: block !important;
}

/* Hover – oranžinis rėmelis ir tekstas, fonas lieka baltas,
   kad ikona ir užrašas neišnyktų (anksčiau buvo pilkas fonas). */
ul.products li.product .palyginti-btn:hover,
ul.products li.product .palyginti-btn:focus-visible {
	background: #fff !important;
	border-color: var(--p-oranzine) !important;
	color: var(--p-oranzine-t) !important;
}

ul.products li.product .palyginti-btn:hover svg,
ul.products li.product .palyginti-btn:hover i {
	color: var(--p-oranzine-t) !important;
}

/* Jau palyginime */
ul.products li.product .palyginti-btn.aktyvus,
ul.products li.product .palyginti-btn.active {
	background: var(--p-oranzine) !important;
	border-color: var(--p-oranzine) !important;
	color: #fff !important;
}

/* Iššokantis užrašas nebereikalingas – tekstas ir taip matomas */
ul.products li.product .palyginti-btn::after {
	content: none !important;
}

/* Siauresnėse kortelėse paliekam tik ikoną, kad neuždengtų nuotraukos */
@media (max-width: 480px) {
	ul.products li.product .palyginti-btn .palyginti-text {
		position: absolute !important;
		width: 1px !important;
		height: 1px !important;
		overflow: hidden !important;
		clip-path: inset(50%) !important;
	}
	ul.products li.product .palyginti-btn {
		padding: 7px !important;
		border-radius: 50% !important;
	}
}

/* ═══════════════════════════════════════════════════════════════════
   FILTRŲ JUOSTA – be slinkimo juostų

   max-height su overflow-y duodavo ir vertikalią, ir horizontalią
   slinkimo juostą juostos viduje. Nereikia: sąrašas suskleidžiamas,
   tad telpa. Sticky lieka.
   ═══════════════════════════════════════════════════════════════════ */

@media (min-width: 992px) {
	.arf-shop--su-juosta .arf-shop__juosta {
		max-height: none !important;
		overflow: visible !important;
	}
}

.arf-shop__juosta,
.arf-shop__juosta .widget,
.product-categories {
	overflow-x: visible !important;
	overflow-y: visible !important;
	max-height: none !important;
}

/* ═══════════════════════════════════════════════════════════════════
   POŠAKIŲ SUSKLEIDIMAS

   [hidden] atributo kai kurie stiliai nepaiso, todėl JS uždeda dar ir
   klasę, o čia ją paremiam !important.
   ═══════════════════════════════════════════════════════════════════ */

.product-categories .children.arf-suskleista,
.product-categories .children[hidden] {
	display: none !important;
}

/* ═══════════════════════════════════════════════════════════════════
   PALYGINIMO MYGTUKAS PASPAUDUS

   Paspaudus mygtukas tapdavo pilkas ir jame nebesimatydavo nei ikonos,
   nei teksto. Kaltas legacy.css :active / :focus fonas, kuris uždeda
   pilką ir palieka pilką tekstą.

   Fiksuojam visas tris būsenas – įprastą, :active ir :focus – kad
   turinys visada išliktų matomas.
   ═══════════════════════════════════════════════════════════════════ */

ul.products li.product .palyginti-btn:active,
ul.products li.product .palyginti-btn:focus,
ul.products li.product .palyginti-btn:focus-visible,
ul.products li.product .palyginti-btn:visited {
	background: #fff !important;
	background-image: none !important;
	border-color: var(--p-oranzine) !important;
	color: var(--p-oranzine-t) !important;
	box-shadow: 0 1px 3px rgba(43, 52, 68, .12) !important;
	opacity: 1 !important;
	text-indent: 0 !important;
	font-size: 12px !important;
}

/* Turinys mygtuko viduje niekada neišnyksta */
ul.products li.product .palyginti-btn:active .palyginti-text,
ul.products li.product .palyginti-btn:focus .palyginti-text,
ul.products li.product .palyginti-btn .palyginti-text {
	color: inherit !important;
	opacity: 1 !important;
	visibility: visible !important;
	display: inline !important;
	text-indent: 0 !important;
}

ul.products li.product .palyginti-btn:active svg,
ul.products li.product .palyginti-btn:focus svg,
ul.products li.product .palyginti-btn svg,
ul.products li.product .palyginti-btn i {
	color: inherit !important;
	opacity: 1 !important;
	visibility: visible !important;
}

/* Įdėta į palyginimą – oranžinis fonas, baltas turinys */
ul.products li.product .palyginti-btn.aktyvus,
ul.products li.product .palyginti-btn.active,
ul.products li.product .palyginti-btn.added,
ul.products li.product .palyginti-btn[aria-pressed="true"] {
	background: var(--p-oranzine) !important;
	border-color: var(--p-oranzine) !important;
	color: #fff !important;
}

ul.products li.product .palyginti-btn.aktyvus .palyginti-text,
ul.products li.product .palyginti-btn.active .palyginti-text,
ul.products li.product .palyginti-btn.added .palyginti-text {
	color: #fff !important;
}

/* Įkėlimo būsena – neslėpti turinio, tik pritemdyti */
ul.products li.product .palyginti-btn.loading {
	opacity: .65 !important;
	color: var(--p-tekstas) !important;
}

ul.products li.product .palyginti-btn.loading::before,
ul.products li.product .palyginti-btn.loading::after {
	content: none !important;
}

/* ═══════════════════════════════════════════════════════════════════
   POŠAKIAI ŠONINĖJE JUOSTOJE

   legacy.css pošakius traktuoja kaip mega-meniu iškrentantį sąrašą:

       .children { position:absolute; top:calc(100% + 40px);
                   visibility:hidden; opacity:0 }
       ul.children, .widget ul ul.sub-menu { display:none }

   Šoninėje juostoje tai visiškai netinka – sąrašas turi tiesiog būti
   po tėvine kategorija. Grąžinam normalų srautą.
   ═══════════════════════════════════════════════════════════════════ */

.widget_product_categories ul.children,
.product-categories ul.children,
.arf-shop__juosta ul.children,
.widget_product_categories .sub-menu,
.product-categories .sub-menu {
	position: static !important;
	top: auto !important;
	left: auto !important;
	right: auto !important;
	min-width: 0 !important;
	visibility: visible !important;
	opacity: 1 !important;
	box-shadow: none !important;
	background: transparent !important;
	transform: none !important;
	transition: none !important;
	z-index: auto !important;
}

/* Matomumą valdo tik suskleidimo mygtukas */
.widget_product_categories ul.children:not(.arf-suskleista):not([hidden]),
.product-categories ul.children:not(.arf-suskleista):not([hidden]) {
	display: block !important;
}

.widget_product_categories ul.children.arf-suskleista,
.product-categories ul.children.arf-suskleista,
.widget_product_categories ul.children[hidden],
.product-categories ul.children[hidden] {
	display: none !important;
}