/**
 * Frontend styles for WooCommerce Product Configurator.
 */

.wcpc-configurator {
	margin: 0.3em 0 0.2em;
	padding: 0;
	border: none;
	background: transparent;
	box-sizing: border-box;
	width: 100%;
	font-size: 14px;
	line-height: 1.5;
	color: #333;
}

.wcpc-configurator *,
.wcpc-configurator *::before,
.wcpc-configurator *::after {
	box-sizing: border-box;
}

.wcpc-configurator__title {
	margin: 0 0 0.5em;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.3;
	color: #222;
}

.wcpc-configurator__items {
	display: flex;
	flex-direction: column;
	gap: 0.2em;
	width: 100%;
}

.wcpc-configurator__item {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	min-height: 72px;
	padding: 0 84px 0.3em 0;
	margin-bottom: 0.3em;
	border: none !important;
	background: transparent;
	overflow: visible;
}

.wcpc-configurator__item:last-child {
	border-bottom: none;
	padding-bottom: 0;
	margin-bottom: 0;
}

.wcpc-configurator__item-header {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	justify-content: space-between;
	gap: 0.5em;
	width: 100%;
	padding: 0;
}

.wcpc-configurator__item-info {
	flex: 1;
	min-width: 0;
}

.wcpc-configurator__item-name {
	margin: 0 0 0.15em;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.3;
	color: #222;
}

.wcpc-configurator__item-number {
	margin-right: 0.25em;
	font-weight: 400;
	color: #555;
}

.wcpc-required {
	color: #e74c3c;
	margin-left: 3px;
	font-size: 13px;
	font-weight: 700;
}

.wcpc-configurator__item-price {
	font-weight: 400;
	font-size: 14px;
	line-height: 1.3;
	color: #e74c3c;
}

.wcpc-configurator__item-price .wcpc-price-html,
.wcpc-configurator__item-price .woocommerce-Price-amount,
.wcpc-configurator__item-price .amount,
.wcpc-configurator__item-price bdi,
.wcpc-configurator__item-price ins,
.wcpc-configurator__item-price del {
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
}

.wcpc-configurator__item-price del {
	opacity: 0.55;
	color: #999;
}

.wcpc-configurator__item-image {
	position: absolute;
	right: 0;
	top: 0;
	flex-shrink: 0;
}

.wcpc-configurator__item-image img {
	display: block;
	width: 72px !important;
	height: 72px !important;
	border-radius: 5px;
	object-fit: cover;
	border: none !important;
	background: transparent !important;
}

.wcpc-configurator__item-name {
	margin: 0 0 0.2em;
	font-size: 18px;
	font-weight: 500;
	line-height: 1.3;
	color: #222;
	text-transform: uppercase;
}

.wcpc-configurator__item-number {
	margin-right: 0.2em;
	font-weight: 500;
	color: #222;
}

.wcpc-configurator__item-sku {
	font-size: 11px;
	color: #64748b;
	text-transform: uppercase;
	margin-bottom: 12px;
	letter-spacing: 0.5px;
	font-weight: 500;
}

.wcpc-configurator__item-divider {
	width: 100%;
	height: 1px;
	border-top: 1px dotted #cbd5e1;
	margin-bottom: 12px;
}

.wcpc-required {
	color: #ef4444;
	margin-left: 3px;
	font-size: 14px;
	font-weight: 700;
}

.wcpc-configurator__item-price {
	display: none !important;
}

.wcpc-configurator__item-price .wcpc-price-html,
.wcpc-configurator__item-price .woocommerce-Price-amount,
.wcpc-configurator__item-price .amount,
.wcpc-configurator__item-price bdi,
.wcpc-configurator__item-price ins,
.wcpc-configurator__item-price del {
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
}

.wcpc-configurator__item-price del {
	opacity: 0.55;
	color: #94a3b8;
	font-weight: 400;
	margin-right: 6px;
}

/* ──────────────────────────────────────────────
   Variation Swatches
   ────────────────────────────────────────────── */

.wcpc-configurator__variations {
	width: 100%;
	padding: 0;
}

.wcpc-variation-row {
	width: 100%;
	margin-bottom: 0.1em;
}

.wcpc-variation-row:last-child {
	margin-bottom: 0;
}

.wcpc-variation-header {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.3em;
	margin-bottom: 0.2em;
}

.wcpc-variation-label {
	font-size: 12px;
	font-weight: 400;
	color: #444;
}

.wcpc-variation-selected-value {
	display: inline-block;
	font-size: 13px !important;
	font-weight: 500 !important;
	color: #333 !important;
	margin-left: 4px;
}

.wcpc-variation-swatches {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: stretch;
	gap: 7px;
	width: 100%;
}

/* ── Base swatch button ── */
.wcpc-swatch {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 1.5px solid #d5d5d5;
	border-radius: 6px;
	background: #fff;
	cursor: pointer;
	transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
	overflow: hidden;
	flex-shrink: 0;
	position: relative;
}

.wcpc-swatch:hover {
	border-color: #999;
	transform: translateY(-1px);
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

.wcpc-swatch:active {
	transform: translateY(0);
}

.wcpc-swatch.is-selected {
	border-color: #79987f !important;
	box-shadow: 0 0 0 1px #79987f, 0 2px 8px rgba(121, 152, 127, 0.2) !important;
}

/* ── Color swatch: ô vuông màu lớn ── */
.wcpc-swatch--color {
	width: 28px;
	height: 28px;
	border-radius: 4px;
	padding: 0;
	position: relative;
	overflow: hidden;
}

.wcpc-swatch--color .wcpc-swatch__color {
	display: block !important;
	position: absolute !important;
	top: 2px;
	left: 2px;
	right: 2px;
	bottom: 2px;
	border-radius: 2px;
	width: auto !important;
	height: auto !important;
}

/* ── Image swatch ── */
.wcpc-swatch--image {
	width: 52px;
	height: 52px;
	padding: 0;
	border-radius: 6px;
}

.wcpc-swatch__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ── Text swatch ── */
.wcpc-swatch--text {
	width: auto;
	min-width: 38px;
	height: 36px;
	border-radius: 6px;
	padding: 0 12px;
}

.wcpc-swatch__label {
	font-size: 12px;
	line-height: 1.2;
	white-space: nowrap;
	color: #444;
}

/* ──────────────────────────────────────────────
   Selection Rows (Multi-variation)
   ────────────────────────────────────────────── */

.wcpc-selection-rows {
	display: flex;
	flex-direction: column;
	gap: 0;
	width: 100%;
}

.wcpc-selection-row {
	display: flex;
	flex-direction: column;
	width: 100%;
	padding: 0.3em 0;
	border: none !important;
}

.wcpc-selection-row:last-child {
	border-bottom: none;
}

.wcpc-selection-row__header {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	margin-bottom: 0.15em;
}



.wcpc-selection-row__remove {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
	padding: 0;
	border: none !important;
	background: transparent !important;
	color: #e74c3c !important;
	font-size: 16px !important;
	line-height: 1;
	cursor: pointer;
	transition: opacity 0.15s ease;
}

.wcpc-selection-row__remove:hover {
	opacity: 0.7;
}


.wcpc-add-selection {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-top: 10px;
	padding: 6px 0;
	border: none !important;
	background: transparent !important;
	color: rgb(40, 92, 44) !important;
	font-family: 'Montserrat', sans-serif !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	cursor: pointer;
	text-decoration: underline;
	transition: opacity 0.2s ease;
}

.wcpc-add-selection:hover {
	opacity: 0.8;
}

/* ──────────────────────────────────────────────
   Item Footer (Quantity)
   ────────────────────────────────────────────── */

.wcpc-configurator__item-footer {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	width: 100%;
	padding: 0.3em 0;
}

.wcpc-configurator__quantity {
	display: flex;
	align-items: center;
	gap: 0.6em;
	margin: 0;
	width: 100%;
}

.wcpc-configurator__quantity-label {
	font-size: 13px;
	font-weight: 400;
	white-space: nowrap;
	color: #444;
}

.wcpc-quantity-input {
	width: 58px;
	height: 32px;
	padding: 0.2em 0.35em;
	border: 1px solid #ddd;
	border-radius: 5px;
	text-align: center;
	font-size: 14px;
	background: #fff;
	transition: border-color 0.2s ease;
}

.wcpc-quantity-input:focus {
	border-color: #999;
	outline: none;
	box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.05);
}

.wcpc-quantity-fixed {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 34px;
	height: 34px;
	padding: 0 0.5em;
	border: 1px solid #ddd;
	border-radius: 6px;
	background: #f5f5f5;
	font-weight: 400;
	font-size: 14px;
	color: #555;
}

/* ──────────────────────────────────────────────
   Footer (Total + Add to Cart)
   ────────────────────────────────────────────── */

.wcpc-configurator__footer {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.6em;
	margin-top: 0.4em;
	padding-top: 0.4em;
	border-top: none !important;
	width: 100%;
}

.wcpc-configurator__total {
	flex: 1;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.3;
	color: #222;
}

.wcpc-configurator__total .woocommerce-Price-amount,
.wcpc-configurator__total .amount,
.wcpc-configurator__total bdi {
	font-size: inherit;
	font-weight: inherit;
}

.wcpc-configurator__total-label {
	margin-right: 0.4em;
	font-size: 15px;
	font-weight: 400;
	color: #555;
}

.wcpc-configurator__total-price,
.wcpc-configurator__total-price .woocommerce-Price-amount,
.wcpc-configurator__total-price bdi {
	font-style: normal !important;
	font-weight: 500 !important;
	font-size: 24px !important;
	line-height: 41px !important;
	color: rgb(40, 92, 44) !important;
}

.wcpc-add-to-cart {
	cursor: pointer;
	font-style: normal !important;
	font-weight: 500 !important;
	font-size: 16px !important;
	line-height: 16px !important;
	color: rgb(255, 255, 255) !important;
	background-color: #79987f !important;
	border: none !important;
	padding: 0.8em 1.5em !important;
	min-height: auto !important;
	border-radius: 5px !important;
	text-transform: uppercase;
	letter-spacing: 0.3px;
	transition: opacity 0.2s ease, transform 0.15s ease !important;
}

.wcpc-add-to-cart:hover {
	transform: translateY(-1px);
}

.wcpc-add-to-cart.is-loading {
	opacity: 0.7;
	pointer-events: none;
}

.wcpc-configurator__message {
	width: 100%;
	font-size: 13px;
	padding: 0.4em 0;
	min-height: 1.5em;
}

.wcpc-configurator__message.is-error {
	color: #e74c3c;
	font-weight: 500;
}

.wcpc-configurator__message.is-success {
	color: #27ae60;
	font-weight: 500;
}

/* ──────────────────────────────────────────────
   Cart Badge
   ────────────────────────────────────────────── */

.wcpc-cart-badge {
	color: #666;
	font-weight: normal;
	font-size: 11px;
}

/* ──────────────────────────────────────────────
   Hide Default WooCommerce Add to Cart
   Ẩn nút thêm giỏ hàng mặc định khi configurator đang active
   ────────────────────────────────────────────── */

/* Method 1: CSS :has() — hiệu quả nhất với trình duyệt hiện đại */
form.cart:has(.wcpc-configurator)>.quantity,
form.cart:has(.wcpc-configurator)>.single_add_to_cart_button,
form.cart:has(.wcpc-configurator)>button[type="submit"]:not(.wcpc-add-to-cart),
form.cart:has(.wcpc-configurator) .woocommerce-variation-add-to-cart,
form.cart:has(.wcpc-configurator) .variations_button {
	display: none !important;
}

/* Method 2: Body class fallback — phủ rộng cho mọi theme */
body.wcpc-hide-default-atc form.cart .single_add_to_cart_button:not(.wcpc-add-to-cart),
body.wcpc-hide-default-atc form.cart button[type="submit"]:not(.wcpc-add-to-cart),
body.wcpc-hide-default-atc form.cart>.quantity,
body.wcpc-hide-default-atc form.cart .woocommerce-variation-add-to-cart,
body.wcpc-hide-default-atc form.cart .variations_button {
	display: none !important;
}

/* Fallback for common theme structures */
body.wcpc-hide-default-atc .single-product .entry-summary .single_add_to_cart_button:not(.wcpc-add-to-cart),
body.wcpc-hide-default-atc .single-product .product-info .single_add_to_cart_button:not(.wcpc-add-to-cart),
body.wcpc-hide-default-atc .single-product .summary .single_add_to_cart_button:not(.wcpc-add-to-cart),
body.wcpc-hide-default-atc .single-product .product-info form.cart>.quantity,
body.wcpc-hide-default-atc .single-product .summary form.cart>.quantity {
	display: none !important;
}

/* ──────────────────────────────────────────────
   Responsive
   ────────────────────────────────────────────── */

@media (max-width: 600px) {
	.wcpc-configurator {
		font-size: 13px;
	}

	.wcpc-configurator__title {
		font-size: 15px;
	}

	.wcpc-configurator__item-image img {
		width: 72px !important;
		height: 72px !important;
	}

	.wcpc-swatch--color {
		width: 28px;
		height: 28px;
	}

	.wcpc-swatch--image {
		width: 44px;
		height: 44px;
	}

	.wcpc-swatch--text {
		height: 32px;
		min-width: 34px;
		padding: 0 8px;
	}

	.wcpc-variation-swatches {
		gap: 6px;
	}
}

/* ──────────────────────────────────────────────
   Parent Product Gallery — Vertical Thumbnails
   Chỉ áp dụng cho trang sản phẩm bộ quà tặng
   ────────────────────────────────────────────── */

/* Gallery wrapper created by JS: thumbnails left + main image right */
body.wcpc-configurator-active .wcpc-product-gallery-layout {
	display: flex !important;
	flex-direction: row !important;
	align-items: flex-start !important;
	gap: 12px !important;
	width: 100% !important;
}

/* Thumbnails column on the left */
body.wcpc-configurator-active .wcpc-product-gallery-layout>.flex-control-thumbs,
body.wcpc-configurator-active .wcpc-product-gallery-layout>.flex-control-nav,
body.wcpc-configurator-active .wcpc-product-gallery-layout>.woocommerce-product-gallery__thumbnails,
body.wcpc-configurator-active .wcpc-product-gallery-layout>.thumbnails {
	display: flex !important;
	flex-direction: column !important;
	width: 72px !important;
	min-width: 72px !important;
	flex-shrink: 0 !important;
	gap: 8px !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	order: -1 !important;
}

/* Each thumbnail item */
body.wcpc-configurator-active .wcpc-product-gallery-layout>.flex-control-thumbs li,
body.wcpc-configurator-active .wcpc-product-gallery-layout>.flex-control-nav li {
	width: 100% !important;
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* Thumbnail images */
body.wcpc-configurator-active .wcpc-product-gallery-layout>.flex-control-thumbs img,
body.wcpc-configurator-active .wcpc-product-gallery-layout>.flex-control-nav img,
body.wcpc-configurator-active .wcpc-product-gallery-layout>.thumbnails img {
	display: block !important;
	width: 100% !important;
	height: auto !important;
	aspect-ratio: 1 / 1 !important;
	object-fit: cover !important;
	border: 1.5px solid #e2e8f0 !important;
	border-radius: 4px !important;
	cursor: pointer !important;
	transition: border-color 0.2s ease, opacity 0.2s ease !important;
	opacity: 0.6 !important;
}

body.wcpc-configurator-active .wcpc-product-gallery-layout>.flex-control-thumbs img:hover,
body.wcpc-configurator-active .wcpc-product-gallery-layout>.flex-control-nav img:hover,
body.wcpc-configurator-active .wcpc-product-gallery-layout>.thumbnails img:hover {
	border-color: #94a3b8 !important;
	opacity: 0.85 !important;
}

body.wcpc-configurator-active .wcpc-product-gallery-layout>.flex-control-thumbs img.flex-active,
body.wcpc-configurator-active .wcpc-product-gallery-layout>.flex-control-thumbs .flex-active img,
body.wcpc-configurator-active .wcpc-product-gallery-layout>.flex-control-nav img.flex-active,
body.wcpc-configurator-active .wcpc-product-gallery-layout>.thumbnails img.active {
	border: 2px solid #111 !important;
	opacity: 1 !important;
}

/* Main image area fills remaining space */
body.wcpc-configurator-active .wcpc-product-gallery-layout>.flex-viewport,
body.wcpc-configurator-active .wcpc-product-gallery-layout>.woocommerce-product-gallery__wrapper {
	flex: 1 !important;
	min-width: 0 !important;
	margin: 0 !important;
}

/* Hide any nav arrows / triggers generated outside the wrapper */
body.wcpc-configurator-active .woocommerce-product-gallery>.flex-direction-nav {
	display: none !important;
}

/* Custom-built thumbnails (Strategy 4: stacked gallery images) */
body.wcpc-configurator-active .wcpc-custom-thumbs {
	display: flex !important;
	flex-direction: column !important;
	width: 72px !important;
	min-width: 72px !important;
	flex-shrink: 0 !important;
	gap: 8px !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

body.wcpc-configurator-active .wcpc-custom-thumbs li {
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
}

body.wcpc-configurator-active .wcpc-custom-thumbs img {
	display: block !important;
	width: 100% !important;
	height: auto !important;
	aspect-ratio: 1 / 1 !important;
	object-fit: cover !important;
	border: 1.5px solid #e2e8f0 !important;
	border-radius: 4px !important;
	cursor: pointer !important;
	transition: border-color 0.2s ease, opacity 0.2s ease !important;
	opacity: 0.6 !important;
}

body.wcpc-configurator-active .wcpc-custom-thumbs img:hover {
	border-color: #94a3b8 !important;
	opacity: 0.85 !important;
}

body.wcpc-configurator-active .wcpc-custom-thumbs img.flex-active {
	border: 2px solid #111 !important;
	opacity: 1 !important;
}

/* Responsive: on mobile, thumbnails go horizontal below the main image */
@media (max-width: 992px) {
	body.wcpc-configurator-active .wcpc-product-gallery-layout {
		flex-direction: column-reverse !important;
		gap: 20px !important;
		margin-bottom: 24px !important;
	}

	body.wcpc-configurator-active .wcpc-product-gallery-layout>.flex-control-thumbs,
	body.wcpc-configurator-active .wcpc-product-gallery-layout>.flex-control-nav,
	body.wcpc-configurator-active .wcpc-product-gallery-layout>.woocommerce-product-gallery__thumbnails,
	body.wcpc-configurator-active .wcpc-product-gallery-layout>.thumbnails,
	body.wcpc-configurator-active .wcpc-custom-thumbs {
		flex-direction: row !important;
		width: 100% !important;
		min-width: 100% !important;
		overflow-x: auto !important;
		padding-bottom: 4px !important;
	}

	body.wcpc-configurator-active .wcpc-product-gallery-layout>.flex-control-thumbs li,
	body.wcpc-configurator-active .wcpc-product-gallery-layout>.flex-control-nav li,
	body.wcpc-configurator-active .wcpc-custom-thumbs li {
		width: 56px !important;
		flex-shrink: 0 !important;
	}
}

/* ══════════════════════════════════════════════
   Custom Single Product Page Template
   (for Configurator products — bypasses Elementor)
   ══════════════════════════════════════════════ */

.wcpc-custom-product-page {
	max-width: 1280px;
	margin: 0 auto;
	padding: 67px 15px 40px;
	font-family: inherit;
	overflow: visible !important;
}

/* Force ancestors to not break position:sticky */
body.wcpc-configurator-active .site-content,
body.wcpc-configurator-active .content-area,
body.wcpc-configurator-active .entry-content,
body.wcpc-configurator-active #main,
body.wcpc-configurator-active #primary,
body.wcpc-configurator-active .site-main,
body.wcpc-configurator-active .page-content,
body.wcpc-configurator-active main,
body.wcpc-configurator-active article {
	overflow: visible !important;
}

/* Breadcrumb bar — 47px height like original */
.wcpc-custom-product-page .woocommerce-breadcrumb {
	display: flex;
	align-items: center;
	height: 47px;
	margin: 0 0 16px 0 !important;
	padding: 0 0;
	font-style: normal;
	font-weight: 400;
	font-size: 18px;
	line-height: 32px;
	color: rgb(136, 136, 136);
	border-bottom: none !important;
}

.wcpc-custom-product-page .woocommerce-breadcrumb a {
	font-style: normal;
	font-weight: 400;
	font-size: 18px;
	line-height: 32px;
	color: rgb(136, 136, 136);
	text-decoration: none;
	transition: color 0.2s;
}

.wcpc-custom-product-page .woocommerce-breadcrumb a:hover {
	color: #111;
}

.wcpc-breadcrumb-sep {
	margin: 0 4px;
	font-style: normal;
	font-weight: 400;
	font-size: 18px;
	line-height: 32px;
	color: rgb(136, 136, 136);
}

.wcpc-breadcrumb-current {
	font-style: normal;
	font-weight: 400;
	font-size: 18px;
	line-height: 32px;
	color: rgb(136, 136, 136);
}

/* ── 3-column layout: thumbs | images | info ── */
.wcpc-product-layout {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	gap: 0;
	width: 100%;
}

/* ── Column 1: Sticky thumbnail nav (far left) ── */
.wcpc-gallery-thumbs {
	position: sticky;
	top: 114px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	width: 56px;
	min-width: 56px;
	flex-shrink: 0;
	padding-right: 12px;
	z-index: 10;
	align-self: flex-start;
}

.wcpc-gallery-thumb-btn {
	display: block;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1.5px solid #e0e0e0;
	border-radius: 4px;
	background: #fff;
	cursor: pointer;
	overflow: hidden;
	transition: border-color 0.2s ease, opacity 0.2s ease;
	opacity: 0.5;
	outline: none;
}

.wcpc-gallery-thumb-btn img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.wcpc-gallery-thumb-btn:hover {
	opacity: 0.75;
	border-color: #999;
}

.wcpc-gallery-thumb-btn.is-active {
	border: 2px solid #111;
	opacity: 1;
}

/* ── Column 2: Full-size images stacked vertically ── */
.wcpc-gallery-images {
	flex: 0 0 50%;
	max-width: 50%;
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.wcpc-gallery-image-item {
	width: 100%;
}

.wcpc-gallery-image-item a {
	display: block;
}

.wcpc-gallery-image-item img {
	width: 100%;
	height: auto;
	display: block;
	object-fit: cover;
}

/* ── Column 3: Sticky product info (right) ── */
.wcpc-product-info {
	flex: 1;
	min-width: 0;
	position: sticky;
	top: 114px;
	align-self: flex-start;
	padding-left: 32px;
}

.wcpc-product-info::-webkit-scrollbar {
	width: 3px;
}

.wcpc-product-info::-webkit-scrollbar-thumb {
	background: #ddd;
	border-radius: 3px;
}

.wcpc-product-title {
	margin: 0 0 16px !important;
	font-style: normal !important;
	font-weight: 400 !important;
	font-size: 24px !important;
	line-height: 24px !important;
	color: rgb(34, 34, 34) !important;
	text-transform: uppercase !important;
	letter-spacing: 0.02em !important;
}

.wcpc-product-sku {
	font-size: 11px;
	color: #999;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	margin-bottom: 8px;
}

.wcpc-product-short-desc,
.wcpc-product-short-desc p {
	font-style: normal;
	font-weight: 400;
	font-size: 14px;
	line-height: 20px;
	color: rgb(85, 85, 85);
	white-space: pre-line;
}

.wcpc-product-price,
.wcpc-product-price .woocommerce-Price-amount,
.wcpc-product-price bdi {
	font-style: normal;
	font-weight: 500;
	font-size: 24px;
	line-height: 41px;
	color: rgb(40, 92, 44);
	margin-bottom: 16px;
}

.wcpc-product-configurator-wrapper {
	margin-top: 0;
}

/* ── Product description below gallery ── */
.wcpc-product-description-wrapper {
	margin-top: 0;
	padding-top: 0;
	border-top: none;
	clear: both;
}

.wcpc-product-description,
.wcpc-product-description p {
	max-height: 256px;
	overflow: hidden;
	transition: max-height 0.3s ease;
	font-style: normal;
	font-weight: 400;
	font-size: 14px;
	line-height: 24px;
	color: rgb(85, 85, 85);
}

/* KHI BẤM XEM THÊM: Bung vừa khít theo độ dài thực tế của chữ */
.wcpc-product-description.show-more {
	max-height: max-content !important;
}

/* STYLE NÚT XEM THÊM: Đổi thành inline-block để bám sát dòng text cuối */
.btn-readmore {
	display: inline-block !important;
	width: fit-content;
	margin: 10px auto 0 !important;
	font-size: 13px;
	color: #666;
	cursor: pointer;
	text-decoration: underline;
	font-weight: 500;
}

.btn-readmore:hover {
	color: #000;
}

.wcpc-product-description img {
	max-width: 100%;
	height: auto;
	border-radius: 4px;
}

.wcpc-product-description h2,
.wcpc-product-description h3,
.wcpc-product-description h4 {
	font-size: 16px;
	font-weight: 700;
	color: #111;
	margin: 24px 0 12px;
	text-transform: uppercase;
	letter-spacing: 0.02em;
}

/* ── Custom Details Section (50/50 Layout) ── */
.wcpc-details-section {
	display: flex;
	flex-direction: row;
	gap: 40px;
	margin-top: 40px;
	padding-top: 0;
	border-top: none;
	clear: both;
}

.wcpc-details-left,
.wcpc-details-right {
	flex: 0 0 calc(50% - 20px);
	max-width: calc(50% - 20px);
	min-width: 0;
}

.wcpc-details-banner {
	margin-top: 24px;
}

.wcpc-details-section img {
	max-width: 100%;
	height: auto;
	border-radius: 4px;
}

.wcpc-details-right img {
	width: 100%;
	height: auto;
	display: block;
	object-fit: cover;
}

/* ── Responsive ── */
@media (max-width: 992px) {
	.wcpc-custom-product-page {
		padding-top: 24px !important;
		padding-bottom: 24px !important;
	}

	.wcpc-custom-product-page .woocommerce-breadcrumb {
		padding-top: 40px !important;
		height: auto !important;
	}
}

@media (max-width: 992px) {
	.wcpc-product-layout {
		flex-direction: column;
		gap: 20px;
	}

	.wcpc-gallery-thumbs {
		position: static;
		flex-direction: row;
		width: 100%;
		min-width: 100%;
		overflow-x: auto;
		padding: 8px 0 !important;
		margin-bottom: 12px !important;
		order: -1;
	}

	.wcpc-gallery-thumb-btn {
		width: 48px;
		height: 48px;
		flex-shrink: 0;
	}

	.wcpc-gallery-images {
		flex: 0 0 100%;
		max-width: 100%;
	}

	.wcpc-product-info {
		position: static;
		padding-left: 0;
		max-height: none;
		overflow-y: visible;
		margin-top: 32px !important;
	}

	.wcpc-details-section {
		flex-direction: column;
		gap: 24px;
	}

	.wcpc-details-left,
	.wcpc-details-right {
		flex: 0 0 100%;
		max-width: 100%;
	}
}