/*
 * makerzoid-brand: брендові стилі (модуль brand-styles).
 * Перенесено з themes/blocksy-child/style.css і mu-plugins/mkz-sale-badge-color.php (makerzoid.co.uk).
 * Лише var(--mz-*) з tokens.css; напівпрозорі відтінки — через color-mix() від токенів.
 * Токени з другим аргументом var(--mz-новий, var(--mz-наявний)) ще не додано в tokens.css — див. звіт модуля.
 */

/* ---------- Заголовки: градієнт на всіх h1–h6 (рішення Д7) ---------- */
h1, h2, h3, h4, h5, h6 {
	background: var(--mz-brand-gradient);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}

/* ---------- Кнопки покупки (CTA) ---------- */
a.button.checkout.wc-forward,
a.checkout-button.button.alt.wc-forward,
button#place_order,
button.single_add_to_cart_button.button.alt {
	background: var(--mz-cta);
	color: var(--mz-heading);
}

button.single_add_to_cart_button.button.alt:focus,
button.single_add_to_cart_button.button.alt:hover,
.button.checkout.wc-forward:focus,
a.button.checkout.wc-forward:hover,
a.checkout-button.button.alt.wc-forward:focus,
a.checkout-button.button.alt.wc-forward:hover,
button#place_order:focus,
button#place_order:hover {
	background: var(--mz-cta-soft);
	color: var(--mz-heading);
}

button.single_add_to_cart_button.button.alt:active,
.button.checkout.wc-forward:active,
a.checkout-button.button.alt.wc-forward:active,
button#place_order:active {
	background: var(--mz-cta-active, var(--mz-cta));
	color: var(--mz-heading);
}

/* «Add to basket» у каталозі. Джерело: радіус 5px і текст #000 — зведено до --mz-radius-btn і --mz-heading. */
a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart {
	border: 0;
	border-radius: var(--mz-radius-btn);
	background: var(--mz-cta);
	color: var(--mz-heading);
	margin: 10px;
}

/* ---------- Ціни ---------- */
.sale-price ins span.woocommerce-Price-amount.amount {
	color: var(--mz-sale);
}

/* ---------- Бейдж знижки (span.onsale з атрибутом data-mz-badge від PHP-частини модуля) ---------- */
.onsale[data-mz-badge] {
	--badge-text-color: var(--mz-white);
}

.onsale[data-mz-badge="sale"] {
	--badge-background-color: var(--mz-badge-sale);
}

.onsale[data-mz-badge="lime"] {
	--badge-background-color: var(--mz-badge-lime);
}

/* ---------- Картки товарів ---------- */
[data-products] .product {
	margin-bottom: 0 !important;
	padding-bottom: 0 !important;
}

[data-products] .product > *:last-child {
	margin-bottom: 0 !important;
}

[data-products="type-2"] .product {
	flex-direction: row !important;
	flex-wrap: wrap;
	justify-content: center;
	text-align: center;
}

[data-products="type-2"] .ct-woo-card-actions {
	display: grid !important;
	align-items: center;
	justify-items: stretch;
	margin-top: auto;
	border-bottom: 0 !important;
}

[data-products="type-2"] .ct-woo-card-actions > * {
	min-height: 30px !important;
}

[data-products="type-2"] .ct-woo-card-actions .price:not(:only-child)::after {
	display: none;
}

li.product .ct-media-container {
	position: relative;
}

span.woocommerce-loop-product__title {
	width: 100%;
}

.ct-product-add-to-cart p.stock.out-of-stock {
	font-weight: 600;
}

/* ---------- Кошик ---------- */
.ct-cart-totals-modules {
	margin-top: 1.5em;
}

.woocommerce .cross-sells ul.products {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}

@media (max-width: 1024px) {
	.woocommerce .cross-sells ul.products {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 600px) {
	.woocommerce .cross-sells ul.products {
		grid-template-columns: 1fr;
	}
}

section.related.products {
	margin-bottom: 80px;
}

/* ---------- Утиліти описів товарів і сторінок (до переведення описів на патерни) ---------- */
.text-center {
	text-align: center;
}

.text-left {
	text-align: left;
}

.pad-20 {
	padding: 20px;
}

.margin-top100 {
	margin-top: 80px;
}

.margin-bottom40 {
	margin-bottom: 40px;
}

.padding-bottom40 {
	padding-bottom: 40px;
}

.p18 {
	font-size: 18px;
	font-weight: 500;
	line-height: 28px;
	text-align: center;
}

.grid-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 40px;
	text-align: center;
}

.grid-row-product {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 40px;
	align-content: center;
	justify-content: center;
	justify-items: center;
	text-align: center;
}

.block1,
.block3 {
	display: flex;
	align-items: center;
	gap: 25px;
	margin-top: 40px;
	padding: 10px;
}

.block2 {
	display: flex;
	flex-wrap: wrap;
	margin-top: 80px;
}

.block2 .item {
	flex: 1 0 33.33%;
	padding: 5px;
}

.block1 p,
.block2 p,
.block3 p,
.block4 p {
	margin-bottom: 0;
	padding-bottom: 10px;
}

.container-product .item p.header {
	font-weight: 600;
}

/* Джерело: рамка #00d58d38 — зведено до --mz-brand-green з прозорістю 22 %. */
.border-line {
	margin-bottom: 25px;
	border: 2px solid color-mix(in srgb, var(--mz-brand-green) 22%, transparent);
	border-radius: 15px;
	background: var(--mz-white);
}

.allset {
	padding: 60px 20px !important;
	text-align: center;
}

.learn-in-game {
	border-radius: 15px;
	background: linear-gradient(90deg, color-mix(in srgb, var(--mz-brand-blue) 8%, transparent) 0%, color-mix(in srgb, var(--mz-brand-green) 8%, transparent) 100%);
}

.flex-row-product {
	display: flex;
	gap: 40px;
}

.flex-row-product #product {
	margin-bottom: 20px;
}

.col-6.width65 {
	width: 65%;
}

.col-6.width35 {
	width: 35%;
}

.col-md-6 {
	float: left;
	width: 50%;
}

.century21st {
	justify-content: center;
	padding: 40px;
	font-size: 22px;
	font-weight: 700;
	line-height: 38px;
	text-align: center;
}

.century21st a.fl-button {
	padding: 10px;
	font-size: 16px;
}

.video-product {
	width: 100% !important;
	max-width: 500px;
	height: auto !important;
	margin: 0 auto;
}

.messenger-icons2 {
	display: flex;
	justify-content: flex-start;
}

.messenger-icon2 {
	display: inline-block;
	cursor: pointer;
}

.messenger-icon2 img {
	width: 40px;
	height: 40px;
	margin: 10px 30px 10px 0;
}

.pdf-instr {
	display: flex;
	flex-wrap: wrap;
	align-content: center;
	align-items: center;
	justify-content: center;
	gap: 5px;
	margin: 0;
	padding: 50px;
	border: 2px solid color-mix(in srgb, var(--mz-brand-blue) 23%, transparent);
	border-radius: 15px;
	background: var(--mz-white);
	text-align: center;
}

.container-product .pdf-instr {
	margin: 40px 0;
}

.pdf-instr p {
	margin-block-end: 0;
}

@media (max-width: 768px) {
	.block1,
	.block2,
	.block3 {
		flex-direction: column;
	}

	.item,
	.column {
		flex: 1 0 auto;
	}

	.container-product .pdf-instr a {
		text-align: center;
	}

	.col-6.width65,
	.col-6.width35 {
		width: 100%;
	}

	.century21st {
		font-size: 18px;
		line-height: 28px;
	}
}

@media (max-width: 680px) {
	.col-4 {
		float: left;
		width: 33%;
	}

	.col-6 {
		float: left;
		width: 50%;
	}

	.flex-row-product {
		flex-direction: column;
	}

	.col-md-6 {
		width: 100%;
	}

	.app .col-md-6 {
		width: 50%;
	}

	.app img.qrcode {
		width: 118px;
	}

	a.apps {
		position: relative;
		top: 10px;
	}

	.grid-row,
	.grid-row-product {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 450px) {
	.app .col-md-6 {
		width: 100%;
	}

	.row.app {
		padding: 10px;
	}

	a.apps {
		left: 0;
	}
}

/* ------------------------------------------------------------------
 * Картки товарів: іконки шарів мета і неактивні посилання термінів (як на джерелі, blocksy-child/style.css:323-352).
 * Шари картки ідентифікуються data-id з пакета теми (theme_mods woo_card_layout) — однакові на всіх цілях,
 * що імпортують пакет: 0VjFt… — кількість деталей, a81mF… — кількість моделей, s3m_x7… — вік, RKx61… — тип.
 * ------------------------------------------------------------------ */
ul.entry-meta[data-id="0VjFtNiFGryF0XkuIzrUC"]::before,
ul.entry-meta[data-id="a81mFxN0Q93ak-P9_fkRP"]::before,
ul.entry-meta[data-id="s3m_x7BHsl6BFl7ef-Bco"]::before,
ul.entry-meta[data-id="RKx61gHyqfQmMxT0gdSKn"]::before {
	content: '';
	display: inline-block;
	background-size: contain;
	background-repeat: no-repeat;
	width: 16px;
	height: 16px;
	margin: 0 5px;
	vertical-align: middle;
}
ul.entry-meta[data-id="0VjFtNiFGryF0XkuIzrUC"]::before { background-image: url(../img/card-meta/parts.svg); }
ul.entry-meta[data-id="a81mFxN0Q93ak-P9_fkRP"]::before { background-image: url(../img/card-meta/models.svg); }
ul.entry-meta[data-id="s3m_x7BHsl6BFl7ef-Bco"]::before { background-image: url(../img/card-meta/age.svg); }
ul.entry-meta[data-id="RKx61gHyqfQmMxT0gdSKn"]::before { background-image: url(../img/card-meta/type.svg); }
li.product ul.entry-meta a {
	pointer-events: none;
	color: grey;
	text-decoration: none;
	cursor: default;
}

/* Довгі назви товарів (sk, ro, el…) переносяться за складами, а не посеред слова. */
.woocommerce-loop-product__title,
.product_title {
	-webkit-hyphens: auto;
	hyphens: auto;
	overflow-wrap: break-word;
	word-break: normal;
}

/*
 * Шорткод [products columns="1"] у контенті сторінок: Blocksy застосовує колонки шорткода лише від 1000px,
 * нижче — кількість колонок каталогу (2), і вбудована картка товару стискається до ~130px.
 * Одна колонка — явний намір автора контенту, тож вона діє на всіх ширинах.
 */
[data-products].columns-1 {
	--shop-columns: minmax(0, 1fr);
}