/*
Theme Name:   Online Shop — 3D&CNC
Theme URI:    https://3d-cnc.pro/
Description:  Дочірня тема для Online Shop з усіма власними доробками сайту 3d-cnc.pro. Батьківську тему можна оновлювати — правки зберігаються тут.
Template:     online-shop
Version:      1.9.3
Text Domain:  online-shop-child
*/

/* =====================================================================
   ЗМІСТ
   1. Каркас: ширина сайту і колонки
   2. Шапка
   3. Каталог: сітка товарів, кнопки, пагінація
   4. Мобільні фільтри
   5. Дерево категорій на головній (бокове меню)
   6. Сторінка товару
   7. Кошик, міні-кошик, оформлення замовлення
   8. Оновлений дизайн (2026): картки, шапка, товар, мобільна версія, футер, фільтри, міні-кошик, сітка 6/3/2

   Межі екранів, які використовуються:
     ≤ 768px          — телефон (власні правила сайту)
     ≥ 769px          — планшет / комп'ютер
     1230–1439px      — ноутбук
     ≥ 1440px         — великий екран
   Тема Online Shop має свої межі (767 / 992 / 1229px) — у розділі 1
   вони повторені свідомо, щоб зберегти правильний порядок правил.

   Сюди перенесено: правки зі style.css теми, «Додатковий CSS»,
   SiteOrigin CSS і стилі, що були вписані в PHP-файли.
   Новий CSS додавайте сюди, у потрібний розділ — не в «Додатковий CSS»
   і не в SiteOrigin CSS.
   ===================================================================== */


/* =====================================================================
   1. КАРКАС: ШИРИНА САЙТУ І КОЛОНКИ
   ===================================================================== */

/* --- Ширина сайту (.wrapper) ---
   Порядок важливий: базове значення → менші екрани → більші екрани.
   Правила для 1229/992/767px повторюють тему, бо наш базовий
   .wrapper завантажується пізніше і інакше перекрив би їх. */
.wrapper {
	width: 1440px;
}

@media (max-width: 1229px) {
	.wrapper {
		width: 100%;
		max-width: 100%;
		padding: 0 15px;
	}
}

@media screen and (max-width: 992px) {
	.wrapper {
		padding: 0 5px;
		width: 96%;
	}
}

@media screen and (max-width: 767px) {
	.wrapper {
		width: 96%;
	}
}

/* Ноутбуки: ширина сторінки і шапки однакова */
@media screen and (min-width: 1230px) and (max-width: 1439px) {
	.wrapper {
		width: calc(100% - 30px);
		max-width: 1440px;
		margin-left: auto;
		margin-right: auto;
		box-sizing: border-box;
	}
}

/* Великі екрани */
@media screen and (min-width: 1440px) {
	.wrapper {
		width: 94%;
		max-width: 1920px;
		margin-left: auto;
		margin-right: auto;
		box-sizing: border-box;
	}
}

/* --- Колонки: контент і сайдбар --- */
#primary {
	width: 80%;
}

.secondary-sidebar {
	width: 19%;
}

/* Повтор мобільного правила теми (див. примітку про порядок вище) */
@media screen and (max-width: 767px) {
	#primary,
	.both-sidebar #primary,
	.both-sidebar #primary-wrap #primary,
	.middle-col #primary,
	.right-sidebar #primary,
	.left-sidebar #primary {
		margin: 0 0 20px;
		width: 100%;
	}

	.secondary-sidebar,
	.both-sidebar #primary-wrap,
	.both-sidebar #primary-wrap #secondary-left,
	.both-sidebar #secondary-right,
	.middle-col .secondary-sidebar,
	.right-sidebar .secondary-sidebar,
	.left-sidebar .secondary-sidebar,
	.no-sidebar .secondary-sidebar {
		clear: both;
		float: none;
		margin: 0 0 20px;
		width: 100%;
	}
}

/* Лівий сайдбар з деревом категорій: фіксована ширина,
   щоб дерево не ламалось на 1024–1400px */
@media (max-width: 1400px) {
	.left-sidebar .secondary-sidebar {
		width: 260px !important;
	}

	.left-sidebar #primary {
		width: calc(100% - 260px) !important;
	}
}

/* Телефон: лівий сайдбар ховаємо повністю */
@media (max-width: 768px) {
	.left-sidebar .secondary-sidebar,
	#secondary-left {
		display: none !important;
	}

	.left-sidebar #primary {
		width: 100% !important;
		float: none !important;
	}
}


/* =====================================================================
   2. ШАПКА
   ===================================================================== */

/* --- Логотип, відступи шапки, хлібні крихти
   (перенесено з «Вигляд → Налаштувати → Додатковий CSS») --- */
.site-logo {
	width: 290px;
	height: 80px;
}

#woocommerce-product-search-field-0 {
	height: 22px;
}

@media screen and (max-width: 767px) {
	.header-wrapper {
		padding: 8px 0;
	}

	.breadcrumbs.clearfix {
		display: none;
	}

	#online-shop-breadcrumbs > nav {
		margin: 0;
	}

	.widget_product_search {
		margin-bottom: 8px;
	}

	#masthead > div > div.wrapper > div.center-wrapper-mx-width {
		margin-bottom: 8px;
	}

	#woocommerce_product_search-3 > form {
		padding: 4px;
	}

	#masthead > div > div.wrapper > div.site-logo > a {
		padding: 0;
		margin: 0;
	}

	#masthead > div > div.wrapper {
		padding-bottom: 8px;
	}
}

@media screen and (min-width: 768px) {
	.header-wrapper {
		padding: 8px 0;
	}

	#content > div.breadcrumbs.clearfix {
		padding: 0;
		margin: 2px 0;
	}

	#online-shop-breadcrumbs > nav {
		margin: 0;
	}

	.widget_product_search {
		margin-bottom: 8px;
	}

	#masthead > div > div.wrapper > div.center-wrapper-mx-width {
		margin-bottom: 8px;
	}

	#woocommerce_product_search-3 > form {
		padding: 4px;
	}

	#masthead > div > div.wrapper > div.site-logo > a {
		padding: 0;
		margin: 0;
	}
}

/* --- Блоки шапки (перенесено з SiteOrigin CSS) --- */

/* Блок пошуку + кошик.
   height: 100px діяв і раніше (з правки у style.css теми) — залишено,
   щоб шапка не змінилась. Якщо хочете нижчу шапку — приберіть цей рядок,
   тоді спрацює min-height. */
.header-ads-adv-search {
	width: 100%;
	max-width: 1000px;
	height: 100px;
	min-height: 60px;
	display: flex;
	align-items: center;
	justify-content: space-evenly;
}

.header-wrapper .center-wrapper-mx-width {
	padding-top: 0;
	width: auto;
}

.navigation-wrapper {
	padding-top: 2px;
}

.textwidget p {
	margin: 0 4px;
}

/* Поле пошуку і кнопка */
.search-field {
	border-radius: 10px;
	border-width: 1px;
	text-align: center;
}

#woocommerce_product_search-3 > form > button {
	border-radius: 10px;
	border-width: 1px;
}

/* Ноутбуки: пошук не ширше 61% */
@media screen and (min-width: 1230px) and (max-width: 1439px) {
	#masthead .header-ads-adv-search {
		max-width: 61%;
	}
}

/* Телефон: компактна шапка (пошук і кошик в один рядок) */
@media (max-width: 768px) {
	.center-wrapper-mx-width {
		display: grid !important;
		grid-template-columns: 1fr auto;
		align-items: center;
		column-gap: 12px;
	}

	.header-ads-adv-search {
		grid-column: 1;
		grid-row: 1;
		margin: 0 !important;
	}

	.cart-section {
		grid-column: 2;
		grid-row: 1;
		margin: 0 !important;
		justify-self: center;
		align-self: start;
	}

	#text-6 {
		margin: 0 !important;
		text-align: center;
	}

	#block-17 {
		grid-column: 1 / -1;
		grid-row: 2;
		width: 100% !important;
		margin-top: 8px;
	}

	#masthead > .header-wrapper > .wrapper {
		padding-bottom: 34px;
	}

	.site-logo {
		width: 100%;
		text-align: center;
		margin: 0 auto;
	}

	.site-logo img {
		margin: 0 auto;
		display: block;
	}
}


/* =====================================================================
   3. КАТАЛОГ: СІТКА ТОВАРІВ, КНОПКИ, ПАГІНАЦІЯ
   ===================================================================== */

/* Приховані елементи архіву */
.woocommerce-products-header__title.page-title {
	display: none;
}

.woocommerce .woocommerce-result-count {
	display: none;
}

.woocommerce .woocommerce-ordering select {
	display: none;
}

/* Таблиці в описах категорій */
.wp-block-table {
	margin: 0;
}

#block-35.widget {
	margin: 0;
}

/* Картки однакової висоти, кнопка — внизу */
.woocommerce ul.products {
	display: flex;
	flex-wrap: wrap;
}

.woocommerce ul.products li.product {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

/* Кнопка «Додати в кошик» */
.woocommerce a.button.add_to_cart_button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	width: 95%;
	max-width: 100%;
	margin: 0 auto;
	box-sizing: border-box;
	padding: 10px 14px;
	border-radius: 10px;
	white-space: normal;   /* дозволяє перенос тексту */
	text-align: center;
	line-height: 1.3;
}

/* Іконка кошика — у потоці поруч із текстом */
.woocommerce a.button.add_to_cart_button::after {
	position: static !important;
	display: inline-block;
	margin: 0;
	transform: none !important;
}

/* Кнопка у товару без наявності */
li.product.outofstock .button {
	border-radius: 10px;
	margin: 0 auto;
	width: 95%;
	padding: 10px 14px;
}

/* «Повідомити про наявність»: ховаємо «Читати далі», якщо є кнопка підписки */
.woocommerce ul.products li.product.outofstock:has(.cwg_popup_submit) a.button.product_type_simple {
	display: none !important;
}

/* Телефон: 2 товари в ряд, компактна пагінація */
@media (max-width: 768px) {
	#block-35 > div {
		gap: 12px;
	}

	.woocommerce ul.products.columns-4::before,
	.woocommerce ul.products.columns-4::after {
		content: none !important;
		display: none !important;
	}

	.woocommerce ul.products.columns-4 {
		display: flex !important;
		flex-wrap: wrap !important;
		gap: 6px !important;
	}

	.woocommerce ul.products.columns-4 li.product,
	.woocommerce-page ul.products.columns-4 li.product {
		flex: 0 0 calc((100% - 6px) / 2) !important;
		width: calc((100% - 6px) / 2) !important;
		max-width: calc((100% - 6px) / 2) !important;
		float: none !important;
		clear: none !important;
		margin: 0 !important;
		box-sizing: border-box !important;
		outline: 1px solid #e9e9e9;
	}

	/* Пагінація: ←, 1–5, …, остання, → */
	.woocommerce .page-numbers {
		display: flex !important;
		flex-wrap: wrap !important;
		justify-content: center !important;
		gap: 3px !important;
		padding: 0 !important;
		margin: 0 auto !important;
		white-space: normal !important;
	}

	.woocommerce .page-numbers li {
		display: none !important;
	}

	.woocommerce .page-numbers li:first-child,
	.woocommerce .page-numbers li:nth-child(2),
	.woocommerce .page-numbers li:nth-child(3),
	.woocommerce .page-numbers li:nth-child(4),
	.woocommerce .page-numbers li:nth-child(5),
	.woocommerce .page-numbers li:nth-child(6),
	.woocommerce .page-numbers li:has(.dots),
	.woocommerce .page-numbers li:nth-last-child(2),
	.woocommerce .page-numbers li:last-child {
		display: block !important;
	}

	.woocommerce nav.woocommerce-pagination ul.page-numbers {
		border-right: 1px solid #cfc8d8 !important;
	}
}


/* =====================================================================
   4. МОБІЛЬНІ ФІЛЬТРИ (кнопки «Фільтри» / «Скинути» і бічна панель)
   ===================================================================== */

.mobile-filters-bar {
	display: none;
	justify-content: space-between;
	gap: 10px;
	margin-bottom: 12px;
}

.mobile-filters-toggle,
.mobile-reset-btn {
	flex: 1;
	background: #0073aa;
	color: #fff;
	padding: 10px 14px;
	border: none;
	border-radius: 4px;
	font-weight: 600;
	cursor: pointer;
}

.mobile-reset-btn {
	background: #888;
}

.mobile-filters-panel {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.5);
	display: none;
	z-index: 9999;
	justify-content: flex-end;
}

.mobile-filters-panel.active {
	display: flex;
}

.mobile-filters-content {
	background: #fff;
	width: 66.66%; /* 2/3 ширини */
	height: 100%;
	overflow-y: auto;
	padding: 20px;
	position: relative;
	border-radius: 8px 0 0 8px;
}

.close-filters {
	background: none;
	border: none;
	font-size: 24px;
	position: absolute;
	top: 10px;
	right: 15px;
	cursor: pointer;
}

.mobile-filters-actions {
	margin-top: 20px;
	text-align: center;
}

.apply-filters-btn {
	background: #0073aa;
	color: #fff;
	border: none;
	padding: 12px 20px;
	border-radius: 4px;
	font-weight: 600;
	cursor: pointer;
	width: 100%;
}

@media (max-width: 768px) {
	.mobile-filters-bar {
		display: flex;
	}

	/* Форма фільтрів унизу сторінки — схована, всередині панелі — видима */
	#filters-form {
		display: none !important;
	}

	#mobile-filters-panel #filters-form {
		display: block !important;
	}
}

@media (min-width: 769px) {
	.mobile-filters-bar {
		display: none !important;
	}
}


/* =====================================================================
   5. ДЕРЕВО КАТЕГОРІЙ НА ГОЛОВНІЙ (бокове меню, меню WordPress №115)
   Розмітка і скрипт — у sidebar-left.php. Лише на комп'ютері.
   ===================================================================== */

/* Панель */
#cnc-hct-panel,
#cnc-hct-panel * {
	box-sizing: border-box;
}

#cnc-hct-panel {
	width: 100%;
	max-width: 260px;
	background: #fff;
	border: 1px solid #e8eaed;
	border-radius: 10px;
	padding: 6px 0;
	margin: 0;
	box-shadow: 0 2px 10px rgba(0,0,0,.035);
}

/* Структура меню */
#cnc-hct-panel .home-category-tree,
#cnc-hct-panel .home-category-tree ul {
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none !important;
	background: transparent;
	border: none;
}

#cnc-hct-panel .home-category-tree li {
	position: relative;
	list-style: none !important;
	padding: 0 !important;
	margin: 0 !important;
	border: 0;
	background: transparent;
}

#cnc-hct-panel .home-category-tree li::before {
	display: none !important;
}

/* Рядок категорії */
#cnc-hct-panel .hct-row {
	display: flex;
	align-items: center;
	min-height: 43px;
	margin: 2px 7px;
	border-radius: 8px;
	background: transparent;
	transition: background .18s ease;
}

#cnc-hct-panel .hct-row:hover {
	background: #fff0f1;
}

/* Посилання */
#cnc-hct-panel .hct-link {
	display: flex !important;
	align-items: center;
	flex: 1;
	min-width: 0;
	gap: 9px;
	padding: 7px 4px 7px 9px !important;
	margin: 0 !important;
	color: #383d44 !important;
	font-size: 13px;
	line-height: 1.4;
	font-weight: 400;
	text-decoration: none !important;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	white-space: normal;
}

#cnc-hct-panel .hct-link:hover {
	color: #d52c35 !important;
}

#cnc-hct-panel .hct-name {
	flex: 1;
	min-width: 0;
	overflow-wrap: anywhere;
}

/* Іконки категорій */
#cnc-hct-panel .hct-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	flex: 0 0 30px;
	border-radius: 7px;
	background: #f1f2f4;
	color: #838a94;
	transition: background .18s, color .18s;
}

#cnc-hct-panel .hct-icon svg {
	display: block;
	width: 17px;
	height: 17px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* Кнопка розгортання */
#cnc-hct-panel .hct-toggle {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 31px;
	height: 36px;
	flex: 0 0 31px;
	margin: 0 3px 0 0;
	padding: 0;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	border-radius: 6px;
	color: #999fa7;
	cursor: pointer;
}

#cnc-hct-panel .hct-toggle:hover {
	color: #dd3333;
	background: #f2f2f2 !important;
}

#cnc-hct-panel .hct-toggle svg {
	width: 15px;
	height: 15px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
	transition: transform .2s ease;
}

#cnc-hct-panel li.is-open > .hct-row .hct-toggle svg {
	transform: rotate(90deg);
}

/* Активна або розгорнута категорія */
#cnc-hct-panel li.is-open > .hct-row,
#cnc-hct-panel li.current-menu-item > .hct-row,
#cnc-hct-panel li.current-menu-ancestor > .hct-row,
#cnc-hct-panel li.current-menu-parent > .hct-row {
	background: #fff0f1;
}

/* Червоний текст */
#cnc-hct-panel li.is-open > .hct-row .hct-link,
#cnc-hct-panel li.current-menu-item > .hct-row .hct-link,
#cnc-hct-panel li.current-menu-ancestor > .hct-row .hct-link,
#cnc-hct-panel li.current-menu-parent > .hct-row .hct-link {
	color: #c52832 !important;
	font-weight: 600;
}

/* Червона іконка */
#cnc-hct-panel li.is-open > .hct-row .hct-icon,
#cnc-hct-panel li.current-menu-item > .hct-row .hct-icon,
#cnc-hct-panel li.current-menu-ancestor > .hct-row .hct-icon,
#cnc-hct-panel li.current-menu-parent > .hct-row .hct-icon {
	background: #fbdfe2;
	color: #d52c35;
}

/* Підменю */
#cnc-hct-panel .home-category-tree ul.sub-menu {
	display: none !important;
	position: static !important;
	float: none !important;
	width: auto !important;
	min-width: 0 !important;
	max-width: 100%;
	height: auto !important;
	visibility: visible !important;
	opacity: 1 !important;
	transform: none !important;
	box-shadow: none !important;
	background: transparent;
	border: 0;
	margin: 0;
	padding: 2px 0 5px;
}

#cnc-hct-panel .home-category-tree li.is-open > ul.sub-menu {
	display: block !important;
}

/* Вкладені елементи */
#cnc-hct-panel .sub-menu .hct-row {
	min-height: 33px;
	margin: 1px 7px 1px 42px;
}

#cnc-hct-panel .sub-menu .hct-link {
	font-size: 12.5px;
	color: #69717a !important;
	padding: 6px 3px 6px 9px !important;
}

#cnc-hct-panel .sub-menu .hct-link::before {
	content: "";
	display: inline-block;
	width: 5px;
	height: 5px;
	flex: 0 0 5px;
	background: #cbd0d6;
	border-radius: 50%;
}

#cnc-hct-panel .sub-menu .sub-menu .hct-row {
	margin-left: 54px;
}

#cnc-hct-panel .sub-menu .sub-menu .sub-menu .hct-row {
	margin-left: 64px;
}

#cnc-hct-panel .sub-menu li.current-menu-item > .hct-row .hct-link {
	color: #c52832 !important;
}

/* Доступність */
#cnc-hct-panel a:focus-visible,
#cnc-hct-panel button:focus-visible {
	outline: 2px solid #dd3333 !important;
	outline-offset: 2px;
}

/* SVG закладної Т-гайки */
#cnc-hct-panel .hct-icon img {
	display: block;
	width: 28px;
	height: 28px;
	object-fit: contain;
}

@media (prefers-reduced-motion: reduce) {
	#cnc-hct-panel *,
	#cnc-hct-panel *::before,
	#cnc-hct-panel *::after {
		transition: none !important;
	}
}

/* На мобільних не показуємо */
@media (max-width: 768px) {
	#cnc-hct-panel {
		display: none !important;
	}
}


/* =====================================================================
   6. СТОРІНКА ТОВАРУ
   ===================================================================== */

/* Галерея: не ширше 400px, квадратна (без «стрибка» при завантаженні) */
.single-product .woocommerce-product-gallery {
	max-width: 400px !important;
	margin: 0 auto !important;
	aspect-ratio: 1 / 1;
}

.single-product .woocommerce-product-gallery .flex-viewport {
	overflow: hidden; /* приховує частини сусідніх слайдів */
}

.single-product .woocommerce-product-gallery__image img {
	width: 100%;
	height: auto;
	object-fit: contain;
	display: block;
}

/* Up-sells — 4 товари в ряд на комп'ютері */
@media (min-width: 769px) {
	.single-product .up-sells ul.products.columns-4 li.product {
		width: 22.05% !important;
		max-width: 22.05% !important;
		flex: 0 0 22.05% !important;
	}
}

/* Рівно 768px (iPad вертикально): права колонка під товаром */
@media screen and (width: 768px) {
	.single-product.right-sidebar #primary,
	.single-product.right-sidebar .secondary-sidebar {
		width: 100%;
		float: none;
		clear: both;
	}

	.single-product.right-sidebar .secondary-sidebar {
		margin-top: 20px;
	}
}


/* =====================================================================
   7. КОШИК, МІНІ-КОШИК, ОФОРМЛЕННЯ ЗАМОВЛЕННЯ
   ===================================================================== */

/* --- Кошик --- */
.woocommerce-cart .cart-collaterals .cart_totals .woocommerce-shipping-destination {
	visibility: hidden;
}

.woocommerce-shipping-calculator {
	display: none;
}

/* Телефон: спочатку підсумок, потім «Супутні товари» */
@media (max-width: 768px) {
	.woocommerce-cart .cart-collaterals {
		display: flex;
		flex-direction: column;
	}

	.woocommerce-cart .cart-collaterals .cart_totals {
		order: 1;
	}

	.woocommerce-cart .cart-collaterals .cross-sells {
		order: 2;
	}
}

/* --- Міні-кошик: кнопки одна під одною на всю ширину --- */
@media screen and (min-width: 768px) {
	.single-product .secondary-sidebar .widget_shopping_cart .buttons {
		display: flex;
		flex-direction: column;
		gap: 8px;
	}

	.single-product .secondary-sidebar .widget_shopping_cart .buttons a.button {
		width: 100%;
		margin: 0;
		box-sizing: border-box;
		padding: 10px;
		text-align: center;
		white-space: normal;
		word-break: normal;
		overflow-wrap: normal;
	}
}

.woocommerce-mini-cart__buttons {
	display: flex !important;
	flex-direction: column !important;
	gap: 8px !important;
}

.woocommerce-mini-cart__buttons .button {
	display: block !important;
	width: 100% !important;
	box-sizing: border-box !important;
	margin: 0 !important;
	text-align: center !important;
}

/* --- Оформлення замовлення --- */

/* Країна завжди Україна — поле приховане (логіка — inc/checkout.php) */
body.woocommerce-checkout #billing_country_field,
body.woocommerce-checkout #shipping_country_field {
	display: none !important;
}

/* Способи оплати: групи «Фізичні / Юридичні особи», акордеон описів,
   неактивна безготівкова оплата до 300 грн (скрипти — inc/payments.php,
   inc/checkout.php) */
.custom-payment-main-title-outside {
	margin: 0 0 14px;
	font-size: 22px;
	font-weight: 700;
	color: #222;
	line-height: 1.25;
}

#payment .custom-payment-group-title {
	list-style: none;
	margin: 18px 0 10px;
	padding: 0;
	font-size: 18px;
	font-weight: 700;
	color: #222;
}

#payment .custom-payment-group-box {
	list-style: none;
	margin: 0 0 18px;
	padding: 14px 16px;
	background: #f8f8fb;
	border: 1px solid #e6e6ee;
	border-radius: 10px;
}

#payment .custom-payment-sublist {
	margin: 0;
	padding: 0;
	list-style: none;
}

#payment .custom-payment-sublist > li.wc_payment_method {
	list-style: none;
	margin: 0;
	padding: 14px 0;
	border-bottom: 1px solid #ececf3;
	position: relative;
}

#payment .custom-payment-sublist > li.wc_payment_method:last-child {
	border-bottom: 0;
	padding-bottom: 0;
}

#payment .custom-payment-sublist > li.wc_payment_method:first-child {
	padding-top: 0;
}

#payment li.wc_payment_method.custom-accordion-ready {
	position: relative;
	display: grid;
	grid-template-columns: 22px minmax(0, 1fr) 24px;
	column-gap: 10px;
	align-items: start;
	min-height: 24px;
	padding-left: 0;
}

#payment li.wc_payment_method.custom-accordion-ready > input[type="radio"] {
	grid-column: 1;
	grid-row: 1;
	position: static;
	margin: 4px 0 0 0;
	align-self: start;
}

#payment li.wc_payment_method.custom-accordion-ready > label {
	grid-column: 2;
	grid-row: 1;
	display: block;
	margin: 0;
	padding: 0;
	cursor: pointer;
	font-weight: 600;
	line-height: 1.45;
	word-break: break-word;
	box-sizing: border-box;
	min-width: 0;
}

#payment .accordion-toggle {
	grid-column: 3;
	grid-row: 1;
	position: static;
	width: 24px;
	height: 24px;
	padding: 0;
	margin: 0;
	border: 0;
	background: transparent;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	box-shadow: none;
	z-index: 5;
	align-self: start;
}

#payment .accordion-toggle:hover,
#payment .accordion-toggle:focus,
#payment .accordion-toggle:active {
	background: transparent;
	outline: none;
	box-shadow: none;
}

#payment .accordion-arrow {
	width: 10px;
	height: 10px;
	border-right: 2px solid #666;
	border-bottom: 2px solid #666;
	transform: rotate(45deg);
	transition: transform .2s ease;
	display: inline-block;
	pointer-events: none;
}

#payment li.wc_payment_method.custom-accordion-ready.is-open > .accordion-toggle .accordion-arrow {
	transform: rotate(-135deg);
}

#payment li.wc_payment_method.custom-accordion-ready > .payment_box {
	display: none;
	grid-column: 1 / -1;
	margin-top: 12px;
	margin-left: 0;
	padding: 14px 16px;
	background: #f3f1f7;
	border-radius: 8px;
	border: 1px solid #e4deef;
	width: 100%;
	box-sizing: border-box;
	clear: both;
}

#payment li.cheque-disabled {
	opacity: 0.65;
}

#payment li.cheque-disabled label,
#payment li.cheque-disabled input[type="radio"],
#payment li.cheque-disabled .accordion-toggle {
	cursor: not-allowed;
}

#payment .cheque-info-box {
	display: block !important;
	margin-top: 10px;
	margin-left: 0;
	width: 100%;
	box-sizing: border-box;
	padding: 10px 12px;
	background: #fff3f3;
	border-left: 3px solid #e53935;
	border-radius: 4px;
	font-size: 13px;
	line-height: 1.45;
	color: #b71c1c;
	grid-column: 1 / -1;
}

@media (max-width: 767px) {
	.custom-payment-main-title-outside {
		font-size: 20px;
		margin-bottom: 12px;
	}

	#payment .custom-payment-group-title {
		font-size: 16px;
	}

	#payment .custom-payment-group-box {
		padding: 12px;
	}

	#payment .custom-payment-sublist > li.wc_payment_method {
		padding: 12px 0;
	}

	#payment li.wc_payment_method.custom-accordion-ready {
		grid-template-columns: 20px minmax(0, 1fr) 22px;
		column-gap: 8px;
	}

	#payment li.wc_payment_method.custom-accordion-ready > input[type="radio"] {
		margin-top: 3px;
	}

	#payment li.wc_payment_method.custom-accordion-ready > label {
		line-height: 1.45;
	}

	#payment .accordion-toggle {
		width: 22px;
		height: 22px;
	}

	#payment li.wc_payment_method.custom-accordion-ready > .payment_box,
	#payment .cheque-info-box {
		margin-left: 0;
		width: 100%;
		padding-left: 14px;
		padding-right: 14px;
	}
}


/* =====================================================================
   8. ОНОВЛЕНИЙ ДИЗАЙН (2026)
   Поверх усього вище. Щоб тимчасово повернути старий вигляд —
   закоментуйте цей розділ цілком.
   ===================================================================== */

:root {
	--cnc-red: #dd3333;
	--cnc-red-dark: #c42a2a;
	--cnc-red-soft: #fdeeee;
	--cnc-ink: #1f2328;
	--cnc-text: #3b4148;
	--cnc-muted: #6b7380;
	--cnc-line: #e7e9ee;
	--cnc-bg: #f6f7f9;
	--cnc-green: #1f8a4c;
	--cnc-green-soft: #e9f6ee;
	--cnc-radius: 12px;
	--cnc-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 1px 3px rgba(16, 24, 40, .06);
	--cnc-shadow-hover: 0 8px 24px rgba(16, 24, 40, .10);
}

/* ---------- 8.1 Загальне: шрифти, фон ---------- */
body {
	color: var(--cnc-text);
	background: var(--cnc-bg);
}

#page,
.site-content {
	background: transparent;
}

/* Заголовки товарів/сторінок — без вузького Oswald, сучасніший гротеск */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.single-product .product_title,
.woocommerce-tabs ul.tabs li a,
.related.products > h2,
.up-sells > h2 {
	font-family: "Open Sans", sans-serif !important;
	letter-spacing: 0;
}

/* ---------- 8.2 Шапка і меню ---------- */
.site-header .header-wrapper {
	background: #fff;
	border-bottom: 1px solid var(--cnc-line);
}

/* Контакти в шапці: акуратний блок */
#text-6 .textwidget p {
	line-height: 1.5;
	font-size: 13px;
	color: var(--cnc-muted);
}

#text-6 .textwidget a,
#text-6 .textwidget a strong {
	color: var(--cnc-ink) !important;
	text-decoration: none !important;
}

#text-6 .textwidget a[href^="tel"] strong {
	font-size: 17px;
	font-weight: 700;
}

/* Кошик у шапці */
.wc-cart-wrapper {
	border-radius: 10px;
}

/* Смуга меню */
.header-wrapper #site-navigation {
	background: #fff;
	border-top: 0;
	border-bottom: 1px solid var(--cnc-line);
	box-shadow: none;
}

.header-wrapper .menu li a {
	font-family: "Open Sans", sans-serif;
	font-weight: 600;
	font-size: 14px;
	letter-spacing: .2px;
	text-transform: none;
	color: var(--cnc-ink);
}

/* Кнопка «Каталог» */
.special-menu {
	background: var(--cnc-red) !important;
	border-radius: 10px 10px 0 0;
}

.main-navigation ul.special-menu-wrapper > li > a.special-menu {
	color: #fff;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .5px;
}

/* Випадаючий каталог */
.main-navigation ul.special-menu-wrapper ul.special-sub-menu {
	border-radius: 0 0 var(--cnc-radius) var(--cnc-radius);
	box-shadow: var(--cnc-shadow-hover);
	border: 1px solid var(--cnc-line);
	border-top: 0;
}

.header-wrapper .main-navigation ul.special-sub-menu li a {
	font-weight: 500;
	text-transform: none;
	font-size: 14px;
}

.header-wrapper .main-navigation ul.special-sub-menu li:hover > a {
	color: var(--cnc-red);
	background: var(--cnc-red-soft);
}

/* Хлібні крихти */
.breadcrumbs.clearfix {
	background: transparent;
}

#online-shop-breadcrumbs .woocommerce-breadcrumb {
	font-size: 13px;
	color: var(--cnc-muted);
}

/* ---------- 8.3 Картки товарів ---------- */

/* Сітка: кількість колонок підлаштовується під ширину
   (картка не вужча за 190px), замість фіксованих 6 в ряд */
html body.woocommerce ul.products[class*="columns-"],
html body .woocommerce ul.products[class*="columns-"] {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
	gap: 16px !important;
	margin: 0 0 24px;
}

html body.woocommerce ul.products[class*="columns-"]::before,
html body.woocommerce ul.products[class*="columns-"]::after,
html body .woocommerce ul.products[class*="columns-"]::before,
html body .woocommerce ul.products[class*="columns-"]::after {
	display: none !important;
}

html body.woocommerce ul.products[class*="columns-"] li.product.type-product,
html body .woocommerce ul.products[class*="columns-"] li.product.type-product {
	width: auto !important;
	max-width: none !important;
	flex: none !important;
	float: none !important;
	margin: 0 !important;
}

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
	background: #fff;
	border: 1px solid var(--cnc-line);
	border-radius: var(--cnc-radius);
	box-shadow: var(--cnc-shadow);
	padding: 12px 12px 14px;
	text-align: left;
	transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
	overflow: hidden;
}

.woocommerce ul.products li.product:hover {
	box-shadow: var(--cnc-shadow-hover);
	border-color: #d9dce3;
	transform: translateY(-2px);
}

/* Фото: квадрат, на білому, з відступом */
.woocommerce ul.products li.product a img {
	aspect-ratio: 1 / 1;
	object-fit: contain;
	background: #fff;
	border-radius: 8px;
	margin: 0 0 10px;
	transition: transform .3s ease;
}

.woocommerce ul.products li.product:hover a img {
	transform: scale(1.03);
}

/* Назва: 2–3 рядки, далі «…» */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-size: 14px !important;
	font-weight: 600;
	line-height: 1.35;
	color: var(--cnc-ink);
	padding: 0 !important; /* відступ — через margin, щоб не визирав 4-й рядок */
	margin: 0 0 6px !important;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: calc(1.35em * 3);
}

.woocommerce ul.products li.product .star-rating {
	font-size: 11px;
	margin: 0 0 6px;
}

/* Наявність — як на сторінці товару: кольорова крапка + текст */
.woocommerce ul.products li.product p.stock {
	display: inline-flex;
	align-items: flex-start;
	gap: 5px;
	margin: 0;
	padding: 0;
	background: none;
	font-size: 13px !important;
	font-weight: 600 !important;
	line-height: 1.3;
	/* колір НЕ задаємо: його ставить сам сайт (зелений / червоний) */
}

.woocommerce ul.products li.product p.stock::before {
	content: "";
	width: 6px;
	height: 6px;
	flex: 0 0 6px;
	margin-top: .45em; /* крапка на рівні першого рядка */
	border-radius: 50%;
	background: currentColor;
}

/* Ціна — головне на картці */
.woocommerce ul.products li.product .price {
	display: block;
	margin: 0 0 12px;
	font-size: 20px !important;
	font-weight: 800 !important;
	color: var(--cnc-ink) !important;
}

.woocommerce ul.products li.product .price .amount,
.woocommerce ul.products li.product .price ins .amount {
	color: var(--cnc-ink) !important;
}

/* Кнопка */
.woocommerce ul.products li.product a.button {
	width: 100% !important;
	margin: 0 !important;
	padding: 11px 12px !important;
	border-radius: 10px !important;
	font-size: 14px;
	font-weight: 700;
	background: var(--cnc-red);
	color: #fff;
	transition: background .2s ease;
}

.woocommerce ul.products li.product a.button:hover {
	background: var(--cnc-red-dark);
	color: #fff;
}

/* Немає в наявності — кнопка-контур */
.woocommerce ul.products li.product.outofstock a.button,
.woocommerce ul.products li.product.outofstock .cwg_popup_submit {
	background: #fff !important;
	color: var(--cnc-red) !important;
	border: 1.5px solid var(--cnc-red) !important;
}

.woocommerce ul.products li.product.outofstock .cwg_popup_submit {
	width: 100%;
	border-radius: 10px;
	padding: 10px 12px;
	font-weight: 700;
}

/* Пагінація */
.woocommerce nav.woocommerce-pagination ul {
	border: 0;
}

.woocommerce nav.woocommerce-pagination ul li {
	border: 0;
	margin: 0 3px;
}

.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
	border-radius: 8px;
	border: 1px solid var(--cnc-line);
	background: #fff;
	min-width: 40px;
}

/* ---------- 8.4 Сторінка товару ---------- */
.single-product div.product {
	background: #fff;
	border: 1px solid var(--cnc-line);
	border-radius: var(--cnc-radius);
	padding: 24px;
	box-shadow: var(--cnc-shadow);
}

.single-product .woocommerce-product-gallery__image img,
.single-product .flex-control-thumbs img {
	border-radius: 8px;
}

.single-product .flex-control-thumbs li img {
	border: 1px solid var(--cnc-line);
	opacity: .7;
}

.single-product .flex-control-thumbs li img.flex-active,
.single-product .flex-control-thumbs li img:hover {
	opacity: 1;
	border-color: var(--cnc-red);
}

.single-product .product_title {
	font-size: 26px !important;
	font-weight: 700 !important;
	line-height: 1.25 !important;
	color: var(--cnc-ink);
	margin-bottom: 14px;
}

.single-product .summary .cnc-price-stock-row > .price,
.single-product .summary .cnc-price-stock-row > .price .amount {
	font-size: 30px !important;
	font-weight: 800 !important;
	color: var(--cnc-ink) !important;
}

/* Наявність на сторінці товару — без змін (стиль зі сніпета «Кількість поруч із ціною») */

/* Оптові ціни */
.single-product .tier-prices {
	max-width: 320px !important;
	border: 1px solid var(--cnc-line);
	border-radius: 10px;
	overflow: hidden;
	border-collapse: separate !important;
	border-spacing: 0;
	margin: 4px 0 18px !important;
}

.single-product .tier-prices td {
	padding: 8px 12px !important;
	font-size: 14px;
}

/* Перемикачі (Тип / Профіль / Різьблення) */
.dcnc-product-switcher__select {
	border: 1px solid var(--cnc-line) !important;
	border-radius: 10px !important;
	background-color: #fff !important;
	min-height: 42px;
	padding: 8px 12px !important;
	font-size: 14px;
}

/* Кількість + кнопка */
.single-product form.cart {
	border: 0 !important;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: stretch;
	padding: 6px 0 16px !important;
}

.single-product form.cart .quantity .qty {
	height: 50px !important;
	width: 90px;
	border-radius: 10px !important;
	border: 1px solid var(--cnc-line) !important;
	font-size: 16px;
	font-weight: 600;
}

.single-product form.cart .single_add_to_cart_button {
	height: 50px;
	flex: 1 1 200px;
	max-width: 320px;
	border-radius: 10px !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	background: var(--cnc-red) !important;
}

.single-product form.cart .single_add_to_cart_button:hover {
	background: var(--cnc-red-dark) !important;
	color: #fff !important;
}

.single-product .product_meta {
	border: 0 !important;
	font-size: 13px;
	color: var(--cnc-muted);
}

/* Вкладки: підкреслення замість червоних «плашок» */
.woocommerce div.product .woocommerce-tabs ul.tabs {
	border-bottom: 1px solid var(--cnc-line) !important;
	margin-bottom: 18px;
}

.woocommerce div.product .woocommerce-tabs ul.tabs::before {
	border: 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li,
.woocommerce div.product .woocommerce-tabs ul.tabs li:hover,
.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
	background: transparent !important;
	margin: 0 18px 0 0;
	padding: 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	color: var(--cnc-muted) !important;
	font-weight: 600;
	font-size: 15px;
	padding: 10px 0;
	border-bottom: 2px solid transparent;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a,
.woocommerce div.product .woocommerce-tabs ul.tabs li:hover a {
	color: var(--cnc-ink) !important;
	border-bottom-color: var(--cnc-red);
}

/* Сайдбар товару (види оплати, новини) — одна спільна картка */
.single-product #secondary-right #sidebar-section-top {
	background: #fff;
	border: 1px solid var(--cnc-line);
	border-radius: var(--cnc-radius);
	padding: 16px;
	box-shadow: var(--cnc-shadow);
}

/* ---------- 8.5 Мобільна версія ---------- */
@media (max-width: 768px) {
	body {
		font-size: 15px;
	}

	#text-6 {
		display: none;
	}

	.site-logo img {
		max-height: 48px;
		width: auto;
	}

	/* Картки рівно 2 в ряд, компактніше */
	html body.woocommerce ul.products[class*="columns-"],
	html body .woocommerce ul.products[class*="columns-"] {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 8px !important;
	}

	.woocommerce ul.products li.product,
	.woocommerce-page ul.products li.product {
		padding: 8px 8px 10px;
		outline: 0 !important;
	}

	.woocommerce ul.products li.product .woocommerce-loop-product__title {
		font-size: 13px !important;
	}

	.woocommerce ul.products li.product .price {
		font-size: 17px !important;
		margin-bottom: 8px;
	}

	.woocommerce ul.products li.product a.button {
		padding: 10px 6px !important;
		font-size: 13px;
	}

	.woocommerce ul.products li.product:hover {
		transform: none;
	}

	/* Товар */
	.single-product div.product {
		padding: 14px;
		border-radius: 0;
		border-left: 0;
		border-right: 0;
	}

	.single-product .product_title {
		font-size: 21px !important;
	}

	.single-product .summary .cnc-price-stock-row > .price,
	.single-product .summary .cnc-price-stock-row > .price .amount {
		font-size: 26px !important;
	}

	.single-product form.cart .single_add_to_cart_button {
		max-width: none;
	}
}

/* ---------- 8.6 Правки за відгуком ---------- */

/* Кнопка «Каталог» такої самої ширини, як бокове дерево (260px),
   пункти головного меню — по центру решти смуги */
@media screen and (min-width: 993px) {
	.main-navigation ul.special-menu-wrapper > li,
	.special-menu,
	.special-sub-menu,
	.main-navigation ul.special-menu-wrapper ul.special-sub-menu,
	.main-navigation ul.special-menu-wrapper ul.special-sub-menu a {
		width: 260px;
	}

	.online-shop-enable-special-menu .acmethemes-nav {
		width: calc(100% - 290px);
	}

	.acmethemes-nav ul.menu {
		display: flex;
		justify-content: center;
		float: none;
		margin-left: 0;
	}
}

/* Картка: зірки по центру; ціна і наявність в одному рядку,
   наявність — двома рядками заввишки з ціну */
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	column-gap: 6px;
}

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > img,
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > .woocommerce-loop-product__title {
	flex: 0 0 100%;
}

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > .star-rating {
	width: 7em;
	margin: 0 calc(50% - 3.5em) 8px !important; /* займає весь рядок, зірки по центру */
	order: 1;
}

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > .price {
	order: 2;
	display: inline-block;
	margin: 0 !important;
	line-height: 1.2;
}

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > p.stock {
	order: 3;
	margin: 0 0 0 auto !important;  /* праворуч від ціни */
	max-width: 8.2em;               /* «В наявності:» / «29954 од.» — рівно два рядки */
	font-size: 11.5px !important;
	line-height: 1.05;              /* два рядки = висота ціни */
	text-align: left;
	white-space: normal;
}

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > p.stock::before {
	margin-top: .35em;
}

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link + a.button,
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link ~ .button {
	margin-top: 12px !important;
}

/* Телефон: дрібніші підписи, кнопки без переносу по одній букві */
@media (max-width: 768px) {
	.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > p.stock {
		font-size: 11px !important;
		line-height: 1;
		gap: 4px;
	}

	.woocommerce ul.products li.product a.button,
	.woocommerce ul.products li.product .cwg_popup_submit {
		font-size: 12.5px !important;
		line-height: 1.25 !important;
		padding: 9px 6px !important;
		white-space: normal;
	}

	/* іконка кошика забирає місце — на телефоні ховаємо */
	.woocommerce ul.products li.product a.button.add_to_cart_button::after {
		display: none !important;
	}
}

/* Усі кнопки в картках однакової висоти (вміщують 2 рядки тексту),
   текст — по центру */
.woocommerce ul.products li.product a.button,
.woocommerce ul.products li.product .cwg_popup_submit {
	display: flex !important;
	align-items: center;
	justify-content: center;
	gap: 6px;
	box-sizing: border-box !important;
	height: 48px !important;       /* однакова висота для «Додати в кошик» і «Повідомити…» */
	padding: 4px 10px !important;
	line-height: 1.2 !important;
	text-align: center;
	white-space: normal;
}

@media (max-width: 768px) {
	.woocommerce ul.products li.product a.button,
	.woocommerce ul.products li.product .cwg_popup_submit {
		height: 44px !important;
		padding: 3px 6px !important;
	}
}

/* ---------- 8.7 Футер ---------- */
#colophon {
	margin-top: 32px;
}

#colophon .footer-wrapper {
	background: #1b1e23;
	color: #aeb4bd;
	padding: 0;
	font-size: 14px;
}

#colophon #footer-top {
	padding: 36px 0 20px;
	border: 0;
}

/* 4 колонки на сітці замість float */
#colophon .footer-columns {
	display: grid;
	grid-template-columns: 1.1fr .8fr 1.5fr 1fr;
	gap: 24px 40px;
	margin: 0;
}

#colophon .footer-columns::before,
#colophon .footer-columns::after {
	display: none;
}

#colophon .footer-columns .footer-sidebar {
	width: auto;
	float: none;
	padding: 0;
}

#colophon .widget {
	margin: 0;
	padding: 0;
}

/* Заголовки колонок */
#colophon .footer-sidebar h2.wp-block-heading {
	font-family: "Open Sans", sans-serif;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: .8px;
	text-transform: uppercase;
	color: #fff;
	margin: 0 0 14px;
}

/* Посилання */
#colophon .footer-sidebar a {
	color: #d5d9df;
	text-decoration: none;
	line-height: 2;
	transition: color .15s ease;
}

#colophon .footer-sidebar a:hover,
#colophon .footer-sidebar a:focus {
	color: #ff5a5a;
}

/* Контакти й Viber — помітніше */
#colophon #block-7 a,
#colophon #block-9 a {
	font-size: 16px;
	font-weight: 600;
	color: #fff;
}

#colophon #block-7 font {
	font-size: inherit;
}

/* Самовивіз — дрібніший приглушений текст */
#colophon #block-3 {
	font-size: 13px;
	line-height: 1.55;
	color: #9aa1ab;
}

#colophon #block-3 b {
	display: block;
	margin-bottom: 4px;
	font-size: 14px;
	color: #fff;
}

#colophon #block-36 p {
	margin: 8px 0 0;
}

#colophon #block-36 a {
	color: #ff5a5a;
	font-weight: 600;
}

#colophon #block-36 a::after {
	content: " →";
}

/* Логотипи оплати — компактним рядком */
#colophon .full-width-bottom-footer {
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0 !important; /* без подвійного відступу — логотипи на одній лінії з колонками */
	border-top: 1px solid rgba(255, 255, 255, .08);
	border-bottom: 0;
}

#colophon #block-35 > div {
	justify-content: flex-start;
	gap: 28px;
	margin: 14px 0 !important;
}

#colophon #block-35 > div > div {
	flex: 0 0 auto !important;
}

#colophon #block-35 img {
	height: 22px;
	width: auto;
	opacity: .75;
	transition: opacity .15s ease;
}

#colophon #block-35 img:hover {
	opacity: 1;
}

/* Apple Pay чорний — на темному фоні робимо білим */
#colophon #block-35 img[alt="ApplePAY"] {
	filter: brightness(0) invert(1);
}

/* Нижня смуга: plata by mono + копірайт */
#colophon .footer-copyright {
	background: #15171b;
	padding: 12px 0;
	margin: 0;
}

#colophon .footer-copyright .wrapper {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}

#colophon .footer-copyright .wrapper > .clearfix {
	display: none;
}

#colophon .site-info-left,
#colophon .site-info {
	width: auto;
	float: none;
	margin: 0;
}

#colophon .site-info-left .widget,
#colophon .site-info-left img {
	margin: 0;
}

#colophon .site-info-left img {
	height: 26px;
	width: auto;
	display: block;
}

#colophon .site-info,
#colophon .site-info span {
	font-size: 12px;
	color: #7c838d !important;
	text-align: right;
}

/* Планшет: 2 колонки */
@media (max-width: 992px) {
	#colophon .footer-columns {
		grid-template-columns: 1fr 1fr;
	}
}

/* Телефон */
@media (max-width: 600px) {
	#colophon #footer-top {
		padding: 28px 0 12px;
	}

	#colophon .footer-columns {
		grid-template-columns: 1fr 1fr;
		gap: 24px 16px;
	}

	/* самовивіз — на всю ширину */
	#colophon .footer-columns .footer-sidebar:nth-child(3) {
		grid-column: 1 / -1;
		grid-row: 3;
	}

	#colophon #block-35 > div {
		justify-content: center;
		flex-wrap: wrap;
		gap: 20px;
	}

	#colophon .footer-copyright .wrapper {
		flex-direction: column;
		text-align: center;
	}

	#colophon .site-info,
	#colophon .site-info span {
		text-align: center;
	}
}

/* ---------- 8.8 Фільтри в категоріях — у стилі бокового меню ---------- */

/* Місце для фільтрів — ліва колонка 260px (як дерево на головній).
   Без цього блок фільтрів розтягувався на всю ширину під товарами,
   і білий фон «губився». */
@media (min-width: 769px) {
	.tax-product_cat #desktop-filters-form-slot {
		float: left;
		width: 260px;
	}
}

#filters-form {
	background: #fff;
	border: 1px solid #e8eaed;
	border-radius: 10px;
	box-shadow: 0 2px 10px rgba(0, 0, 0, .035);
	padding: 14px 8px 12px;
	font-size: 13px;
}

#filters-form h3 {
	font-family: "Open Sans", sans-serif;
	font-size: 15px;
	font-weight: 700;
	color: var(--cnc-ink);
	margin: 0 8px 10px;
}

#filters-form .filter-group {
	padding: 10px 0 8px;
	border-top: 1px solid #f0f1f3;
}

#filters-form .filter-group br {
	display: none;
}

/* Назва групи (Для профілю, Різьблення…) */
#filters-form .filter-group > strong {
	display: block;
	margin: 0 8px 6px;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .6px;
	text-transform: uppercase;
	color: var(--cnc-muted);
}

/* Пункт фільтра — рядок як у боковому меню */
#filters-form .filter-group label {
	display: flex;
	align-items: center;
	gap: 9px;
	min-height: 32px;
	margin: 1px 0;
	padding: 4px 8px;
	border-radius: 8px;
	color: #383d44;
	cursor: pointer;
	transition: background .15s ease, color .15s ease;
}

#filters-form .filter-group label:hover {
	background: #fff0f1;
	color: #d52c35;
}

#filters-form input[type="checkbox"] {
	width: 16px;
	height: 16px;
	margin: 0;
	flex: 0 0 16px;
	accent-color: var(--cnc-red);
	cursor: pointer;
}

/* Вибраний пункт — червоним, як активна категорія в меню */
#filters-form .filter-group label:has(input:checked) {
	background: #fff0f1;
	color: #c52832;
	font-weight: 600;
}

/* «Очистити всі» */
#filters-form #reset-filters {
	display: block;
	width: calc(100% - 16px);
	margin: 8px 8px 0;
	padding: 9px 12px;
	border: 1.5px solid var(--cnc-red);
	border-radius: 10px;
	background: #fff;
	color: var(--cnc-red);
	font-weight: 700;
	font-size: 13px;
	cursor: pointer;
}

#filters-form #reset-filters:hover {
	background: var(--cnc-red);
	color: #fff;
}

/* ---------- 8.9 Міні-кошик (у шапці й у сайдбарі товару) ---------- */

/* Кнопка кошика в шапці */
.wc-cart-wrapper {
	border-radius: 10px;
	padding: 8px 14px;
}

/* Випадаюче вікно кошика */
.site-header .widget_shopping_cart {
	width: 320px;
	padding: 14px 16px 16px;
	border: 1px solid var(--cnc-line) !important;
	border-radius: var(--cnc-radius);
	background: #fff;
	box-shadow: var(--cnc-shadow-hover);
}

.site-header .widget_shopping_cart::before {
	display: none;
}

.site-header .widget_shopping_cart .widgettitle {
	display: none;
}

/* Товари в кошику */
.woocommerce.widget_shopping_cart .cart_list li,
.widget_shopping_cart .woocommerce-mini-cart li.mini_cart_item {
	position: relative;
	display: block;
	min-height: 56px;
	margin: 0;
	padding: 10px 26px 10px 64px !important;
	border-bottom: 1px solid #f0f1f3;
	text-align: left;
}

.widget_shopping_cart .woocommerce-mini-cart li.mini_cart_item img {
	position: absolute;
	left: 0;
	top: 10px;
	width: 52px !important;
	height: 52px;
	margin: 0 !important;
	object-fit: contain;
	border: 1px solid #f0f1f3;
	border-radius: 8px;
	background: #fff;
}

.widget_shopping_cart .woocommerce-mini-cart li.mini_cart_item a:not(.remove) {
	display: block;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.35;
	color: var(--cnc-ink) !important;
}

.widget_shopping_cart .woocommerce-mini-cart li.mini_cart_item .quantity {
	display: block;
	margin-top: 4px;
	font-size: 13px;
	color: var(--cnc-muted);
}

.widget_shopping_cart .woocommerce-mini-cart li.mini_cart_item .quantity .amount {
	color: var(--cnc-ink);
	font-weight: 700;
}

/* Хрестик «видалити» */
.widget_shopping_cart .woocommerce-mini-cart li.mini_cart_item a.remove {
	position: absolute;
	top: 10px;
	right: 0;
	left: auto;
	width: 22px;
	height: 22px;
	line-height: 20px;
	border-radius: 50%;
	font-size: 16px;
	color: #9aa1ab !important;
	background: transparent;
}

.widget_shopping_cart .woocommerce-mini-cart li.mini_cart_item a.remove:hover {
	color: #fff !important;
	background: var(--cnc-red);
}

/* Разом */
.widget_shopping_cart .woocommerce-mini-cart__total {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	margin: 0;
	padding: 12px 0 !important;
	border: 0 !important;
	font-size: 14px;
	color: var(--cnc-muted);
}

.widget_shopping_cart .woocommerce-mini-cart__total .amount {
	font-size: 18px;
	font-weight: 800;
	color: var(--cnc-ink);
}

/* Кнопки: «Переглянути кошик» — контур, «Оформлення» — головна */
.widget_shopping_cart .woocommerce-mini-cart__buttons {
	margin: 0 !important;
}

.widget_shopping_cart .woocommerce-mini-cart__buttons .button {
	padding: 11px 12px !important;
	border-radius: 10px !important;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2;
}

.widget_shopping_cart .woocommerce-mini-cart__buttons .button:not(.checkout) {
	background: #fff !important;
	color: var(--cnc-red) !important;
	border: 1.5px solid var(--cnc-red) !important;
}

.widget_shopping_cart .woocommerce-mini-cart__buttons .button.checkout {
	background: var(--cnc-red) !important;
	color: #fff !important;
	border: 1.5px solid var(--cnc-red) !important;
}

.widget_shopping_cart .woocommerce-mini-cart__buttons .button.checkout:hover {
	background: var(--cnc-red-dark) !important;
}

.widget_shopping_cart .woocommerce-mini-cart__empty-message {
	margin: 4px 0;
	color: var(--cnc-muted);
	text-align: center;
}

/* ---------- 8.10 Сітка каталогу без «хвостів» + коротка наявність ---------- */

/* На сторінці 18 товарів (WooCommerce: 6 у ряд × 3 ряди). Колонок завжди
   6, 3 або 2 — 18 ділиться на кожне, тож останній ряд завжди повний.
   Кількість колонок залежить від ширини блоку товарів (а не екрана),
   тому однаково працює і на головній, і в категоріях з фільтрами. */
body.woocommerce.archive #main {
	container-type: inline-size;
}

html body.woocommerce.archive ul.products[class*="columns-"] {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

@container (min-width: 560px) {
	html body.woocommerce.archive ul.products[class*="columns-"] {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@container (min-width: 1000px) {
	html body.woocommerce.archive ul.products[class*="columns-"] {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}
}

/* Наявність — крапка + кількість в один рядок, праворуч від ціни */
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > p.stock {
	align-self: center;
	align-items: center;
	max-width: none;
	font-size: 13px !important;
	line-height: 1.2;
	white-space: nowrap;
}

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > p.stock::before {
	margin-top: 0;
	width: 8px;
	height: 8px;
	flex-basis: 8px;
}

@media (max-width: 768px) {
	.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > p.stock {
		font-size: 12px !important;
		line-height: 1.2;
	}
}

/* ---------- 8.11 Картка: однакові рядки незалежно від назви й зірок ---------- */

/* Вміст картки — сітка з фіксованими рядками:
     фото · назва повністю (мінімум 3 рядки) · вільне місце
     · зірки (місце є, навіть без відгуків) · ціна + наявність — над кнопкою.
   Картки в ряду однакової висоти, тому ціни й кнопки стоять на одній лінії. */
.woocommerce ul.products li.product {
	display: flex !important;
	flex-direction: column;
}

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link {
	display: grid !important;
	grid-template-columns: auto minmax(0, 1fr);
	grid-template-rows: auto auto 1fr 21px auto;
	column-gap: 6px;
	flex: 1 1 auto;
}

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > * {
	grid-column: 1 / -1;
}

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > img {
	grid-row: 1;
}

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > .woocommerce-loop-product__title {
	grid-row: 2;
}

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > .star-rating {
	grid-row: 4;
	align-self: start;
	justify-self: center;
	margin: 0 0 8px !important;
}

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > .price {
	grid-row: 5;
	grid-column: 1;
	align-self: center;
}

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > p.stock {
	grid-row: 5;
	grid-column: 2;
	justify-self: end;
	align-self: center;
	margin: 0 !important;
}

/* Кнопка — завжди внизу картки */
.woocommerce ul.products li.product > a.button,
.woocommerce ul.products li.product > .cwg_popup_submit {
	margin-top: 12px !important;
	flex: 0 0 auto;
}

/* Назва повністю, без «...» (місце під 3 рядки резервується як і раніше) */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	display: block !important;
	-webkit-line-clamp: unset;
	overflow: visible;
}

/* Ціна й наявність — одного розміру */
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > .price,
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > .price .amount {
	font-size: 18px !important;
}

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > p.stock {
	gap: 3px;
	font-size: 18px !important;
	font-weight: 700 !important;
	white-space: nowrap;
}

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > p.stock::before {
	width: 9px;
	height: 9px;
	flex-basis: 9px;
}

/* «Під замовлення» — довгий текст, лишаємо дрібніше */
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > p.stock[style*="b8860b"] {
	font-size: 13px !important;
	white-space: normal;
	text-align: right;
}

@media (max-width: 768px) {
	.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > .price,
	.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > .price .amount,
	.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > p.stock {
		font-size: 15px !important;
	}

	.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > p.stock {
		gap: 2px;
	}

	.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > p.stock::before {
		width: 7px;
		height: 7px;
		flex-basis: 7px;
	}

	.woocommerce ul.products li.product a.woocommerce-LoopProduct-link > p.stock[style*="b8860b"] {
		font-size: 12px !important;
	}
}

/* ---------- 8.12 «Переглянути кошик» після додавання товару ---------- */
.woocommerce ul.products li.product a.added_to_cart {
	display: flex !important;
	align-items: center;
	justify-content: center;
	gap: 6px;
	box-sizing: border-box;
	width: 100%;
	height: 40px;
	margin: 8px 0 0 !important;
	padding: 4px 10px !important;
	border: 1.5px solid var(--cnc-red) !important;
	border-radius: 10px !important;
	background: #fff !important;
	color: var(--cnc-red) !important;
	font-size: 14px !important;
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	transition: background .15s ease, color .15s ease;
}

.woocommerce ul.products li.product a.added_to_cart:hover {
	background: var(--cnc-red) !important;
	color: #fff !important;
}

@media (max-width: 768px) {
	.woocommerce ul.products li.product a.added_to_cart {
		height: 38px;
		font-size: 12.5px !important;
		padding: 3px 6px !important;
	}
}
