/* Stock scale — шкала наявності товару. id13.dev, 2026-07-16 (v2: помітніша)
   Окремий файл: у stylesheet.css теми є HTML-тег </style> і зайва "}",
   через що CSS-парсер ігнорує перше правило, дописане в кінець.
   ПРАВИШ ЦЕЙ ФАЙЛ — БАМПАЙ ?v= у header.twig (nginx max-age=10 років!). */

.product-thumb .stock-text,
.stock-text {
	margin: 12px 0 0 !important;
	padding: 0;
	font-size: 13px !important;
	line-height: 1.3 !important;
	color: #444 !important;
	text-align: center !important;
}

/* Шкала тягнеться по ширині картки (як на донорі ~76%), а не фіксовані 200px */
.product-thumb .stock-quantity,
.stock-quantity {
	position: relative;
	margin: 6px auto 12px;
	width: 80%;
	max-width: 280px;
	min-width: 140px;
	height: 12px;
	border-radius: 2px;
	overflow: hidden;
	background: linear-gradient(to left, rgba(0, 128, 0, 0.65), rgba(255, 205, 0, 0.65), rgba(220, 53, 69, 0.65));
}

.stock-quantity .instock {
	position: absolute;
	right: 0;
	max-width: 100%;
	height: 100%;
	background: #d5d5d5;
}

.stock-quantity .instock_section {
	position: relative;
	display: -webkit-flex;
	display: flex;
	height: 100%;
	margin: 0;
	padding: 0;
}

.stock-quantity li {
	width: 10%;
	height: 100%;
}

/* Розділювачі сегментів — ширші, щоб блоки читались як на донорі */
.stock-quantity li + li {
	border-left: 2px solid #fff;
}

/* Сторінка товару: у списку характеристик — по лівому краю */
.product-stock-scale {
	list-style: none;
}

.product-stock-scale .stock-text {
	text-align: left !important;
	margin: 8px 0 0 !important;
}

.product-stock-scale .stock-quantity {
	margin: 6px 0 0;
	width: 220px;
}

/* Порожнеча в картці: модуль «+/-» (DEV-OPENCART.COM) додає <br> одразу після
   кнопок кількості — 17px пустоти перед ADD TO CART. Раніше її затуляла шкала,
   що стояла вище. Ховаємо саме цей <br>, нічого іншого не чіпаємо. */
.product-thumb .wrap-plus-minus + br {
	display: none;
}

/* ПРИЧИНА, чому шкала ламала картки (скрол + з'їхала ціна):
   тема жорстко задає .product-thumb { height:570px; overflow:auto; display:flex }
   (stylesheet.css:909, коментар «Одинакова висота для карток товару»).
   570px вистачало рівно до появи шкали — вона додає ~60px:
   текст(17) + margin(12) + смужка(12) + margins(18).
   Наслідок: контент > 570 → overflow:auto давав СКРОЛБАР у картці,
   а flex стискав .caption → ціна вилазила під кнопку.
   Лікуємо причину: даємо картці місце під шкалу.
   min-height зберігає вирівнювання карток, height:auto не дає з'явитись скролу
   на товарах із довгим описом. */
.product-thumb {
	height: auto !important;
	min-height: 630px;
	overflow: visible !important;
}