/*
 * Новата продуктова страница. Стойностите идват от 400-dizayn/dizayn.css.
 * Всичко е под body.sp-produkt — Avada и добавките имат свои стилове и без
 * по-силен селектор те печелят.
 */

body.sp-produkt {
	--sp-p-shirina-snimka: 520px;
}

/* По-широкият сайт (до 1600, 20 окт.): снимката расте с екрана — 520 при 1280, 680 при 1920. */
@media (min-width: 1280px) {
	body.sp-produkt {
		--sp-p-shirina-snimka: clamp(520px, calc(520px + (100vw - 1280px) / 4), 680px);
	}
}

/* Заглавната лента на Avada отпада — името е до снимката. */
body.sp-produkt .avada-page-titlebar-wrapper {
	display: none;
}

html body.sp-produkt .product.type-product {
	font-family: var(--sp-shrift);
	color: var(--sp-mastilo);
}

/* ---------- Горе: път, име, оценка, наличност ---------- */

html body.sp-produkt .sp-p-put {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0 0 var(--sp-2);
	color: var(--sp-sivo);
	font-size: 13px;
	line-height: 18px;
}

html body.sp-produkt .sp-p-put a {
	color: var(--sp-marka);
	text-decoration: none;
}

html body.sp-produkt .sp-p-put a:hover {
	text-decoration: underline;
}

html body.sp-produkt .summary h1.sp-p-ime {
	margin: 0 0 var(--sp-2);
	padding: 0;
	color: var(--sp-mastilo);
	font-family: var(--sp-shrift);
	font-size: 24px;
	line-height: 30px;
	font-weight: 800;
	letter-spacing: -0.01em;
	text-transform: none;
}

html body.sp-produkt .sp-p-red {
	display: flex !important;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px var(--sp-3);
	margin: 0;
	font-size: 14px;
	line-height: 20px;
}

html body.sp-produkt .sp-p-red > * {
	display: inline-flex;
	align-items: center;
	margin: 0 !important;
	line-height: 20px !important;
	font-size: 14px !important;
}

html body.sp-produkt .sp-p-ocenka {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--sp-mastilo);
	text-decoration: none;
}

html body.sp-produkt .sp-p-zvezdi {
	display: inline-flex;
	gap: 1px;
}

html body.sp-produkt .sp-zvezda {
	fill: var(--sp-zvezdi);
}

html body.sp-produkt .sp-zvezda--prazna {
	fill: var(--sp-zvezdi-prazna, #C4C4C4);
}

html body.sp-produkt .sp-p-ocenka__chislo {
	font-weight: 600;
}

html body.sp-produkt .sp-p-ocenka__broy {
	color: var(--sp-marka);
	text-decoration: underline;
	text-underline-offset: 3px;
}

html body.sp-produkt .sp-p-nalichnost {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: var(--sp-nalichnost);
	font-weight: 600;
}

html body.sp-produkt .sp-p-nalichnost--nyama {
	color: var(--sp-greshka);
}

/* „Извънгабаритен продукт“ — до наличността (23 окт.). */
html body.sp-produkt .sp-p-izvan {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 2px 10px;
	border-radius: 12px;
	background: #FFF4E5;
	color: #9A4A06;
	font-size: 13px;
	line-height: 20px;
	font-weight: 700;
	cursor: help;
}

/* ---------- Цена ---------- */

html body.sp-produkt .sp-p-cena {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 6px 8px;
	margin: 0;
}

/* Голямата цена — с обикновени (не таблични) цифри: при табличните „1“ е
   широка колкото „0“ и цената изглеждаше разредена („1 .35“). */
html body.sp-produkt .sp-p-cena__suma,
html body.sp-produkt .sp-p-cena__suma .amount {
	color: var(--sp-mastilo);
	font-family: var(--sp-shrift);
	font-size: 32px;
	line-height: 36px;
	font-weight: 700;
	font-variant-numeric: normal;
	letter-spacing: -0.01em;
}

html body.sp-produkt .sp-p-cena__suma del,
html body.sp-produkt .sp-p-cena__suma del .amount {
	color: var(--sp-sivo);
	font-size: 18px;
	font-weight: 500;
}

html body.sp-produkt .sp-p-cena__suma ins {
	text-decoration: none;
}

html body.sp-produkt .sp-p-cena__suma ins .amount {
	color: var(--sp-deystvie);
}

/* „от 0.71 €“ при количествените карти — produkt.js. */
html body.sp-produkt .sp-p-cena__suma .sp-p-cena__ot {
	color: var(--sp-sivo);
	font-size: 15px;
	line-height: 20px;
	font-weight: 400;
	letter-spacing: 0;
}

html body.sp-produkt .sp-p-cena__myarka {
	color: var(--sp-sivo);
	font-size: 15px;
	line-height: 20px;
}

/* „0,008 € на брой“ е вътре в реда на цената: на телефон — на свой ред
   отдолу, на компютър — след мярката („… с ДДС · 0,008 € на брой“). */
html body.sp-produkt .sp-p-na-broy {
	flex: 1 0 100%;
	margin: 0;
	color: var(--sp-grafit);
	font-size: 14px;
	line-height: 20px;
}

html body.sp-produkt .sp-p-na-broy .amount {
	font-weight: 600;
}

@media (max-width: 1023px) {
	html body.sp-produkt .sp-p-cena {
		gap: 10px 6px;
	}
}

/* ---------- Етикетите ---------- */

html body.sp-produkt .sp-p-chipove {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sp-2);
	margin: var(--sp-3) 0 0;
	padding: 0;
	list-style: none;
}

html body.sp-produkt .sp-p-chipove li {
	margin: 0;
	padding: 0 10px;
	height: 30px;
	display: inline-flex;
	align-items: center;
	border: 1px solid var(--sp-linia);
	border-radius: var(--sp-ugal);
	font-size: 14px;
	line-height: 20px;
}

/* Разделителят на Avada под цената не трябва. */
html body.sp-produkt .summary .product-border {
	display: none;
}

/* ---------- Ритъмът в блока до снимката ----------
   Avada, WooCommerce и добавките слагат свои отстъпи (полето за брой — по
   20 px отгоре и отдолу, празен блок за наличност…) и те се трупаха с нашите.
   Тук всичко се нулира и разстоянията идват само от тези редове.

   Три блока (430-produkt.php ги обвива): .sp-p-glava — име, оценка, цена,
   етикети; .sp-p-kupuvane — карти, калкулатор, брой и бутон; .sp-p-dostavka.
   Числата са от платното: компютър — 10 под името, 20 между блоковете;
   телефон — 10/14 вътре, 12 сиво между белите ленти. */

html body.sp-produkt .summary .summary-container {
	display: flex;
	flex-direction: column;
	align-items: stretch;
}

html body.sp-produkt .summary .summary-container > *,
html body.sp-produkt .sp-p-glava > *,
html body.sp-produkt .sp-p-kupuvane > * {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

html body.sp-produkt .summary .avada-availability,
html body.sp-produkt .summary .product-border {
	display: none !important;
}

html body.sp-produkt .sp-p-glava,
html body.sp-produkt .sp-p-kupuvane {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

/* Между картите и бутона (и всичко друго в блока за купуване) — 16. */
html body.sp-produkt .sp-p-kupuvane {
	gap: var(--sp-4);
}

html body.sp-produkt .sp-p-glava > .sp-p-red { margin-top: 10px !important; }
html body.sp-produkt .sp-p-glava > .sp-p-cena { margin-top: 14px !important; }
html body.sp-produkt .sp-p-glava > .sp-p-chipove { margin-top: 14px !important; }

html body.sp-produkt .summary .summary-container > .sp-p-kupuvane,
html body.sp-produkt .summary .summary-container > .sp-p-dostavka { margin-top: 20px !important; }

@media (min-width: 1024px) {
	html body.sp-produkt .sp-p-glava > .sp-p-cena { margin-top: 20px !important; }
	html body.sp-produkt .sp-p-glava > .sp-p-chipove { margin-top: var(--sp-4) !important; }
}

html body.sp-produkt form.cart .quantity,
html body.sp-produkt form.cart .single_add_to_cart_button {
	margin: 0 !important;
}

/* Празният контейнер на Uni CPO в простите продукти. */
html body.sp-produkt form.cart .uni-builderius-container:empty {
	display: none;
}

/* ---------- Блокът за купуване (общо) ---------- */

html body.sp-produkt form.cart {
	margin: var(--sp-6) 0 0;
	padding: 0;
	font-family: var(--sp-shrift);
}

html body.sp-produkt form.cart .single_add_to_cart_button,
html body.sp-produkt .ssc-calculator .ssc-submit {
	height: 52px;
	margin: 0;
	padding: 0 var(--sp-6);
	border: 0;
	border-radius: var(--sp-ugal);
	background: var(--sp-deystvie);
	color: var(--sp-byalo);
	font-family: var(--sp-shrift);
	font-size: 17px;
	line-height: 20px;
	font-weight: 700;
	text-transform: none;
	box-shadow: none;
	cursor: pointer;
}

html body.sp-produkt form.cart .single_add_to_cart_button:hover,
html body.sp-produkt .ssc-calculator .ssc-submit:hover {
	background: var(--sp-deystvie-tamno);
}

html body.sp-produkt form.cart .single_add_to_cart_button.disabled,
html body.sp-produkt form.cart .single_add_to_cart_button:disabled {
	background: #E6E8EB;
	color: var(--sp-sivo);
	opacity: 1;
	cursor: not-allowed;
}

/* Обикновен и с варианти: брой + бутон на един ред (и на телефон — Avada
   слагаше пренасяне и бутона на цяла ширина, та двете падаха едно под друго).
   Под тях — „2 пакета = 1 000 бр.“; всичко чуждо в реда е на цяла ширина. */
html body.sp-produkt form.cart:not(.ssc-active-product-form) .woocommerce-variation-add-to-cart,
html body.sp-produkt form.cart.cart:not(.variations_form):not(.ssc-active-product-form) {
	display: grid !important;
	grid-template-columns: 140px minmax(0, 1fr);
	align-items: end;
	gap: var(--sp-2) var(--sp-3);
	max-width: none;
}

html body.sp-produkt form.cart:not(.ssc-active-product-form) .woocommerce-variation-add-to-cart > *,
html body.sp-produkt form.cart.cart:not(.variations_form):not(.ssc-active-product-form) > * {
	grid-column: 1 / -1;
}

html body.sp-produkt form.cart:not(.ssc-active-product-form) .woocommerce-variation-add-to-cart > :is(.quantity, .sp-kol),
html body.sp-produkt form.cart.cart:not(.variations_form):not(.ssc-active-product-form) > :is(.quantity, .sp-kol) {
	grid-column: 1;
}

html body.sp-produkt form.cart:not(.ssc-active-product-form) .woocommerce-variation-add-to-cart > .single_add_to_cart_button,
html body.sp-produkt form.cart.cart:not(.variations_form):not(.ssc-active-product-form) > .single_add_to_cart_button {
	grid-column: 2;
	width: auto !important;
	min-width: 0;
}

/* Без поле за брой (продава се по един) — бутонът е сам на реда. */
html body.sp-produkt form.cart:not(.ssc-active-product-form) .woocommerce-variation-add-to-cart > .quantity.hidden + .single_add_to_cart_button,
html body.sp-produkt form.cart.cart:not(.variations_form):not(.ssc-active-product-form) > .quantity.hidden + .single_add_to_cart_button {
	grid-column: 1 / -1;
}

/* Блокът за брой: надпис („Пакети“ / „Брой“) над полето — от produkt.js. */
html body.sp-produkt .sp-kol {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
}

html body.sp-produkt .sp-kol__etiket {
	margin: 0;
	color: var(--sp-grafit);
	font-size: 14px;
	line-height: 20px;
	font-weight: 400;
}

html body.sp-produkt .sp-kol__pomosht {
	margin: 0;
	color: var(--sp-sivo);
	font-size: 14px;
	line-height: 20px;
}

html body.sp-produkt .sp-kol__pomosht:empty,
html body.sp-produkt form.cart a.added_to_cart {
	display: none;
}

/* Цялата ширина на колоната (Avada: .summary .cart { max-width: 600px }). */
html body.sp-produkt .summary form.cart {
	max-width: none !important;
	width: 100%;
}

/* Количката на бутона, както на платното (без нея, докато е изключен). */
html body.sp-produkt form.cart .single_add_to_cart_button,
html body.sp-produkt .ssc-calculator .ssc-submit {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	gap: 10px;
}

html body.sp-produkt form.cart .single_add_to_cart_button::before,
html body.sp-produkt .ssc-calculator .ssc-submit::before {
	content: "";
	flex: 0 0 22px;
	width: 22px;
	height: 22px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4h2l2.2 10.2a1.5 1.5 0 0 0 1.5 1.2h8.6a1.5 1.5 0 0 0 1.5-1.1L21 8H6'/%3E%3Ccircle cx='9.5' cy='19.5' r='1.25'/%3E%3Ccircle cx='17' cy='19.5' r='1.25'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4h2l2.2 10.2a1.5 1.5 0 0 0 1.5 1.2h8.6a1.5 1.5 0 0 0 1.5-1.1L21 8H6'/%3E%3Ccircle cx='9.5' cy='19.5' r='1.25'/%3E%3Ccircle cx='17' cy='19.5' r='1.25'/%3E%3C/svg%3E") center / contain no-repeat;
}

html body.sp-produkt form.cart .single_add_to_cart_button:is(.disabled, :disabled)::before {
	display: none;
}

/* Калкулаторът крие бутона на WooCommerce (.ssc-native-control) — горното
   inline-flex !important го показваше пак и бутоните ставаха два. */
html body.sp-produkt form.cart .single_add_to_cart_button.ssc-native-control,
html body.sp-produkt form.cart.ssc-active-product-form > .single_add_to_cart_button,
html body.sp-produkt form.cart.ssc-active-product-form .ssc-native-control {
	display: none !important;
}

html body.sp-produkt form.cart .quantity {
	flex: none;
	display: flex;
	height: 52px;
	margin: 0;
	border: 1px solid var(--sp-ramka);
	border-radius: var(--sp-ugal);
	overflow: hidden;
	background: var(--sp-byalo);
}

html body.sp-produkt form.cart .quantity input.qty {
	flex: 1 1 auto;
	width: 0;
	min-width: 0;
	height: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--sp-mastilo);
	font-family: var(--sp-shrift);
	font-size: 17px;
	font-weight: 600;
	text-align: center;
	-moz-appearance: textfield;
}

html body.sp-produkt form.cart .quantity input.minus,
html body.sp-produkt form.cart .quantity input.plus {
	flex: 0 0 44px;
	width: 44px;
	height: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--sp-mastilo);
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
}

/* ---------- Варианти: бутони вместо падащо меню ---------- */

html body.sp-produkt table.variations {
	width: 100%;
	margin: 0 0 var(--sp-4);
	border: 0;
}

html body.sp-produkt table.variations tr,
html body.sp-produkt table.variations th,
html body.sp-produkt table.variations td {
	display: block;
	padding: 0;
	border: 0;
	background: transparent;
	text-align: left;
}

/* „Цвят“ вляво, избраното („Бял (маслина)“) вдясно — от produkt.js. */
html body.sp-produkt table.variations th.label {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: var(--sp-3);
	margin: 0 0 var(--sp-2);
}

html body.sp-produkt table.variations th.label label {
	display: block;
	margin: 0;
	color: var(--sp-mastilo);
	font-size: 15px;
	line-height: 20px;
	font-weight: 600;
}

html body.sp-produkt .sp-izbrano {
	color: var(--sp-grafit);
	font-size: 14px;
	line-height: 20px;
	font-weight: 400;
	text-align: right;
}

/* Цената на избрания вариант е горе и в бутона — втора не трябва. */
html body.sp-produkt .woocommerce-variation-price {
	display: none !important;
}

html body.sp-produkt .sp-varianti {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--sp-2);
}

html body.sp-produkt .sp-varianti button {
	min-height: 48px;
	margin: 0;
	padding: 6px 12px;
	border: 1px solid var(--sp-ramka);
	border-radius: var(--sp-ugal);
	background: var(--sp-byalo);
	color: var(--sp-mastilo);
	font-family: var(--sp-shrift);
	font-size: 15px;
	line-height: 18px;
	font-weight: 600;
	text-align: left;
	cursor: pointer;
}

html body.sp-produkt .sp-varianti button[aria-checked="true"],
html body.sp-produkt .sp-shirini button[aria-pressed="true"] {
	padding: 5px 11px;
	border: 2px solid var(--sp-marka);
	background: var(--sp-marka-svetlo);
	color: var(--sp-marka);
	font-weight: 700;
}

html body.sp-produkt .sp-varianti button:disabled {
	color: var(--sp-sivo);
	text-decoration: line-through;
	cursor: not-allowed;
}

html body.sp-produkt .sp-skrit-izbor,
html body.sp-produkt .ssc-field select.sp-skrit-izbor {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	min-height: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	opacity: 0 !important;
	pointer-events: none !important;
}

html body.sp-produkt table.variations .reset_variations {
	display: inline-block;
	margin-top: var(--sp-2);
	color: var(--sp-marka);
	font-size: 14px;
}

html body.sp-produkt .woocommerce-variation-price .price,
html body.sp-produkt .woocommerce-variation-price .amount {
	color: var(--sp-mastilo);
	font-size: 22px;
	font-weight: 700;
}

/* ---------- Калкулаторът „по размер“ ---------- */

html body.sp-produkt .ssc-calculator {
	margin: 0;
	padding: var(--sp-4);
	border: 1px solid var(--sp-linia);
	border-radius: var(--sp-ugal-karta);
	background: var(--sp-byalo);
	box-shadow: none;
	font-family: var(--sp-shrift);
	color: var(--sp-mastilo);
}

/* ВНИМАНИЕ: стилът на калкулатора (scorpio-size-calculator/assets/css/frontend.css)
   е с !important на полетата, бутона и заглавието — затова и тук са с !important. */

html body.sp-produkt .ssc-calculator-header {
	display: block;
	margin: 0 0 var(--sp-3);
	padding: 0;
	border: 0;
	background: transparent;
}

html body.sp-produkt .ssc-calculator-header h3 {
	margin: 0 !important;
	color: var(--sp-mastilo);
	font-family: var(--sp-shrift);
	font-size: 20px !important;
	line-height: 26px !important;
	font-weight: 700;
}

html body.sp-produkt .ssc-calculator-header p {
	margin: 2px 0 0;
	color: var(--sp-grafit);
	font-size: 14px;
	line-height: 20px;
}

/* Цената за м² вече е горе, до името. */
html body.sp-produkt .ssc-unit-price {
	display: none;
}

html body.sp-produkt .ssc-column-labels {
	display: none;
}

html body.sp-produkt .ssc-size-rows {
	display: flex;
	flex-direction: column;
	gap: var(--sp-3);
}

html body.sp-produkt .ssc-size-row {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr) 140px;
	grid-template-areas:
		"shirina shirina"
		"dalzhina broy"
		"cena cena";
	gap: var(--sp-3) 10px;
	margin: 0;
	padding: 14px;
	border: 1px solid var(--sp-linia);
	border-radius: var(--sp-ugal-karta);
	background: var(--sp-byalo);
}

html body.sp-produkt .ssc-size-row > label.ssc-field:nth-of-type(1) { grid-area: shirina; }
html body.sp-produkt .ssc-size-row > label.ssc-field:nth-of-type(2) { grid-area: dalzhina; }
html body.sp-produkt .ssc-size-row > label.ssc-field:nth-of-type(3) { grid-area: broy; }
html body.sp-produkt .ssc-size-row > .ssc-row-price { grid-area: cena; }

html body.sp-produkt .ssc-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin: 0;
	min-width: 0;
}

html body.sp-produkt .ssc-field > span {
	color: var(--sp-grafit);
	font-size: 14px;
	line-height: 20px;
	font-weight: 400;
	text-transform: none;
	letter-spacing: 0;
}

html body.sp-produkt .ssc-field select,
html body.sp-produkt .ssc-field input[type="text"],
html body.sp-produkt .ssc-field input[type="number"] {
	width: 100%;
	min-width: 0;
	height: 48px !important;
	min-height: 0 !important;
	margin: 0;
	padding: 0 14px !important;
	border: 1px solid var(--sp-ramka) !important;
	border-radius: var(--sp-ugal) !important;
	background: var(--sp-byalo);
	color: var(--sp-mastilo) !important;
	font: 400 16px/20px var(--sp-shrift) !important;
	box-shadow: none;
}

/* Падащото меню — като на платното: удебелено, с наша стрелка. */
html body.sp-produkt .ssc-field select {
	padding-right: 40px !important;
	font-weight: 600 !important;
	-webkit-appearance: none;
	appearance: none;
	background: var(--sp-byalo) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2316181B' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center / 18px 18px !important;
	cursor: pointer;
}

html body.sp-produkt .ssc-field select:focus,
html body.sp-produkt .ssc-field input:focus {
	border-color: var(--sp-marka) !important;
	outline: 2px solid rgba(0, 63, 122, 0.2) !important;
	outline-offset: 0;
}

html body.sp-produkt .ssc-input-unit {
	position: relative;
	display: block;
}

html body.sp-produkt .ssc-input-unit em {
	position: absolute;
	right: 14px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--sp-sivo);
	font-style: normal;
	pointer-events: none;
}

/* Подсказката („Максимална дължина…“) е сива; червена е само грешката. */
html body.sp-produkt .ssc-field small {
	color: var(--sp-sivo);
	font-size: 13px;
	line-height: 18px;
}

html body.sp-produkt .ssc-field.has-error small {
	color: var(--sp-greshka);
}

html body.sp-produkt .ssc-field.has-error input,
html body.sp-produkt .ssc-field input.has-error {
	border-color: var(--sp-greshka) !important;
	box-shadow: inset 0 0 0 1px var(--sp-greshka);
}

html body.sp-produkt .ssc-message:empty {
	display: none;
}

html body.sp-produkt .ssc-message {
	margin: var(--sp-3) 0 0;
	padding: 10px 12px;
	border-radius: var(--sp-ugal);
	font-size: 14px;
	line-height: 20px;
}

html body.sp-produkt .ssc-message.is-error {
	background: var(--sp-greshka-fon);
	color: var(--sp-greshka);
}

html body.sp-produkt .ssc-message.is-success {
	background: #E7F2EC;
	color: var(--sp-nalichnost);
}

html body.sp-produkt .ssc-field small:empty {
	display: none;
}

/* Ширините като бутони (до 4) — рисуват се от produkt.js. */
html body.sp-produkt .sp-shirini {
	display: grid;
	grid-template-columns: repeat(var(--sp-broy, 2), minmax(0, 1fr));
	gap: var(--sp-2);
}

html body.sp-produkt .sp-shirini button {
	height: 44px;
	margin: 0;
	padding: 0 6px;
	border: 1px solid var(--sp-ramka);
	border-radius: var(--sp-ugal);
	background: var(--sp-byalo);
	color: var(--sp-mastilo);
	font-family: var(--sp-shrift);
	font-size: 16px;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	cursor: pointer;
}

/* Брой с − и +. */
html body.sp-produkt .sp-stepper {
	display: flex;
	height: 48px;
	border: 1px solid var(--sp-ramka);
	border-radius: var(--sp-ugal);
	overflow: hidden;
	background: var(--sp-byalo);
}

/* Полето вътре в −/+ — без своя рамка (иначе „кутия в кутията“). */
html body.sp-produkt .ssc-field .sp-stepper input[type="number"],
html body.sp-produkt .sp-stepper input[type="number"] {
	flex: 1 1 auto;
	width: 0 !important;
	min-width: 0;
	height: 100% !important;
	min-height: 0 !important;
	margin: 0;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	outline: 0 !important;
	text-align: center;
	font-weight: 600 !important;
	-moz-appearance: textfield;
}

/* Фокусът — на цялата кутия с −/+, не на полето вътре. */
html body.sp-produkt .sp-stepper:focus-within {
	border-color: var(--sp-marka);
	outline: 2px solid rgba(0, 63, 122, 0.2);
}

html body.sp-produkt .ssc-input-unit input[type="text"] {
	padding-right: 30px !important;
}

html body.sp-produkt .sp-stepper input::-webkit-outer-spin-button,
html body.sp-produkt .sp-stepper input::-webkit-inner-spin-button,
html body.sp-produkt form.cart .quantity input.qty::-webkit-outer-spin-button,
html body.sp-produkt form.cart .quantity input.qty::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

html body.sp-produkt .sp-stepper button {
	flex: 0 0 44px;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--sp-mastilo);
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
}

html body.sp-produkt .ssc-row-price {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--sp-2);
	padding-top: var(--sp-1);
	border-top: 1px solid var(--sp-linia-svetla);
	font-variant-numeric: tabular-nums;
}

html body.sp-produkt .ssc-row-price > span {
	display: none;
}

html body.sp-produkt .ssc-row-price strong {
	order: 2;
	font-size: 18px;
	line-height: 24px;
	font-weight: 700;
}

html body.sp-produkt .ssc-row-price small {
	order: 1;
	color: var(--sp-sivo);
	font-size: 14px;
}

/* „РАЗМЕР 1“ над всяка карта на телефон, както на платното. */
html body.sp-produkt .ssc-size-rows {
	counter-reset: sp-razmer;
}

html body.sp-produkt .ssc-size-row {
	counter-increment: sp-razmer;
}

html body.sp-produkt .ssc-size-row::before {
	content: "Размер " counter(sp-razmer);
	grid-area: zaglavie;
	color: var(--sp-sivo);
	font-size: 13px;
	line-height: 18px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

html body.sp-produkt .ssc-remove-row {
	position: absolute;
	top: 3px;
	right: 3px;
	width: 40px;
	height: 40px;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--sp-sivo);
	font-size: 22px;
	line-height: 1;
	cursor: pointer;
}

html body.sp-produkt .ssc-add-row {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--sp-2);
	width: 100%;
	height: 44px;
	margin: var(--sp-3) 0 0;
	padding: 0 14px;
	border: 1px dashed var(--sp-ramka);
	border-radius: var(--sp-ugal);
	background: var(--sp-byalo);
	color: var(--sp-marka);
	font-family: var(--sp-shrift);
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
}

/* Долу: общото и бутонът. produkt.js ги слага в .sp-k-dolu — на телефон
   едно под друго, на компютър на един ред (общото вляво, бутонът вдясно).
   Общото е „Общо · 2 бр. · 3,17 м²“, „Тегло около 1,2 кг“ и сумата —
   надписите на добавката („Бройки“, „Площ“…) не се виждат. */
html body.sp-produkt .sp-k-dolu {
	display: flex;
	flex-direction: column;
	gap: var(--sp-3);
	margin: var(--sp-3) 0 0;
	padding: var(--sp-3) 0 0;
	border-top: 1px solid var(--sp-linia);
}

html body.sp-produkt .ssc-summary {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 2px 0;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--sp-grafit);
	font-size: 14px;
	line-height: 20px;
	font-variant-numeric: tabular-nums;
}

/* Добавката скрива общото, докато няма нито една бройка (hidden). */
html body.sp-produkt .ssc-summary[hidden] {
	display: none !important;
}

html body.sp-produkt .ssc-summary > div {
	display: block;
	margin: 0;
	padding: 0;
	background: transparent;
	white-space: nowrap;
}

html body.sp-produkt .ssc-summary > div > span {
	display: none;
}

html body.sp-produkt .ssc-summary > div strong {
	/* Стилът на калкулатора ги прави блокови — тогава „Общо · ·“ стоеше сам, числата — под него (20 окт.). */
	display: inline;
	color: inherit;
	font-size: inherit;
	font-weight: 400;
}

html body.sp-produkt .ssc-summary > .ssc-summary-total strong {
	display: block;
}

html body.sp-produkt .ssc-summary > div:nth-child(1) { order: 1; }
html body.sp-produkt .ssc-summary > div:nth-child(2) { order: 2; }
html body.sp-produkt .ssc-summary > .ssc-summary-total { order: 3; }
html body.sp-produkt .ssc-summary > div:nth-child(3) { order: 4; flex: 1 0 100%; }

html body.sp-produkt .ssc-summary > div:nth-child(1)::before { content: "Общо · "; }
html body.sp-produkt .ssc-summary > div:nth-child(1) strong::after { content: " бр."; }
html body.sp-produkt .ssc-summary > div:nth-child(2)::before { content: "\00a0· "; }
html body.sp-produkt .ssc-summary > div:nth-child(3)::before { content: "Тегло около "; }

html body.sp-produkt .ssc-summary > .ssc-summary-total {
	margin-left: auto;
	padding-left: var(--sp-3);
}

html body.sp-produkt .ssc-summary > .ssc-summary-total strong {
	color: var(--sp-mastilo);
	font-size: 26px;
	line-height: 30px;
	font-weight: 700;
}

html body.sp-produkt .ssc-calculator .ssc-submit,
html body.sp-produkt .ssc-calculator .ssc-submit.button {
	width: 100% !important;
	height: 52px;
	min-height: 52px !important;
	margin: 0 !important;
	border-radius: var(--sp-ugal) !important;
	font-size: 17px !important;
	font-weight: 700 !important;
}

/* С „Любими“ (525) до бутона: общото — на свой ред, под него бутонът и „Любими“ 3 към 1 (21 окт.). */
html body.sp-produkt .sp-k-dolu:has(> .sp-l-red-sartse) {
	flex-direction: row;
	flex-wrap: wrap;
	column-gap: 8px;
}

html body.sp-produkt .sp-k-dolu:has(> .sp-l-red-sartse) > .ssc-summary {
	flex: 0 0 100%;
}

html body.sp-produkt .sp-k-dolu:has(> .sp-l-red-sartse) .ssc-submit,
html body.sp-produkt .sp-k-dolu:has(> .sp-l-red-sartse) .ssc-submit.button {
	flex: 3 1 0;
	width: auto !important;
	min-width: 0;
}

/* ---------- Количествените карти ---------- */

html body.sp-produkt .sqo-offers {
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	font-family: var(--sp-shrift);
}

html body.sp-produkt .sqo-offers-heading h3 {
	margin: 0;
	color: var(--sp-mastilo);
	font-family: var(--sp-shrift);
	font-size: 20px;
	line-height: 26px;
	font-weight: 700;
}

html body.sp-produkt .sqo-offers-heading p {
	margin: 2px 0 var(--sp-3);
	color: var(--sp-grafit);
	font-size: 14px;
	line-height: 20px;
}

html body.sp-produkt .sqo-offer-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--sp-2);
}

html body.sp-produkt .sqo-offer-card {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	grid-template-areas:
		"dyal  cena"
		"pesti merka";
	align-items: center;
	gap: 2px var(--sp-3);
	min-height: 60px;
	margin: 0;
	padding: 10px 14px;
	border: 1px solid var(--sp-ramka);
	border-radius: var(--sp-ugal-karta);
	background: var(--sp-byalo);
	color: var(--sp-mastilo);
	font-family: var(--sp-shrift);
	text-align: left;
	box-shadow: none;
	cursor: pointer;
}

html body.sp-produkt .sqo-offer-card.is-selected {
	padding: 9px 13px;
	border: 2px solid var(--sp-marka);
	background: var(--sp-marka-svetlo);
}

html body.sp-produkt .sqo-range { grid-area: dyal; font-size: 16px; line-height: 22px; font-weight: 700; }
html body.sp-produkt .sqo-price { grid-area: cena; text-align: right; }
html body.sp-produkt .sqo-price,
html body.sp-produkt .sqo-price .amount { font-size: 18px; line-height: 22px; font-weight: 700; color: inherit; }
html body.sp-produkt .sqo-saving { grid-area: pesti; color: var(--sp-nalichnost); font-size: 13px; line-height: 18px; font-weight: 600; }
html body.sp-produkt .sqo-unit { grid-area: merka; color: var(--sp-sivo); font-size: 13px; line-height: 18px; text-align: right; }

html body.sp-produkt .sqo-offer-card.is-selected .sqo-range,
html body.sp-produkt .sqo-offer-card.is-selected .sqo-price,
html body.sp-produkt .sqo-offer-card.is-selected .sqo-price .amount {
	color: var(--sp-marka);
}

html body.sp-produkt .sqo-offer-card:first-child .sqo-saving {
	color: var(--sp-sivo);
	font-weight: 400;
}

/* „Най-изгодно“ — в реда на отстъпката, както на платното
   („спестявате 50% · най-изгодно“), не като етикет над рамката. */
html body.sp-produkt .sqo-best-label {
	display: none !important;
}

html body.sp-produkt .sqo-offer-card.is-best .sqo-saving::after {
	content: " · най-изгодно";
}

html body.sp-produkt .sqo-note {
	margin: var(--sp-2) 0 0;
	color: var(--sp-sivo);
	font-size: 13px;
	line-height: 18px;
}

/* ---------- Доставка ---------- */

html body.sp-produkt .sp-p-dostavka {
	margin: var(--sp-6) 0 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--sp-linia);
}

html body.sp-produkt .sp-p-dostavka li {
	display: flex;
	align-items: flex-start;
	gap: var(--sp-3);
	margin: 0;
	padding: 10px 0;
	border-bottom: 1px solid var(--sp-linia-svetla);
	color: var(--sp-grafit);
	font-size: 14px;
	line-height: 20px;
}

html body.sp-produkt .sp-p-dostavka li .sp-ikona {
	margin-top: 1px;
	color: var(--sp-mastilo);
}

html body.sp-produkt .sp-p-dostavka li:last-child {
	border-bottom: 0;
}

html body.sp-produkt .sp-p-dostavka strong {
	display: block;
	margin-bottom: 2px;
	color: var(--sp-mastilo);
	font-size: 15px;
	line-height: 20px;
	font-weight: 600;
}

/* Пълният текст — на телефон; късият (от платното) — на компютър. */
html body.sp-produkt .sp-komp {
	display: none;
}

@media (min-width: 1024px) {
	html body.sp-produkt .sp-tel {
		display: none;
	}

	html body.sp-produkt .sp-komp {
		display: inline;
	}
}

/* „Приблизителен период за доставка“ — в зелено, като „В наличност“; последният ред на списъка.
   Отстъпът отляво — колкото иконката и разстоянието до нея, за да е под текста на фактите. */
html body.sp-produkt .sp-p-dostavka li.sp-p-srok {
	box-sizing: border-box;
	max-width: 100%;
	display: block;
	padding-left: 34px;
	color: var(--sp-nalichnost);
	font-family: var(--sp-shrift);
	font-size: 15px;
	line-height: 22px;
}

html body.sp-produkt .sp-p-dostavka li.sp-p-srok[hidden] {
	display: none;
}

html body.sp-produkt .sp-p-srok b {
	color: inherit;
	font-weight: 600;
}

html body.sp-produkt .sp-p-dostavka a {
	color: var(--sp-marka);
	white-space: nowrap;
}

/* Теглото на брой — под „Еконт или Pigeon“. */
html body.sp-produkt .sp-p-teglo {
	display: block;
	margin-top: 2px;
}

html body.sp-produkt .sp-p-teglo[hidden] {
	display: none;
}

html body.sp-produkt .sp-p-teglo b {
	color: var(--sp-mastilo);
	font-weight: 600;
}

/* На компютър ширините са бутони само при две; при 3–4 бутоните не се
   побират в колоната и остава падащото меню (produkt.js слага класа). */
html body.sp-produkt .ssc-width-field.sp-shirini-menyu .sp-shirini {
	display: none;
}

html body.sp-produkt .ssc-width-field.sp-shirini-menyu select.sp-skrit-izbor {
	position: static !important;
	width: 100% !important;
	height: 44px !important;
	opacity: 1 !important;
	pointer-events: auto !important;
	/* Цифрите не до рамката; своята стрелка (той, 21 окт.). */
	padding: 0 36px 0 12px !important;
	border: 1px solid var(--sp-ramka) !important;
	border-radius: var(--sp-ugal) !important;
	background: var(--sp-byalo) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%233D4248' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center !important;
	color: var(--sp-mastilo) !important;
	font-family: var(--sp-shrift) !important;
	font-size: 16px !important;
	font-weight: 600 !important;
	-webkit-appearance: none !important;
	appearance: none !important;
	cursor: pointer;
}

/* ---------- Сивият фон, белите карти ---------- */

html body.sp-produkt #main {
	background-color: var(--sp-fon) !important;
}

html body.sp-produkt .sp-p-dolu {
	clear: both;
	display: grid;
	gap: var(--sp-3);
	padding-top: var(--sp-6);
	font-family: var(--sp-shrift);
	color: var(--sp-mastilo);
}

html body.sp-produkt .sp-p-karta {
	min-width: 0;
	padding: 20px var(--sp-4);
	background: var(--sp-byalo);
	border: 1px solid var(--sp-linia);
	border-radius: var(--sp-ugal-karta);
}

html body.sp-produkt .sp-p-karta__zaglavie {
	margin: 0 0 14px;
	color: var(--sp-mastilo);
	font-family: var(--sp-shrift);
	font-size: 20px;
	line-height: 26px;
	font-weight: 700;
	text-transform: none;
	letter-spacing: 0;
}

html body.sp-produkt .sp-p-opisanie {
	display: grid;
	gap: var(--sp-4);
}

/* ---------- Отзивите ---------- */

html body.sp-produkt .sp-p-otzivi__obshto {
	display: flex;
	align-items: center;
	gap: var(--sp-3);
	margin: 0 0 var(--sp-4);
}

html body.sp-produkt .sp-p-otzivi__chislo {
	font-size: 40px;
	line-height: 44px;
	font-weight: 800;
	font-variant-numeric: tabular-nums;
}

html body.sp-produkt .sp-p-otzivi__ot {
	display: block;
	color: var(--sp-sivo);
	font-size: 14px;
	line-height: 20px;
}

html body.sp-produkt .sp-p-otzivi__prazno {
	margin: 0;
	color: var(--sp-grafit);
	font-size: 15px;
}

html body.sp-produkt .sp-p-otziv {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin: 0 0 var(--sp-2);
	padding: 14px;
	border: 1px solid var(--sp-linia);
	border-radius: var(--sp-ugal-karta);
}

html body.sp-produkt .sp-p-otziv__gore {
	display: flex;
	justify-content: space-between;
	gap: var(--sp-3);
	font-size: 14px;
	line-height: 20px;
}

html body.sp-produkt .sp-p-otziv__gore span {
	color: var(--sp-sivo);
}

html body.sp-produkt .sp-p-otziv p {
	margin: 0;
	color: var(--sp-grafit);
	font-size: 15px;
	line-height: 22px;
}

html body.sp-produkt .sp-p-otzivi__oshte summary {
	display: inline-flex;
	align-items: center;
	height: 44px;
	padding: 0 18px;
	border: 1px solid var(--sp-mastilo);
	border-radius: var(--sp-ugal);
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
	list-style: none;
}

html body.sp-produkt .sp-p-otzivi__oshte summary::-webkit-details-marker {
	display: none;
}

html body.sp-produkt .sp-p-otzivi__oshte[open] summary {
	margin-bottom: var(--sp-3);
}

html body.sp-produkt .sp-p-opisanie__tekst p {
	margin: 0 0 var(--sp-3);
	color: var(--sp-grafit);
	font-size: 16px;
	line-height: 25px;
}

html body.sp-produkt .sp-p-tablica {
	display: grid;
	grid-template-columns: 160px minmax(0, 1fr);
	margin: 0;
	font-size: 15px;
	line-height: 22px;
}

html body.sp-produkt .sp-p-tablica dt,
html body.sp-produkt .sp-p-tablica dd {
	margin: 0;
	padding: 10px 0;
	border-top: 1px solid var(--sp-linia-svetla);
}

html body.sp-produkt .sp-p-tablica dt {
	padding-right: var(--sp-4);
	color: var(--sp-sivo);
	font-weight: 400;
}

/* ---------- Лентата долу на телефона ---------- */

.sp-p-lenta {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 9980;
	display: flex;
	align-items: center;
	gap: var(--sp-3);
	padding: 10px var(--sp-4) calc(14px + env(safe-area-inset-bottom, 0px));
	background: var(--sp-byalo);
	border-top: 1px solid var(--sp-linia);
	box-shadow: 0 -4px 12px rgba(22, 24, 27, 0.08);
	font-family: var(--sp-shrift);
	color: var(--sp-mastilo);
	transform: translateY(110%);
	transition: transform 0.2s ease;
}

.sp-p-lenta.is-vidima {
	transform: translateY(0);
}

/* Докато лентата е горе: плаващата количка (броят е и в хедъра) и „нагоре“ не я закриват. */
@media (max-width: 1023px) {
	html body.sp-p-lenta-vidima #fkcart-floating-toggler,
	html body.sp-p-lenta-vidima .to-top-container {
		display: none !important;
	}
}

.sp-p-lenta__cena {
	display: flex;
	flex-direction: column;
	min-width: 0;
	font-variant-numeric: tabular-nums;
}

.sp-p-lenta__cena small {
	color: var(--sp-sivo);
	font-size: 13px;
	line-height: 18px;
	white-space: nowrap;
}

.sp-p-lenta__cena strong {
	font-size: 22px;
	line-height: 26px;
	font-weight: 700;
	white-space: nowrap;
}

.sp-p-lenta button {
	flex: 1 1 auto;
	height: 48px;
	margin: 0;
	border: 0;
	border-radius: var(--sp-ugal);
	background: var(--sp-deystvie);
	color: var(--sp-byalo);
	font-family: var(--sp-shrift);
	font-size: 16px;
	font-weight: 700;
	cursor: pointer;
}

@media (min-width: 1024px) {
	.sp-p-lenta {
		display: none;
	}

	html body.sp-produkt .summary h1.sp-p-ime {
		font-size: 34px;
		line-height: 40px;
		letter-spacing: -0.02em;
	}

	html body.sp-produkt .sp-p-cena__suma,
	html body.sp-produkt .sp-p-cena__suma .amount {
		font-size: 36px;
		line-height: 40px;
	}

	html body.sp-produkt .product.type-product .avada-single-product-gallery-wrapper {
		width: var(--sp-p-shirina-snimka);
	}

	/* Avada смята отстъпа за своята снимка (430 px); с по-широката снимка
	   блокът стъпваше върху нея и всичко с flex/grid се свличаше под снимката. */
	html body.sp-produkt .product.type-product .summary.entry-summary {
		float: none;
		width: auto !important;
		margin-left: calc(var(--sp-p-shirina-snimka) + var(--sp-12)) !important;
	}

	/* На компютър калкулаторът е таблица: ред = размер. */
	html body.sp-produkt .ssc-calculator {
		padding: 20px;
	}

	html body.sp-produkt .ssc-calculator-header {
		margin-bottom: 14px;
	}

	html body.sp-produkt .ssc-size-row::before {
		display: none;
	}

	html body.sp-produkt .sp-k-dolu {
		flex-direction: row;
		align-items: center;
		gap: 20px;
		margin-top: 14px;
		padding-top: 14px;
	}

	html body.sp-produkt .sp-k-dolu .ssc-summary {
		flex: 0 1 auto;
		min-width: 0;
	}

	html body.sp-produkt .ssc-summary > div:nth-child(3) {
		order: 3;
		flex: none;
	}

	html body.sp-produkt .ssc-summary > div:nth-child(3)::before {
		content: "\00a0· около ";
	}

	html body.sp-produkt .ssc-summary > .ssc-summary-total {
		order: 4;
		flex: 1 0 100%;
		margin-left: 0;
		padding-left: 0;
	}

	html body.sp-produkt .ssc-summary > .ssc-summary-total strong {
		font-size: 28px;
		line-height: 32px;
	}

	html body.sp-produkt .sp-k-dolu .ssc-submit,
	html body.sp-produkt .sp-k-dolu .ssc-submit.button {
		/* Никога по-тесен от надписа си (23 окт.: с „Общо“ вляво се свиваше до ~200 px и
		   „Добави в количката“ излизаше от кутийката). */
		flex: 1 0 auto;
		width: auto !important;
		/* „Добави в количката“ се чупеше на два реда до сумата (20 окт.). */
		padding-left: 16px !important;
		padding-right: 16px !important;
		white-space: nowrap;
	}

	/* С „Любими“: общото, бутонът и сърцето на един ред, ако се събират; иначе общото —
	   на свой ред, отдолу бутонът и сърцето. Общото се свива и пренася („Общо · 1 бр. · 2,1 м²“ / „около 3,36 кг“). */
	html body.sp-produkt .sp-k-dolu:has(> .sp-l-red-sartse) {
		flex-wrap: wrap;
		column-gap: 10px;
		row-gap: 12px;
	}

	html body.sp-produkt .sp-k-dolu:has(> .sp-l-red-sartse) > .ssc-summary {
		flex: 1 1 220px;
		min-width: 0;
		margin-right: 10px;
	}

	html body.sp-produkt .sp-k-dolu:has(> .sp-l-red-sartse) .ssc-submit,
	html body.sp-produkt .sp-k-dolu:has(> .sp-l-red-sartse) .ssc-submit.button {
		flex: 1 0 auto;
	}

	html body.sp-produkt .sp-k-dolu:has(> .sp-l-red-sartse) > .sp-l-red-sartse {
		flex: 0 0 auto;
		/* 525 му дава width: 100% — с „auto“ основа то иначе пада на свой ред. */
		width: auto;
		min-width: 64px;
		padding: 0 14px;
	}

	html body.sp-produkt .ssc-column-labels {
		display: grid;
		grid-template-columns: var(--sp-shir-kol, 180px) 96px 124px minmax(90px, 1fr) 36px;
		gap: 10px;
		margin: 0 0 var(--sp-2);
		padding: 0;
		color: var(--sp-sivo);
		font-size: 13px;
		line-height: 18px;
		font-weight: 400;
		text-transform: none;
		letter-spacing: 0;
	}

	html body.sp-produkt .ssc-column-labels span {
		padding: 0;
		text-transform: none;
		letter-spacing: 0;
	}

	html body.sp-produkt .ssc-column-labels span:nth-child(4) {
		text-align: right;
	}

	html body.sp-produkt .ssc-size-rows {
		gap: var(--sp-2);
	}

	/* Подравнено отгоре: подсказката под ширината („Максимална дължина…“)
	   удължава само първата клетка, останалите остават на линията на полетата. */
	html body.sp-produkt .ssc-size-row {
		grid-template-columns: var(--sp-shir-kol, 180px) 96px 124px minmax(90px, 1fr) 36px;
		grid-template-areas: "shirina dalzhina broy cena mahni";
		align-items: start;
		gap: 10px;
		padding: 0;
		border: 0;
	}

	html body.sp-produkt .ssc-size-row > .ssc-row-price {
		min-height: 44px;
	}

	html body.sp-produkt .ssc-size-row > .ssc-remove-row {
		height: 44px;
	}

	/* Само надписът над полето — НЕ обвивката на полето (.ssc-input-unit, .sp-stepper),
	   която също е <span>: така изчезваха „Дължина“ и „Брой“. */
	html body.sp-produkt .ssc-field > span:first-child {
		display: none;
	}

	html body.sp-produkt .ssc-field select,
	html body.sp-produkt .ssc-field input[type="text"],
	html body.sp-produkt .ssc-field input[type="number"],
	html body.sp-produkt .sp-stepper {
		height: 44px !important;
	}

	html body.sp-produkt .ssc-field select,
	html body.sp-produkt .ssc-field input[type="text"] {
		padding-left: 12px !important;
	}

	html body.sp-produkt .sp-shirini button {
		padding: 0 4px;
		font-size: 15px;
	}

	html body.sp-produkt .sp-stepper button {
		flex-basis: 40px;
	}

	html body.sp-produkt .ssc-row-price {
		flex-direction: column;
		align-items: flex-end;
		justify-content: center;
		gap: 0;
		padding: 0;
		border: 0;
		white-space: nowrap;
	}

	html body.sp-produkt .ssc-row-price strong {
		order: 1;
		font-size: 17px;
		line-height: 22px;
	}

	html body.sp-produkt .ssc-row-price small {
		order: 2;
		font-size: 12px;
		line-height: 16px;
	}

	html body.sp-produkt .ssc-remove-row {
		position: static;
		grid-area: mahni;
		width: 36px;
	}

	html body.sp-produkt .ssc-add-row {
		width: auto;
		height: 40px;
		margin-top: 14px;
	}

	html body.sp-produkt .sqo-offer-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 10px;
	}

	html body.sp-produkt .sqo-offer-card {
		grid-template-columns: 1fr;
		grid-template-areas:
			"dyal"
			"cena"
			"pesti"
			"merka";
		align-content: start;
		min-height: 112px;
		padding: 12px;
	}

	html body.sp-produkt .sqo-offer-card.is-selected {
		padding: 11px;
	}

	html body.sp-produkt .sqo-price { text-align: left; }
	html body.sp-produkt .sqo-price,
	html body.sp-produkt .sqo-price .amount { font-size: 24px; line-height: 28px; }
	html body.sp-produkt .sqo-unit { text-align: left; }

	html body.sp-produkt .sp-varianti {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	html body.sp-produkt .sp-p-dostavka {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: var(--sp-4);
		padding: 0;
		border: 0;
	}

	html body.sp-produkt .sp-p-dostavka li {
		gap: 10px;
		padding: 0;
		border: 0;
	}

	/* Под „Еконт или Pigeon“ и „Въпрос за размера?“, в празното до по-високата първа колона. */
	html body.sp-produkt .sp-p-dostavka li.sp-p-srok {
		grid-column: 2 / span 2;
		grid-row: 2;
		margin-top: -10px;
		padding-left: 32px;
	}

	html body.sp-produkt .sp-p-dostavka:has(> li.sp-p-srok:not([hidden])) > li:first-child {
		grid-row: 1 / span 2;
	}

	/* Горе: оценка · наличност · код — по 16, както на платното. */
	html body.sp-produkt .sp-p-red {
		column-gap: var(--sp-4);
	}

	/* „… с ДДС · 0,008 € на брой“ — на същия ред, като мярката. */
	html body.sp-produkt .sp-p-na-broy {
		flex: 0 1 auto;
		color: var(--sp-sivo);
		font-size: 15px;
	}

	html body.sp-produkt .sp-p-na-broy::before {
		content: "· ";
	}

	html body.sp-produkt .sp-p-na-broy .amount {
		font-weight: 400;
	}

	html body.sp-produkt .sp-p-dolu {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--sp-12);
		align-items: start;
		padding-top: var(--sp-8);
	}

	/* „За продукта“ сама на реда (с 560): текстът и таблицата една до друга, иначе
	   редът на текста ставаше 1 500 px. */
	html body.sp-produkt .sp-p-dolu--edna .sp-p-opisanie:has(> .sp-p-opisanie__tekst + .sp-p-tablica) {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		column-gap: var(--sp-16);
		align-items: start;
	}

	html body.sp-produkt .sp-p-dolu--edna .sp-p-opisanie__tekst {
		max-width: 760px;
	}

	html body.sp-produkt .sp-p-karta {
		padding: 28px;
	}

	html body.sp-produkt .sp-p-karta__zaglavie {
		margin-bottom: var(--sp-4);
		font-size: 24px;
		line-height: 30px;
	}
}

/* ---------- Пътят ---------- */

/* Над пътя Avada оставя 60 px — на платното са 24 (компютър) и 12 (телефон). */
html body.sp-produkt #main {
	padding-top: var(--sp-6) !important;
}

html body.sp-produkt .sp-p-put {
	margin: 0 0 var(--sp-8);
}

@media (max-width: 1023px) {
	html body.sp-produkt #main {
		padding-top: var(--sp-3) !important;
	}

	html body.sp-produkt .sp-p-put {
		margin-bottom: var(--sp-3);
	}
}

html body.sp-produkt .sp-p-put__tuk {
	color: var(--sp-sivo);
}

/* ---------- Редът под името: оценка · наличност · код ---------- */

html body.sp-produkt .sp-p-kod {
	margin: 0;
	padding: 0 !important;
	border: 0 !important;
	color: var(--sp-sivo);
	font-size: 14px;
	line-height: 20px;
}

/* Без точка: на платното разделът е само отстъпът (16 / 12), а на телефон
   редът се пренася и точката оставаше в началото на втория ред. */

html body.sp-produkt .sp-p-kod .sku_wrapper,
html body.sp-produkt .sp-p-kod .sku {
	display: inline;
	margin: 0;
	padding: 0;
	color: inherit;
	font-size: inherit;
	font-weight: 400;
	text-transform: none;
}

html body.sp-produkt .sp-p-kod .sku_wrapper[hidden] {
	display: none;
}

/* ---------- Галерията ---------- */

html body.sp-produkt .avada-single-product-gallery-wrapper {
	margin-bottom: 0;
}

html body.sp-produkt .avada-single-product-gallery-wrapper .woocommerce-product-gallery {
	float: none !important;
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
}

html body.sp-produkt .woocommerce-product-gallery .flex-viewport,
html body.sp-produkt .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper {
	background: var(--sp-byalo);
}

html body.sp-produkt .woocommerce-product-gallery__image img:not(.zoomImg) {
	display: block;
	width: 100% !important;
	max-width: 100% !important;
	height: auto !important;
	aspect-ratio: 1;
	object-fit: contain;
}

html body.sp-produkt .woocommerce-product-gallery .flex-direction-nav {
	display: none;
}

/* Точките — рисуват се от produkt.js, само на телефон. */
html body.sp-produkt .sp-p-tochki {
	display: none;
}

@media (max-width: 1023px) {
	/* Сивото е между белите блокове: снимката, блокът за купуване, картите. */
	html body.sp-produkt .avada-single-product-gallery-wrapper {
		float: none !important;
		width: auto !important;
		margin: 0 calc(50% - 50vw) !important;
		background: var(--sp-byalo);
	}

	/* Страничният отстъп е 16, както на платното и в хедъра (Avada: 30) —
	   иначе пътят и „Още от …“ стояха по-навътре от блока за купуване. */
	html body.sp-produkt #main {
		padding-left: var(--sp-4) !important;
		padding-right: var(--sp-4) !important;
	}

	/* #wrapper — Avada има за телефон „#wrapper … .summary { width: 100% !important }“
	   и без ID то печели: блокът оставаше 315 px и изместен наляво.
	   Самият блок е прозрачен — белите са трите ленти в него. */
	html body.sp-produkt #wrapper .product.type-product .summary.entry-summary {
		float: none !important;
		width: auto !important;
		margin: 0 calc(50% - 50vw) !important;
		padding: 0 !important;
		background: transparent;
		border: 0;
	}

	html body.sp-produkt .sp-p-glava {
		padding: var(--sp-4);
		background: var(--sp-byalo);
		border-bottom: 1px solid var(--sp-linia);
	}

	html body.sp-produkt .summary .summary-container > .sp-p-kupuvane {
		margin-top: var(--sp-3) !important;
		padding: var(--sp-4);
		background: var(--sp-byalo);
		border-top: 1px solid var(--sp-linia);
		border-bottom: 1px solid var(--sp-linia);
	}

	html body.sp-produkt .summary .summary-container > .sp-p-dostavka {
		margin-top: var(--sp-3) !important;
		padding: var(--sp-2) var(--sp-4);
		background: var(--sp-byalo);
		border-top: 1px solid var(--sp-linia);
		border-bottom: 1px solid var(--sp-linia);
	}

	/* Калкулаторът вече е в бяла лента — без втора рамка около него
	   (иначе редовете бяха с 47 px навътре вместо 31). */
	html body.sp-produkt .ssc-calculator {
		padding: 0;
		border: 0;
		border-radius: 0;
		background: transparent;
	}

	html body.sp-produkt .ssc-size-row {
		grid-template-areas:
			"zaglavie zaglavie"
			"shirina shirina"
			"dalzhina broy"
			"cena cena";
	}

	html body.sp-produkt .sp-p-put__tuk {
		display: none;
	}

	html body.sp-produkt .woocommerce-product-gallery .flex-viewport {
		aspect-ratio: 1;
		height: auto !important;
	}

	/* Прозрачният слой на Avada за увеличение „яде“ плъзгането с пръст —
	   докосването се препраща от produkt.js (както в старата подредба). */
	html body.sp-produkt .avada-product-gallery-lightbox-trigger {
		pointer-events: none !important;
	}

	html body.sp-produkt .sp-p-tochki-gotovi .avada-product-gallery-thumbs-wrapper,
	html body.sp-produkt .sp-p-tochki-gotovi .flex-control-thumbs {
		display: none !important;
	}

	html body.sp-produkt .woocommerce-product-gallery {
		position: relative;
	}

	html body.sp-produkt .sp-p-tochki:not([hidden]) {
		position: absolute;
		left: 12px;
		right: 12px;
		bottom: 6px;
		z-index: 5;
		display: flex;
		justify-content: center;
		pointer-events: none;
	}

	html body.sp-produkt .sp-p-tochki button {
		width: 28px;
		height: 30px;
		margin: 0;
		padding: 0;
		border: 0;
		background: transparent;
		display: grid;
		place-items: center;
		pointer-events: auto;
		cursor: pointer;
	}

	html body.sp-produkt .sp-p-tochki button::before {
		content: "";
		width: 8px;
		height: 8px;
		border-radius: 4px;
		background: var(--sp-ramka);
		transition: width 0.15s ease;
	}

	html body.sp-produkt .sp-p-tochki button[aria-pressed="true"]::before {
		width: 18px;
		background: var(--sp-marka);
	}

	html body.sp-produkt .sp-p-dolu {
		margin: 0 calc(50% - 50vw);
		padding-top: var(--sp-3);
	}

	html body.sp-produkt .sp-p-karta {
		border-radius: 0;
		border-left: 0;
		border-right: 0;
	}
}

@media (min-width: 1024px) {
	/* Голямата снимка в бяла кутия с тънка рамка; миниатюрите — всяка в своя.
	   При една снимка въртележка няма и снимката е направо в __wrapper. */
	html body.sp-produkt .woocommerce-product-gallery .flex-viewport,
	html body.sp-produkt .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper {
		box-sizing: border-box;
		border: 1px solid var(--sp-linia);
		border-radius: var(--sp-ugal-karta);
		overflow: hidden;
	}

	html body.sp-produkt .avada-product-gallery-thumbs-wrapper {
		width: 100% !important;
		margin: var(--sp-3) 0 0 !important;
		overflow: visible !important;
	}

	html body.sp-produkt .woocommerce-product-gallery ol.flex-control-thumbs {
		display: grid !important;
		grid-template-columns: repeat(5, minmax(0, 1fr));
		gap: var(--sp-3);
		width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
		transform: none !important;
	}

	html body.sp-produkt .woocommerce-product-gallery ol.flex-control-thumbs li {
		float: none !important;
		width: auto !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	html body.sp-produkt .woocommerce-product-gallery ol.flex-control-thumbs img {
		box-sizing: border-box;
		width: 100% !important;
		height: auto !important;
		aspect-ratio: 1;
		object-fit: contain;
		padding: 4px;
		background: var(--sp-byalo);
		border: 1px solid var(--sp-linia);
		border-radius: var(--sp-ugal);
		opacity: 1 !important;
		cursor: pointer;
	}

	html body.sp-produkt .woocommerce-product-gallery ol.flex-control-thumbs img.flex-active {
		padding: 3px;
		border: 2px solid var(--sp-marka);
	}

	/* Миниатюрите — в колона вляво от снимката, снимката — до височината на екрана (той, 25 окт.:
	   „неудобно е да скролваш надолу да избираш снимката, а после нагоре да я видиш“). */
	html body.sp-produkt .woocommerce-product-gallery:has(.avada-product-gallery-thumbs-wrapper) {
		display: grid !important;
		grid-template-columns: 72px minmax(0, 1fr);
		column-gap: var(--sp-3);
		align-items: start;
	}

	html body.sp-produkt .woocommerce-product-gallery:has(.avada-product-gallery-thumbs-wrapper) > .flex-viewport {
		grid-column: 2;
		grid-row: 1;
		width: 100%;
		max-width: min(100%, calc(100vh - 250px));
	}

	html body.sp-produkt .woocommerce-product-gallery > .sp-p-tochki {
		grid-column: 2;
	}

	html body.sp-produkt .woocommerce-product-gallery > .woocommerce-product-gallery__wrapper {
		max-width: min(100%, calc(100vh - 250px));
	}

	html body.sp-produkt .woocommerce-product-gallery:has(.avada-product-gallery-thumbs-wrapper) .avada-product-gallery-thumbs-wrapper {
		grid-column: 1;
		grid-row: 1;
		width: 72px !important;
		height: auto !important;
		max-height: calc(100vh - 250px);
		margin: 0 !important;
		overflow-x: hidden !important;
		overflow-y: auto !important;
		scrollbar-width: thin;
	}

	/* Avada ги държи absolute с top отрицателно и ширина в px (въртележката) — тук са просто колона. */
	html body.sp-produkt .woocommerce-product-gallery:has(.avada-product-gallery-thumbs-wrapper) ol.flex-control-thumbs {
		position: static !important;
		top: auto !important;
		left: auto !important;
		width: 100% !important;
		height: auto !important;
		grid-template-columns: 1fr;
		gap: var(--sp-2);
	}

	html body.sp-produkt .woocommerce-product-gallery:has(.avada-product-gallery-thumbs-wrapper) ol.flex-control-thumbs li {
		width: 100% !important;
	}
}

/* ---------- „Още от …“ — свързаните продукти като карти ---------- */

html body.sp-produkt .related.products {
	clear: both;
	padding-top: var(--sp-8);
	font-family: var(--sp-shrift);
}

/* #main — Avada оцветява заглавието със селектор с #wrapper #main (синьо, тънко). */
html body.sp-produkt #main .related.products > h2,
html body.sp-produkt #main .related.products .fusion-title h2,
html body.sp-produkt #main .related.products .fusion-title h3 {
	margin: 0 !important;
	color: var(--sp-mastilo) !important;
	font-family: var(--sp-shrift) !important;
	font-size: 24px !important;
	line-height: 30px !important;
	font-weight: 700 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	text-align: left;
}

html body.sp-produkt #main .related.products > h2,
html body.sp-produkt #main .related.products .fusion-title {
	margin: 0 0 var(--sp-4) !important;
}

html body.sp-produkt .related.products .fusion-title .title-sep-container {
	display: none;
}

html body.sp-produkt .related.products ul.products {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--sp-3);
	margin: 0 !important;
	padding: 0;
}

html body.sp-produkt .related.products ul.products::before,
html body.sp-produkt .related.products ul.products::after {
	display: none;
}

html body.sp-produkt .related.products ul.products li.product {
	float: none !important;
	width: auto !important;
	margin: 0 !important;
	padding: 0 !important;
}

html body.sp-produkt .related.products .fusion-product-wrapper {
	height: 100%;
	display: flex;
	flex-direction: column;
	padding: 0 !important;
	overflow: hidden;
	background: var(--sp-byalo);
	border: 1px solid var(--sp-linia) !important;
	border-radius: var(--sp-ugal-karta);
	box-shadow: none !important;
}

/* Снимката — в ниска лента (180 / 130 px, както на платното), цялата,
   върху бяло (снимките са на бял фон — върху сиво стояха като кутия в кутия).
   Беше квадрат на цялата ширина — 280 px и картата ставаше 450 px. */
html body.sp-produkt .related.products .product-images {
	display: block;
	border-bottom: 1px solid var(--sp-linia-svetla);
	background: var(--sp-byalo);
}

html body.sp-produkt .related.products .featured-image {
	position: relative;
	display: block;
	height: 180px;
	padding: var(--sp-2);
	box-sizing: border-box;
	background: var(--sp-byalo);
}

html body.sp-produkt .related.products .featured-image img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	max-width: none;
	aspect-ratio: auto;
	object-fit: contain;
}

html body.sp-produkt .related.products .fusion-product-content {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	padding: var(--sp-3) !important;
}

html body.sp-produkt .related.products .product-details,
html body.sp-produkt .related.products .product-details-container {
	padding: 0 !important;
	text-align: left !important;
}

html body.sp-produkt .related.products .product-title,
html body.sp-produkt .related.products .product-title a {
	margin: 0 0 var(--sp-2);
	color: var(--sp-mastilo);
	font-family: var(--sp-shrift);
	font-size: 14px;
	line-height: 20px;
	font-weight: 600;
	text-transform: none;
}

html body.sp-produkt .related.products .fusion-price-rating {
	display: block;
	text-align: left;
}

html body.sp-produkt .related.products .price,
html body.sp-produkt .related.products .price .amount {
	color: var(--sp-mastilo);
	font-size: 18px;
	line-height: 24px;
	font-weight: 700;
}

html body.sp-produkt .related.products .star-rating,
html body.sp-produkt .related.products .fusion-content-sep,
html body.sp-produkt .related.products .show_details_button {
	display: none !important;
}

html body.sp-produkt .related.products .product-buttons {
	margin-top: auto;
	padding: var(--sp-2) 0 0 !important;
}

html body.sp-produkt .related.products .product-buttons-container {
	display: block !important;
	width: 100%;
	padding: 0;
}

/* На цяла ширина (Avada: „.product-buttons a { width: auto; float: left }“). */
html body.sp-produkt .related.products .product-buttons-container a.button {
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: 100% !important;
	height: 44px;
	margin: 0 !important;
	padding: 0 var(--sp-2);
	float: none !important;
	border: 1px solid var(--sp-mastilo) !important;
	border-radius: var(--sp-ugal);
	background: var(--sp-byalo) !important;
	color: var(--sp-mastilo) !important;
	font-family: var(--sp-shrift);
	font-size: 14px;
	font-weight: 600;
	text-transform: none;
	box-shadow: none;
}

html body.sp-produkt .related.products .product-buttons-container a.button::before {
	display: none;
}

@media (min-width: 1024px) {
	html body.sp-produkt .related.products ul.products {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: var(--sp-6);
	}

	html body.sp-produkt .related.products .fusion-product-content {
		padding: var(--sp-4) !important;
	}

	html body.sp-produkt .related.products .product-title,
	html body.sp-produkt .related.products .product-title a {
		font-size: 16px;
		line-height: 22px;
	}

	html body.sp-produkt .related.products .price,
	html body.sp-produkt .related.products .price .amount {
		font-size: 20px;
	}
}

@media (max-width: 1023px) {
	html body.sp-produkt .related.products {
		padding-top: 20px;
	}

	html body.sp-produkt #main .related.products > h2,
	html body.sp-produkt #main .related.products .fusion-title h2,
	html body.sp-produkt #main .related.products .fusion-title h3 {
		font-size: 20px !important;
		line-height: 26px !important;
	}

	html body.sp-produkt #main .related.products > h2,
	html body.sp-produkt #main .related.products .fusion-title {
		margin-bottom: var(--sp-3) !important;
	}

	/* На телефон — лента с плъзгане, по 170 px, както на платното;
	   картата е връзка (снимка, име, цена), без бутон. */
	html body.sp-produkt .related.products ul.products {
		display: flex !important;
		gap: var(--sp-3);
		margin: 0 calc(50% - 50vw) !important;
		padding: 0 var(--sp-4) var(--sp-1) !important;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scroll-padding: 0 var(--sp-4);
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
	}

	html body.sp-produkt .related.products ul.products::-webkit-scrollbar {
		display: none;
	}

	html body.sp-produkt .related.products ul.products li.product {
		flex: 0 0 170px;
		scroll-snap-align: start;
	}

	html body.sp-produkt .related.products .featured-image {
		height: 130px;
	}

	html body.sp-produkt .related.products .fusion-product-content {
		padding: 10px 12px 12px !important;
	}

	html body.sp-produkt .related.products .price,
	html body.sp-produkt .related.products .price .amount {
		font-size: 17px;
		line-height: 22px;
	}

	html body.sp-produkt .related.products .product-buttons {
		display: none !important;
	}
}


/* ---------- „Други размери“ — над „Добави“ (13 окт.) ---------- */

html body.sp-produkt .sp-p-razmeri {
	margin: 0 0 var(--sp-4);
	display: flex;
	flex-direction: column;
	gap: 10px;
	font-family: var(--sp-shrift);
}

html body.sp-produkt .sp-p-razmeri__ime {
	color: var(--sp-grafit);
	font-size: 14px;
	line-height: 20px;
	font-weight: 600;
}

html body.sp-produkt .sp-p-razmeri__chipove {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

html body.sp-produkt a.sp-p-razmeri__chip {
	min-height: 40px;
	padding: 6px 12px;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	border: 1px solid var(--sp-linia);
	border-radius: var(--sp-ugal);
	background: var(--sp-byalo);
	color: var(--sp-mastilo) !important;
	font-size: 14px;
	line-height: 18px;
	text-decoration: none !important;
}

html body.sp-produkt a.sp-p-razmeri__chip span {
	font-weight: 600;
}

html body.sp-produkt a.sp-p-razmeri__chip b {
	color: var(--sp-sivo);
	font-size: 13px;
	font-weight: 500;
	white-space: nowrap;
}

html body.sp-produkt a.sp-p-razmeri__chip:hover {
	border-color: var(--sp-marka);
}

html body.sp-produkt a.sp-p-razmeri__chip.is-tuk {
	padding: 5px 11px;
	border: 2px solid var(--sp-marka);
	background: var(--sp-marka-svetlo);
	color: var(--sp-marka) !important;
}

html body.sp-produkt a.sp-p-razmeri__chip.is-tuk b {
	color: var(--sp-marka);
}

html body.sp-produkt a.sp-p-razmeri__vsichki {
	align-self: flex-start;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: var(--sp-marka) !important;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none !important;
}

/* ---------- Долу: „Купуват го заедно с“ и „Още …“ — мрежи с „Покажи още“ (21 окт.) ---------- */

html body.sp-produkt .sp-p-svarzani {
	clear: both;
	padding-top: var(--sp-8);
	font-family: var(--sp-shrift);
}

html body.sp-produkt .sp-p-svarzani__glava {
	margin: 0 0 var(--sp-4);
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
}

html body.sp-produkt a.sp-p-svarzani__vrazka {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: var(--sp-marka) !important;
	font-family: var(--sp-shrift);
	font-size: 15px;
	line-height: 20px;
	font-weight: 700;
	white-space: nowrap;
	text-decoration: none;
}

html body.sp-produkt a.sp-p-svarzani__vrazka:hover {
	text-decoration: underline;
}

html body.sp-produkt a.sp-p-svarzani__vrazka svg {
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
}

html body.sp-produkt #main .sp-p-svarzani__zaglavie {
	margin: 0 !important;
	color: var(--sp-mastilo) !important;
	font-family: var(--sp-shrift) !important;
	font-size: 20px !important;
	line-height: 26px !important;
	font-weight: 700 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
}

html body.sp-produkt ul.products.sp-k-mreja.sp-p-svarzani__mreja {
	margin: 0 !important;
	padding: 0 !important;
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

html body.sp-produkt ul.sp-p-svarzani__mreja > li.sp-p-skrit {
	display: none !important;
}

html body.sp-produkt .sp-p-svarzani__dolu {
	margin-top: 20px;
	display: flex;
	justify-content: center;
}

html body.sp-produkt button.sp-p-svarzani__oshte {
	height: 48px;
	margin: 0;
	padding: 0 28px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	border: 1px solid var(--sp-marka);
	border-radius: var(--sp-ugal);
	background: var(--sp-byalo);
	box-shadow: none;
	color: var(--sp-marka);
	font-family: var(--sp-shrift);
	font-size: 16px;
	line-height: 20px;
	font-weight: 700;
	text-transform: none;
	letter-spacing: 0;
	cursor: pointer;
}

html body.sp-produkt button.sp-p-svarzani__oshte:hover {
	background: var(--sp-marka-svetlo);
}

html body.sp-produkt button.sp-p-svarzani__oshte[hidden] {
	display: none;
}

html body.sp-produkt button.sp-p-svarzani__oshte svg {
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
}

@media (max-width: 1023px) {
	html body.sp-produkt .sp-p-svarzani {
		padding-top: var(--sp-6);
	}

	html body.sp-produkt button.sp-p-svarzani__oshte {
		width: 100%;
	}
}

@media (min-width: 1024px) {
	html body.sp-produkt #main .sp-p-svarzani__zaglavie {
		font-size: 24px !important;
		line-height: 30px !important;
	}

	html body.sp-produkt ul.products.sp-k-mreja.sp-p-svarzani__mreja {
		grid-template-columns: repeat(5, minmax(0, 1fr));
		gap: 16px;
	}
}

@media (min-width: 1440px) {
	html body.sp-produkt ul.products.sp-k-mreja.sp-p-svarzani__mreja {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}
}

/* ---------- (старата лента, вече не се ползва тук) ---------- */

html body.sp-produkt .sp-lenta.sp-p-lenta {
	clear: both;
	padding-top: var(--sp-8);
}

html body.sp-produkt #main .sp-lenta.sp-p-lenta .sp-lenta__zaglavie {
	font-size: 20px !important;
	line-height: 26px !important;
	font-weight: 700 !important;
	letter-spacing: 0 !important;
}

@media (min-width: 1024px) {
	html body.sp-produkt #main .sp-lenta.sp-p-lenta .sp-lenta__zaglavie {
		font-size: 24px !important;
		line-height: 30px !important;
	}
}

@media (max-width: 1023px) {
	html body.sp-produkt .sp-lenta.sp-p-lenta {
		padding-top: var(--sp-6);
	}

	html body.sp-produkt .sp-p-razmeri__chipove {
		flex-wrap: nowrap;
		margin: 0 calc(-1 * var(--sp-4));
		padding: 0 var(--sp-4) 2px;
		overflow-x: auto;
		scrollbar-width: none;
	}

	html body.sp-produkt .sp-p-razmeri__chipove::-webkit-scrollbar {
		display: none;
	}

	html body.sp-produkt a.sp-p-razmeri__chip {
		flex-shrink: 0;
	}
}
/* „Други размери“ → „Брой“: отстъпът се нулираше от общото правило за блоковете в .summary
   (той, 21 окт.: „Брой“ лепне за бутоните). Надписите — еднакво удебелени. */
html body.sp-produkt .summary .sp-p-kupuvane > .sp-p-razmeri {
	margin-bottom: 20px !important;
}

html body.sp-produkt .sp-kol__etiket {
	font-weight: 600;
}