/**
 * ==============================================================================
 * Trang Trí 4 Mùa (trangtri4mua.com) — Single Product Detail Page (PDP)
 * Style System: Blocksy Child Festive Commerce Edition
 * Version: 2.1.0
 * Typography: Playfair Display (Luxury Editorial) + Be Vietnam Pro (Clean UI)
 * ==============================================================================
 */

/* ------------------------------------------------------------------------------
 * 1. Product Gallery Enhancements
 * ------------------------------------------------------------------------------ */
.woocommerce-product-gallery {
	border: 1px solid var(--tt4m-border, #E5E7EB);
	border-radius: var(--tt4m-radius-xl, 16px);
	overflow: hidden;
	background: #FFFFFF;
	box-shadow: var(--tt4m-shadow-xs, 0 1px 2px rgba(0, 0, 0, 0.04));
	transition: border-color var(--tt4m-transition-base, 220ms ease);
}

.woocommerce-product-gallery:hover {
	border-color: var(--tt4m-border-strong, #D1D5DB);
}

.ct-product-gallery-container {
	position: relative;
	border-radius: var(--tt4m-radius-lg, 12px);
	overflow: hidden;
}

.ct-media-container img,
.woocommerce-product-gallery__image img {
	border-radius: var(--tt4m-radius-md, 8px);
	transition: transform var(--tt4m-transition-base, 220ms ease);
}

/* Gallery Thumbnails Container & Fixed Sizing (R21-01) */
.flexy-pills ol,
.woocommerce-product-gallery ol.flex-control-thumbs {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: wrap !important;
	gap: 10px !important;
	padding: 12px 0 0 0 !important;
	margin: 0 !important;
	list-style: none !important;
}

.flexy-pills ol li,
.woocommerce-product-gallery ol.flex-control-thumbs li {
	width: 80px !important;
	height: 80px !important;
	max-width: 80px !important;
	max-height: 80px !important;
	flex: 0 0 80px !important;
	box-sizing: border-box !important;
}

.flexy-pills ol li span.ct-media-container,
.flexy-pills ol li img,
.woocommerce-product-gallery ol.flex-control-thumbs li img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	border-radius: var(--tt4m-radius-md, 8px) !important;
	border: 1.5px solid var(--tt4m-border, #E5E7EB) !important;
	cursor: pointer;
	box-sizing: border-box !important;
}

.flexy-pills ol li.active img,
.flexy-pills ol li span[aria-pressed="true"] img,
.woocommerce-product-gallery ol.flex-control-thumbs li img.flex-active {
	opacity: 1 !important;
	border-color: var(--tt4m-primary, #14532D) !important;
	box-shadow: 0 0 0 1.5px var(--tt4m-primary, #14532D) !important;
}

/* ------------------------------------------------------------------------------
 * 2. Product Title & Editorial Typography (Playfair Display)
 * ------------------------------------------------------------------------------ */
.entry-summary .product_title,
h1.product_title {
	font-family: 'Playfair Display', Georgia, 'Times New Roman', serif !important;
	font-size: clamp(1.6rem, 2.4vw, 2.1rem) !important;
	font-weight: 700 !important;
	line-height: 1.3 !important;
	color: var(--tt4m-heading, #111827) !important;
	letter-spacing: -0.01em !important;
	margin-top: 0 !important;
	margin-bottom: 12px !important;
	word-break: break-word;
}

/* ------------------------------------------------------------------------------
 * 3. Stock Status Indicator: Clean authentic badge
 * ------------------------------------------------------------------------------ */
.tt4m-stock-badge {
	display: inline-flex !important;
	align-items: center !important;
	gap: 8px !important;
	padding: 5px 12px !important;
	border-radius: var(--tt4m-radius-pill, 9999px) !important;
	font-size: 13px !important;
	font-weight: 500 !important;
	line-height: 1.3 !important;
	margin-bottom: 14px !important;
	font-family: var(--tt4m-font-family, 'Be Vietnam Pro', sans-serif);
}

.tt4m-stock-in-stock {
	background: #F0FDF4 !important;
	color: var(--tt4m-primary, #14532D) !important;
	border: 1px solid #BBF7D0 !important;
}

.tt4m-stock-low {
	background: #FEF3C7 !important;
	color: #92400E !important;
	border: 1px solid #FDE68A !important;
}

.tt4m-stock-out-of-stock {
	background: #F9FAFB !important;
	color: var(--tt4m-text-muted, #6B7280) !important;
	border: 1px solid #E5E7EB !important;
}

.tt4m-stock-dot {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--tt4m-success, #16A34A);
	display: inline-block;
	flex-shrink: 0;
}

.tt4m-stock-dot.tt4m-dot-low {
	background: var(--tt4m-gold, #D97706);
}

.tt4m-stock-dot.tt4m-dot-out {
	background: var(--tt4m-text-light, #9CA3AF);
}

/* ------------------------------------------------------------------------------
 * 4. Price & Savings Block
 * ------------------------------------------------------------------------------ */
.entry-summary .price,
.single-product .summary .price {
	font-family: var(--tt4m-font-family, 'Be Vietnam Pro', sans-serif) !important;
	font-size: clamp(1.4rem, 2.2vw, 1.85rem) !important;
	font-weight: 700 !important;
	color: var(--tt4m-cta, #C41E2F) !important;
	line-height: 1.25 !important;
	margin-bottom: 8px !important;
	display: flex !important;
	align-items: baseline !important;
	gap: 10px !important;
	flex-wrap: wrap !important;
}

.entry-summary .price del,
.single-product .summary .price del {
	font-size: 0.9em !important;
	color: var(--tt4m-text-light, #9CA3AF) !important;
	font-weight: 400 !important;
	text-decoration: line-through !important;
}

.entry-summary .price ins,
.single-product .summary .price ins {
	color: var(--tt4m-cta, #C41E2F) !important;
	text-decoration: none !important;
	font-weight: 700 !important;
}

.entry-summary .woocommerce-Price-currencySymbol {
	font-size: 0.85em;
	vertical-align: baseline;
	margin-left: 1px;
}

.tt4m-savings-block {
	margin: 2px 0 12px 0;
}

.tt4m-savings-badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 4px 10px;
	background: #FEF3C7;
	border: 1px solid #FDE68A;
	border-radius: var(--tt4m-radius-md, 8px);
	font-size: 13px;
	color: #92400E;
}

.tt4m-savings-icon {
	color: var(--tt4m-gold, #D97706);
	flex-shrink: 0;
}

.tt4m-savings-amount {
	font-weight: 700;
	color: var(--tt4m-cta, #C41E2F);
}

.tt4m-savings-percent {
	color: #92400E;
	font-weight: 700;
	background: rgba(217, 119, 6, 0.12);
	padding: 1px 6px;
	border-radius: 4px;
	font-size: 12px;
}

/* ------------------------------------------------------------------------------
 * 5. Free Shipping Notification Banner (No Cheesy Emojis)
 * ------------------------------------------------------------------------------ */
.tt4m-pdp-freeship {
	background: #FAF8F5 !important;
	border: 1px solid #BBF7D0 !important;
	border-radius: var(--tt4m-radius-lg, 12px) !important;
	padding: 12px 16px !important;
	margin: 12px 0 16px 0 !important;
	box-shadow: var(--tt4m-shadow-xs, 0 1px 2px rgba(0, 0, 0, 0.04)) !important;
}

.tt4m-pdp-freeship.is-achieved {
	background: #F0FDF4 !important;
	border-color: #86EFAC !important;
}

.tt4m-pdp-freeship-header {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	font-size: 13.5px !important;
	line-height: 1.4 !important;
	color: var(--tt4m-text, #1F2937) !important;
}

.tt4m-pdp-freeship-icon {
	color: var(--tt4m-primary, #14532D) !important;
	display: flex !important;
	align-items: center !important;
	flex-shrink: 0 !important;
}

.tt4m-pdp-freeship-msg strong {
	color: var(--tt4m-primary, #14532D) !important;
	font-weight: 600 !important;
}

.tt4m-freeship-diff {
	color: var(--tt4m-cta, #C41E2F) !important;
	font-weight: 700 !important;
}

.tt4m-pdp-freeship-track {
	height: 6px !important;
	background: #E5E7EB !important;
	border-radius: var(--tt4m-radius-pill, 9999px) !important;
	overflow: hidden !important;
	margin: 10px 0 8px 0 !important;
}

.tt4m-pdp-freeship-fill {
	height: 100% !important;
	background: var(--tt4m-primary, #14532D) !important;
	border-radius: var(--tt4m-radius-pill, 9999px) !important;
	transition: width 300ms ease !important;
}

.tt4m-pdp-freeship-sub {
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;
	font-size: 12px !important;
	color: var(--tt4m-text-muted, #6B7280) !important;
	flex-wrap: wrap !important;
}

.tt4m-sub-badge {
	display: inline-flex !important;
	align-items: center !important;
	gap: 4px !important;
}

.tt4m-sub-badge svg {
	color: var(--tt4m-primary, #14532D) !important;
	flex-shrink: 0 !important;
}

.tt4m-dot-separator {
	color: var(--tt4m-border-strong, #D1D5DB) !important;
}

/* ------------------------------------------------------------------------------
 * 6. Polished Variation Select Dropdowns
 * ------------------------------------------------------------------------------ */
.variations {
	width: 100% !important;
	border-collapse: separate !important;
	border-spacing: 0 10px !important;
	margin: 8px 0 16px 0 !important;
}

.variations tr {
	display: flex !important;
	flex-direction: column !important;
	gap: 6px !important;
	border: none !important;
}

.variations td,
.variations th {
	padding: 0 !important;
	border: none !important;
	background: transparent !important;
}

.variations th.label {
	width: 100% !important;
	text-align: left !important;
}

.variations th.label label {
	font-size: 13.5px !important;
	font-weight: 600 !important;
	color: var(--tt4m-heading, #111827) !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	margin: 0 !important;
}

.variations td.value {
	position: relative !important;
	width: 100% !important;
}

.variations td.value select,
.variations select,
.entry-summary .variations select {
	width: 100% !important;
	height: 46px !important;
	min-height: 46px !important;
	padding: 0 38px 0 14px !important;
	background-color: #FFFFFF !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%234B5563' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right 14px center !important;
	background-size: 16px !important;
	appearance: none !important;
	-webkit-appearance: none !important;
	border: 1.5px solid var(--tt4m-border, #E5E7EB) !important;
	border-radius: var(--tt4m-radius-md, 8px) !important;
	font-family: var(--tt4m-font-family, 'Be Vietnam Pro', sans-serif) !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	color: var(--tt4m-text, #1F2937) !important;
	box-shadow: var(--tt4m-shadow-xs, 0 1px 2px rgba(0, 0, 0, 0.04)) !important;
	transition: border-color var(--tt4m-transition-fast, 150ms ease), box-shadow var(--tt4m-transition-fast, 150ms ease) !important;
	cursor: pointer !important;
}

.variations td.value select:hover,
.variations select:hover {
	border-color: var(--tt4m-border-strong, #D1D5DB) !important;
}

.variations td.value select:focus,
.variations select:focus {
	outline: none !important;
	border-color: var(--tt4m-primary, #14532D) !important;
	box-shadow: 0 0 0 3px rgba(20, 83, 45, 0.12) !important;
}

.variations .reset_variations {
	display: inline-block !important;
	margin-top: 6px !important;
	font-size: 12.5px !important;
	color: var(--tt4m-text-muted, #6B7280) !important;
	text-decoration: underline !important;
	transition: color var(--tt4m-transition-fast, 150ms ease) !important;
}

.variations .reset_variations:hover {
	color: var(--tt4m-cta, #C41E2F) !important;
}

/* ------------------------------------------------------------------------------
 * 7. Quantity Selector (48px Touch Targets)
 * ------------------------------------------------------------------------------ */
.entry-summary .quantity {
	display: inline-flex !important;
	align-items: center !important;
	height: 48px !important;
	min-height: 48px !important;
	border: 1.5px solid var(--tt4m-border, #E5E7EB) !important;
	border-radius: var(--tt4m-radius-md, 8px) !important;
	overflow: hidden !important;
	background: #FFFFFF !important;
	transition: border-color var(--tt4m-transition-fast, 150ms ease), box-shadow var(--tt4m-transition-fast, 150ms ease) !important;
}

.entry-summary .quantity:hover,
.entry-summary .quantity:focus-within {
	border-color: var(--tt4m-primary, #14532D) !important;
	box-shadow: 0 0 0 3px rgba(20, 83, 45, 0.12) !important;
}

.entry-summary .quantity .ct-increase,
.entry-summary .quantity .ct-decrease,
.entry-summary .quantity .plus,
.entry-summary .quantity .minus {
	width: 44px !important;
	min-width: 44px !important;
	height: 48px !important;
	min-height: 48px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	background: #F9FAFB !important;
	color: var(--tt4m-text, #1F2937) !important;
	cursor: pointer !important;
	border: none !important;
	transition: background var(--tt4m-transition-fast, 150ms ease), color var(--tt4m-transition-fast, 150ms ease) !important;
	user-select: none;
}

.entry-summary .quantity .ct-increase:hover,
.entry-summary .quantity .ct-decrease:hover,
.entry-summary .quantity .plus:hover,
.entry-summary .quantity .minus:hover {
	background: #E5E7EB !important;
	color: var(--tt4m-primary, #14532D) !important;
}

.entry-summary .quantity .ct-increase:active,
.entry-summary .quantity .ct-decrease:active,
.entry-summary .quantity .plus:active,
.entry-summary .quantity .minus:active {
	background: #D1D5DB !important;
}

.entry-summary .quantity input.qty {
	width: 52px !important;
	height: 48px !important;
	min-height: 48px !important;
	padding: 0 !important;
	text-align: center !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	font-family: var(--tt4m-font-family, 'Be Vietnam Pro', sans-serif) !important;
	color: var(--tt4m-heading, #111827) !important;
	border: none !important;
	background: transparent !important;
	-moz-appearance: textfield;
}

.entry-summary .quantity input.qty::-webkit-outer-spin-button,
.entry-summary .quantity input.qty::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* ------------------------------------------------------------------------------
 * 8. Dual Action Buttons: "Thêm vào giỏ hàng" + "Mua ngay"
 * ------------------------------------------------------------------------------ */
.ct-cart-actions,
.woocommerce-variation-add-to-cart,
.cart .ct-cart-actions {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 12px !important;
	align-items: center !important;
	margin-top: 18px !important;
	margin-bottom: 14px !important;
}

/* Quantity on its own row */
.entry-summary .quantity {
	order: 0 !important;
	width: 130px !important;
	flex: 0 0 130px !important;
}

/* Spacer row to wrap buttons onto row 2 side by side */
.ct-cart-actions::before {
	content: '';
	display: block !important;
	width: 100% !important;
	height: 0 !important;
	order: 1 !important;
}

/* Secondary Button: "Thêm vào giỏ hàng" */
.woocommerce .entry-summary button.single_add_to_cart_button.button,
.woocommerce button.single_add_to_cart_button.button.alt,
.entry-summary .single_add_to_cart_button.button,
.single_add_to_cart_button.button {
	order: 2 !important;
	flex: 1 1 calc(50% - 6px) !important;
	height: 48px !important;
	min-height: 48px !important;
	padding: 0 16px !important;
	border: 1.5px solid var(--tt4m-primary, #14532D) !important;
	background: #FFFFFF !important;
	background-color: #FFFFFF !important;
	color: var(--tt4m-primary, #14532D) !important;
	font-family: var(--tt4m-font-family, 'Be Vietnam Pro', sans-serif) !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	border-radius: var(--tt4m-radius-md, 8px) !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	cursor: pointer !important;
	text-decoration: none !important;
	transition: all var(--tt4m-transition-fast, 150ms ease) !important;
	box-shadow: var(--tt4m-shadow-xs, 0 1px 2px rgba(0, 0, 0, 0.04)) !important;
	white-space: nowrap !important;
	margin: 0 !important;
}

/* Clean cart icon for Add to cart button */
.woocommerce .entry-summary button.single_add_to_cart_button.button::before,
.entry-summary .single_add_to_cart_button.button::before {
	content: '';
	display: inline-block;
	width: 16px;
	height: 16px;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='21' r='1'%3E%3C/circle%3E%3Ccircle cx='20' cy='21' r='1'%3E%3C/circle%3E%3Cpath d='M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6'%3E%3C/path%3E%3C/svg%3E") no-repeat center / contain;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='21' r='1'%3E%3C/circle%3E%3Ccircle cx='20' cy='21' r='1'%3E%3C/circle%3E%3Cpath d='M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6'%3E%3C/path%3E%3C/svg%3E") no-repeat center / contain;
	flex-shrink: 0;
}

.woocommerce .entry-summary button.single_add_to_cart_button.button:hover,
.woocommerce button.single_add_to_cart_button.button.alt:hover,
.entry-summary .single_add_to_cart_button.button:hover {
	background: var(--tt4m-primary-tint, #E8F5E9) !important;
	background-color: var(--tt4m-primary-tint, #E8F5E9) !important;
	color: var(--tt4m-primary-dark, #0F3F22) !important;
	border-color: var(--tt4m-primary-dark, #0F3F22) !important;
}

.woocommerce .entry-summary button.single_add_to_cart_button.button:active,
.woocommerce button.single_add_to_cart_button.button.alt:active,
.entry-summary .single_add_to_cart_button.button:active {
	background: #DCFCE7 !important;
	background-color: #DCFCE7 !important;
	transform: translateY(1px) !important;
}

/* Primary Button: "Mua ngay" */
.tt4m-pdp-buy-now {
	order: 3 !important;
	flex: 1 1 calc(50% - 6px) !important;
	height: 48px !important;
	min-height: 48px !important;
	padding: 0 16px !important;
	border: 1px solid transparent !important;
	border-radius: var(--tt4m-radius-md, 8px) !important;
	background: var(--tt4m-cta, #C41E2F) !important;
	background-color: var(--tt4m-cta, #C41E2F) !important;
	color: #FFFFFF !important;
	font-family: var(--tt4m-font-family, 'Be Vietnam Pro', sans-serif) !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	cursor: pointer !important;
	text-decoration: none !important;
	position: relative !important;
	box-shadow: 0 1px 3px rgba(196, 30, 47, 0.25) !important;
	transition: all var(--tt4m-transition-fast, 150ms ease) !important;
	white-space: nowrap !important;
	margin: 0 !important;
}

.tt4m-pdp-buy-now:hover {
	background: var(--tt4m-cta-hover, #A01825) !important;
	background-color: var(--tt4m-cta-hover, #A01825) !important;
	box-shadow: 0 3px 8px rgba(196, 30, 47, 0.3) !important;
	color: #FFFFFF !important;
}

.tt4m-pdp-buy-now:active {
	background: var(--tt4m-cta-active, #88131E) !important;
	background-color: var(--tt4m-cta-active, #88131E) !important;
	transform: translateY(1px) !important;
	box-shadow: 0 1px 2px rgba(196, 30, 47, 0.2) !important;
}

.tt4m-pdp-buy-now.is-loading {
	opacity: 0.75;
	pointer-events: none;
}

/* Non-purchasable inquiry button */
.tt4m-pdp-nonpurchasable-cta {
	margin: 16px 0;
}

.tt4m-btn-contact-lg {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 10px !important;
	height: 48px !important;
	min-height: 48px !important;
	width: 100% !important;
	background: var(--tt4m-zalo, #0068FF) !important;
	color: #FFFFFF !important;
	font-weight: 600 !important;
	font-size: 15px !important;
	border-radius: var(--tt4m-radius-md, 8px) !important;
	text-decoration: none !important;
	transition: all var(--tt4m-transition-fast, 150ms ease) !important;
}

.tt4m-btn-contact-lg:hover {
	background: #0056D6 !important;
	color: #FFFFFF !important;
}

/* ------------------------------------------------------------------------------
 * 9. Zalo & Hotline Assist Row
 * ------------------------------------------------------------------------------ */
.tt4m-pdp-assist {
	display: flex !important;
	gap: 10px !important;
	margin: 16px 0 18px 0 !important;
	width: 100% !important;
}

.tt4m-assist-btn {
	flex: 1 1 50% !important;
	min-height: 48px !important;
	height: 48px !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 10px !important;
	padding: 6px 14px !important;
	border-radius: var(--tt4m-radius-md, 8px) !important;
	text-decoration: none !important;
	transition: all var(--tt4m-transition-fast, 150ms ease) !important;
	box-sizing: border-box !important;
}

.tt4m-assist-icon-circle {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.tt4m-assist-info {
	display: flex;
	flex-direction: column;
	text-align: left;
	overflow: hidden;
}

.tt4m-assist-title {
	font-size: 13px !important;
	font-weight: 600 !important;
	line-height: 1.25 !important;
}

.tt4m-assist-sub {
	font-size: 11.5px !important;
	line-height: 1.25 !important;
}

/* Zalo Assist Button */
.tt4m-assist-zalo {
	background: #EFF6FF !important;
	border: 1px solid #BFDBFE !important;
	color: var(--tt4m-zalo, #0068FF) !important;
}

.tt4m-assist-zalo .tt4m-assist-icon-circle {
	background: rgba(0, 104, 255, 0.12);
	color: var(--tt4m-zalo, #0068FF);
}

.tt4m-assist-zalo .tt4m-assist-title {
	color: #0056D6 !important;
}

.tt4m-assist-zalo .tt4m-assist-sub {
	color: #3B82F6 !important;
}

.tt4m-assist-zalo:hover {
	background: #DBEAFE !important;
	border-color: #93C5FD !important;
}

/* Hotline Phone Button */
.tt4m-assist-phone {
	background: var(--tt4m-bg-alt, #F9FAFB) !important;
	border: 1px solid var(--tt4m-border, #E5E7EB) !important;
	color: var(--tt4m-text, #1F2937) !important;
}

.tt4m-assist-phone .tt4m-assist-icon-circle {
	background: #E5E7EB;
	color: var(--tt4m-primary, #14532D);
}

.tt4m-assist-phone .tt4m-assist-title {
	color: var(--tt4m-heading, #111827) !important;
}

.tt4m-assist-phone .tt4m-assist-sub {
	color: var(--tt4m-text-muted, #6B7280) !important;
}

.tt4m-assist-phone:hover {
	background: #F3F4F6 !important;
	border-color: #D1D5DB !important;
}

/* ------------------------------------------------------------------------------
 * 10. 4-Pillar Reassurance Box
 * ------------------------------------------------------------------------------ */
.tt4m-trust-box {
	background: #FAF8F5 !important;
	border: 1px solid #E5E7EB !important;
	border-radius: var(--tt4m-radius-lg, 12px) !important;
	padding: 16px 18px !important;
	margin: 18px 0 20px 0 !important;
	box-shadow: var(--tt4m-shadow-xs, 0 1px 2px rgba(0, 0, 0, 0.04)) !important;
}

.tt4m-trust-header {
	font-size: 13.5px !important;
	font-weight: 600 !important;
	color: var(--tt4m-primary-dark, #0F3F22) !important;
	display: flex !important;
	align-items: center !important;
	gap: 8px !important;
	margin-bottom: 14px !important;
	padding-bottom: 10px !important;
	border-bottom: 1px solid #E5E7EB !important;
}

.tt4m-trust-shield-icon {
	color: var(--tt4m-primary, #14532D);
	flex-shrink: 0;
}

.tt4m-trust-grid {
	display: grid !important;
	grid-template-columns: repeat(2, 1fr) !important;
	gap: 14px 16px !important;
}

.tt4m-trust-item {
	display: flex !important;
	align-items: flex-start !important;
	gap: 10px !important;
}

.tt4m-trust-icon-wrap {
	width: 34px !important;
	height: 34px !important;
	border-radius: var(--tt4m-radius-md, 8px) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex-shrink: 0 !important;
}

.tt4m-icon-primary {
	background: #E8F5E9 !important;
	color: var(--tt4m-primary, #14532D) !important;
}

.tt4m-icon-gold {
	background: #FEF3C7 !important;
	color: var(--tt4m-gold, #D97706) !important;
}

.tt4m-icon-cta {
	background: #FEE2E2 !important;
	color: var(--tt4m-cta, #C41E2F) !important;
}

.tt4m-icon-blue {
	background: #E0F2FE !important;
	color: #0284C7 !important;
}

.tt4m-trust-content {
	flex: 1;
}

.tt4m-trust-title {
	display: block !important;
	font-size: 13.5px !important;
	font-weight: 600 !important;
	color: var(--tt4m-heading, #111827) !important;
	line-height: 1.3 !important;
}

.tt4m-trust-desc {
	font-size: 12px !important;
	color: var(--tt4m-text-muted, #6B7280) !important;
	margin: 2px 0 0 0 !important;
	line-height: 1.35 !important;
}

/* ------------------------------------------------------------------------------
 * 11. Specifications Table (tt4m-specs-card)
 * ------------------------------------------------------------------------------ */
.tt4m-specs-card {
	border: 1px solid var(--tt4m-border, #E5E7EB) !important;
	border-radius: var(--tt4m-radius-lg, 12px) !important;
	overflow: hidden !important;
	background: #FFFFFF !important;
	box-shadow: var(--tt4m-shadow-xs, 0 1px 2px rgba(0, 0, 0, 0.04)) !important;
	margin: 16px 0 !important;
}

.tt4m-specs-header {
	background: #FAF8F5 !important;
	padding: 12px 18px !important;
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	border-bottom: 1px solid var(--tt4m-border, #E5E7EB) !important;
	color: var(--tt4m-primary-dark, #0F3F22) !important;
}

.tt4m-specs-title {
	font-size: 15px !important;
	font-weight: 600 !important;
	margin: 0 !important;
	color: var(--tt4m-heading, #111827) !important;
}

.tt4m-specs-table,
.woocommerce-Tabs-panel table.shop_attributes {
	width: 100% !important;
	border-collapse: collapse !important;
	margin: 0 !important;
}

.tt4m-specs-table tr:nth-child(even),
.woocommerce-Tabs-panel table.shop_attributes tr:nth-child(even) td {
	background: #FAF8F5 !important;
}

.tt4m-specs-table tr:not(:last-child),
.woocommerce-Tabs-panel table.shop_attributes tr:not(:last-child) {
	border-bottom: 1px solid #E5E7EB !important;
}

.tt4m-specs-table td,
.tt4m-specs-table th,
.woocommerce-Tabs-panel table.shop_attributes td,
.woocommerce-Tabs-panel table.shop_attributes th {
	padding: 12px 18px !important;
	font-size: 14px !important;
	line-height: 1.5 !important;
	vertical-align: middle !important;
}

.tt4m-specs-table .spec-label,
.woocommerce-Tabs-panel table.shop_attributes th {
	width: 32% !important;
	font-weight: 600 !important;
	color: var(--tt4m-heading, #111827) !important;
	text-align: left !important;
	background: transparent !important;
}

.tt4m-specs-table .spec-value,
.woocommerce-Tabs-panel table.shop_attributes td {
	color: var(--tt4m-text, #1F2937) !important;
}

/* ------------------------------------------------------------------------------
 * 12. Modern Product Tabs Styling
 * ------------------------------------------------------------------------------ */
.woocommerce-tabs {
	margin-top: 36px !important;
	border-top: 1px solid var(--tt4m-border, #E5E7EB) !important;
	padding-top: 24px !important;
}

.woocommerce-tabs ul.tabs.wc-tabs {
	display: flex !important;
	gap: 8px !important;
	border-bottom: 2px solid var(--tt4m-border, #E5E7EB) !important;
	padding: 0 0 0 4px !important;
	margin: 0 0 24px 0 !important;
	list-style: none !important;
	overflow-x: auto !important;
	-webkit-overflow-scrolling: touch !important;
}

.woocommerce-tabs ul.tabs.wc-tabs li {
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	border: none !important;
}

.woocommerce-tabs ul.tabs.wc-tabs li a {
	display: inline-block !important;
	padding: 12px 20px !important;
	font-size: 15px !important;
	font-weight: 500 !important;
	color: var(--tt4m-text-muted, #6B7280) !important;
	text-decoration: none !important;
	position: relative !important;
	white-space: nowrap !important;
	transition: color var(--tt4m-transition-fast, 150ms ease) !important;
}

.woocommerce-tabs ul.tabs.wc-tabs li a:hover {
	color: var(--tt4m-primary, #14532D) !important;
}

/* Active Tab Underline Indicator */
.woocommerce-tabs ul.tabs.wc-tabs li.active a {
	color: var(--tt4m-primary, #14532D) !important;
	font-weight: 600 !important;
}

.woocommerce-tabs ul.tabs.wc-tabs li.active a::after {
	content: '';
	position: absolute;
	bottom: -2px;
	left: 0;
	right: 0;
	height: 3px;
	background: var(--tt4m-primary, #14532D);
	border-radius: 3px 3px 0 0;
}

.woocommerce-Tabs-panel {
	font-size: 14.5px !important;
	line-height: var(--tt4m-line-height-relaxed, 1.625) !important;
	color: var(--tt4m-text, #1F2937) !important;
}

.woocommerce-Tabs-panel p {
	margin-bottom: 14px !important;
}

.woocommerce-Tabs-panel ul {
	padding-left: 22px !important;
	margin-bottom: 16px !important;
	line-height: 1.7 !important;
}

/* ------------------------------------------------------------------------------
 * 13. Mobile Responsiveness & Touch Targets (375px - 689px)
 * ------------------------------------------------------------------------------ */
@media (max-width: 689.98px) {
	.entry-summary .product_title,
	h1.product_title {
		font-size: 1.45rem !important;
		line-height: 1.3 !important;
	}

	.ct-cart-actions,
	.woocommerce-variation-add-to-cart,
	.cart .ct-cart-actions {
		display: grid !important;
		grid-template-columns: 1fr 1fr !important;
		gap: 10px !important;
	}

	.entry-summary .quantity {
		grid-column: 1 / -1 !important;
		width: 100% !important;
		justify-content: space-between !important;
	}

	.entry-summary .quantity input.qty {
		flex: 1 !important;
	}

	.woocommerce .entry-summary button.single_add_to_cart_button.button,
	.woocommerce button.single_add_to_cart_button.button.alt,
	.entry-summary .single_add_to_cart_button.button,
	.single_add_to_cart_button.button {
		grid-column: 1 / 2 !important;
		width: 100% !important;
		padding: 0 10px !important;
		font-size: 14px !important;
	}

	.tt4m-pdp-buy-now {
		grid-column: 2 / 3 !important;
		width: 100% !important;
		padding: 0 10px !important;
		font-size: 14px !important;
	}

	.tt4m-pdp-assist {
		flex-direction: column !important;
		gap: 8px !important;
	}

	.tt4m-assist-btn {
		width: 100% !important;
		flex: 1 1 100% !important;
	}

	.tt4m-trust-grid {
		grid-template-columns: 1fr !important;
		gap: 12px !important;
	}

	.tt4m-specs-table .spec-label,
	.woocommerce-Tabs-panel table.shop_attributes th {
		width: 38% !important;
		padding: 10px 14px !important;
		font-size: 13px !important;
	}

	.tt4m-specs-table .spec-value,
	.woocommerce-Tabs-panel table.shop_attributes td {
		padding: 10px 14px !important;
		font-size: 13px !important;
	}

	.woocommerce-tabs ul.tabs.wc-tabs li a {
		padding: 10px 16px !important;
		font-size: 14px !important;
	}
}

/* Extra Small Devices (< 400px) */
@media (max-width: 399.98px) {
	.ct-cart-actions,
	.woocommerce-variation-add-to-cart,
	.cart .ct-cart-actions {
		grid-template-columns: 1fr !important;
	}

	.woocommerce .entry-summary button.single_add_to_cart_button.button,
	.woocommerce button.single_add_to_cart_button.button.alt,
	.entry-summary .single_add_to_cart_button.button,
	.single_add_to_cart_button.button,
	.tt4m-pdp-buy-now {
		grid-column: 1 / -1 !important;
	}
}

/* ==============================================================================
 * Gallery Image Fit & Keyboard Accessibility (R21-01 & R21-02)
 * Ensures vertical & irregular product images are fully displayed without head/feet cropping.
 * Provides visible outline for keyboard focused thumbnails and navigation arrows.
 * ============================================================================== */
/* Main Gallery Image Fit: Contain View Without Cropping (R21-01) */
.woocommerce-product-gallery .flexy-view .ct-media-container img,
.woocommerce-product-gallery .woocommerce-product-gallery__wrapper figure img {
	width: 100% !important;
	height: auto !important;
	max-height: 580px !important;
	object-fit: contain !important;
	background: #FAF9F6 !important;
}

.flexy-arrow-prev:focus-visible,
.flexy-arrow-next:focus-visible,
.flexy-pills ol li span:focus-visible,
.flexy-pills ol li:focus-visible,
.flex-control-thumbs li img:focus-visible {
	outline: 2px solid var(--tt4m-primary, #14532D) !important;
	outline-offset: 2px !important;
	border-radius: var(--tt4m-radius-sm, 6px) !important;
}

/* ==============================================================================
 * Explicit Slide Transform & Viewport Positioning (R21-01)
 * Ensures --current-item shifts slides reliably even before Blocksy bundle loads.
 * ============================================================================== */
.woocommerce-product-gallery .flexy-items {
	display: flex !important;
	flex-wrap: nowrap !important;
	width: 100% !important;
	transition: transform 300ms cubic-bezier(0.25, 1, 0.5, 1) !important;
	will-change: transform;
}

.woocommerce-product-gallery .flexy-items > .flexy-item {
	flex: 0 0 100% !important;
	width: 100% !important;
	min-width: 100% !important;
	transition: transform 300ms cubic-bezier(0.25, 1, 0.5, 1) !important;
	will-change: transform;
}
