/* ChillguyBD WooCommerce Styles */

/* --- Shop Layout --- */
.woocommerce-page .woocommerce,
.woocommerce {
	font-family: var(--cgbd-font);
}

/* Columns */
.woocommerce ul.products {
	display: grid !important;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}
@media (min-width: 640px) {
	.woocommerce ul.products { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
	.woocommerce ul.products { grid-template-columns: repeat(4, 1fr); }
}
.woocommerce ul.products li.product {
	margin: 0 !important;
	width: auto !important;
	float: none !important;
}

/* Product card inner */
.woocommerce ul.products li.product .woocommerce-loop-product__link {
	display: block;
}
.woocommerce ul.products li.product .woocommerce-loop-product__link img {
	width: 100%;
	aspect-ratio: 1/1;
	object-fit: cover;
	border-radius: 0;
}
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	padding: 16px 20px 4px !important;
}
.woocommerce ul.products li.product .price {
	padding: 0 20px 8px !important;
	display: block;
}
.woocommerce ul.products li.product .button {
	margin: 0 20px 20px !important;
	width: calc(100% - 40px) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}

/* --- Single Product (LEGACY shortcode-based pages only) ---
   Scoped with :not(.is-layout-flow) so these rules NEVER touch
   block-theme product pages (whose wrapper always has is-layout-flow).
   Block-theme product page styles live in the section further below. */
.woocommerce div.product.type-product:not(.is-layout-flow) {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 60px;
	align-items: start;
}
@media (max-width: 768px) {
	.woocommerce div.product.type-product:not(.is-layout-flow) { grid-template-columns: 1fr; gap: 32px; }
}
.woocommerce div.product.type-product:not(.is-layout-flow) .woocommerce-product-gallery {
	float: none !important;
	width: 100% !important;
}
.woocommerce div.product.type-product:not(.is-layout-flow) .woocommerce-product-gallery .woocommerce-product-gallery__image img {
	border-radius: var(--cgbd-radius-md);
}
.woocommerce div.product.type-product:not(.is-layout-flow) .entry-summary {
	float: none !important;
	width: 100% !important;
}
.woocommerce div.product.type-product:not(.is-layout-flow) .product_title {
	font-size: 26px !important;
	font-weight: 800 !important;
	color: var(--cgbd-navy-md) !important;
	line-height: 1.25;
	margin-bottom: 12px;
}
.woocommerce div.product.type-product:not(.is-layout-flow) .price {
	font-size: 28px !important;
	font-weight: 800 !important;
	color: var(--cgbd-coral) !important;
	margin-bottom: 16px;
}
.woocommerce div.product.type-product:not(.is-layout-flow) .price del {
	font-size: 16px !important;
	color: var(--cgbd-outline) !important;
	font-weight: 400 !important;
}
.woocommerce div.product.type-product:not(.is-layout-flow) .woocommerce-product-details__short-description {
	font-size: 15px;
	line-height: 1.7;
	color: var(--cgbd-on-surface-variant);
	margin-bottom: 20px;
}

/* Legacy quantity & add-to-cart form */
.woocommerce div.product.type-product:not(.is-layout-flow) form.cart {
	display: flex;
	gap: 12px;
	align-items: center;
	flex-wrap: wrap;
	margin-top: 20px;
}
.woocommerce div.product.type-product:not(.is-layout-flow) form.cart .quantity input {
	font-family: var(--cgbd-font);
	font-size: 16px;
	font-weight: 700;
	text-align: center;
	border: 2px solid var(--cgbd-outline-variant);
	border-radius: var(--cgbd-radius-pill);
	padding: 10px 20px;
	width: 90px;
	background: var(--cgbd-white);
}
.woocommerce div.product.type-product:not(.is-layout-flow) form.cart .single_add_to_cart_button {
	flex: 1;
	font-size: 16px !important;
	padding: 14px 28px !important;
	background-color: var(--cgbd-coral) !important;
}

/* Tabs */
.woocommerce div.product .woocommerce-tabs ul.tabs {
	padding: 0;
	margin: 0 0 24px;
	border-bottom: 2px solid var(--cgbd-outline-variant);
	display: flex;
	gap: 0;
	list-style: none;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li {
	background: none !important;
	border: none !important;
	padding: 0 !important;
	margin: 0 !important;
	border-radius: 0 !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	font-family: var(--cgbd-font);
	font-size: 15px;
	font-weight: 600;
	color: var(--cgbd-on-surface-variant);
	padding: 12px 24px;
	display: block;
	border-bottom: 2px solid transparent;
	margin-bottom: -2px;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
	color: var(--cgbd-teal);
	border-bottom-color: var(--cgbd-teal);
}

/* --- Cart --- */
.woocommerce table.cart td,
.woocommerce table.cart th {
	font-family: var(--cgbd-font);
	padding: 20px 12px;
}
.woocommerce table.cart th {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--cgbd-on-surface-variant);
	border-bottom: 2px solid var(--cgbd-outline-variant);
}
.woocommerce table.cart td { border-bottom: 1px solid var(--cgbd-outline-variant); }
.woocommerce table.cart .product-thumbnail img {
	border-radius: var(--cgbd-radius);
	width: 80px;
	height: 80px;
	object-fit: cover;
}
.cart-collaterals .cart_totals {
	background: var(--cgbd-white);
	border-radius: var(--cgbd-radius-md);
	box-shadow: var(--cgbd-shadow-card);
	padding: 32px;
}
.cart-collaterals .cart_totals h2 {
	font-size: 18px;
	font-weight: 700;
	color: var(--cgbd-navy-md);
	margin-bottom: 20px;
}
.cart-collaterals .wc-proceed-to-checkout .checkout-button {
	background-color: var(--cgbd-coral) !important;
	font-size: 16px !important;
	padding: 16px 32px !important;
	width: 100% !important;
	display: block !important;
	text-align: center !important;
}

/* --- Checkout (legacy/shortcode only — block-checkout selectors are below) --- */
form.woocommerce-checkout {
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	gap: 40px;
	align-items: start;
}
@media (max-width: 768px) {
	form.woocommerce-checkout { grid-template-columns: 1fr; }
}
.woocommerce-billing-fields h3,
.woocommerce-shipping-fields h3,
form.woocommerce-checkout #order_review_heading {
	font-size: 18px;
	font-weight: 700;
	color: var(--cgbd-navy-md);
	margin-bottom: 20px;
	padding-bottom: 12px;
	border-bottom: 2px solid var(--cgbd-outline-variant);
}
.woocommerce-checkout #payment {
	background: var(--cgbd-white);
	border-radius: var(--cgbd-radius-md);
	box-shadow: var(--cgbd-shadow-card);
	padding: 28px;
}
.woocommerce-checkout #payment ul.payment_methods {
	border-bottom: 1px solid var(--cgbd-outline-variant);
	padding-bottom: 20px;
	margin-bottom: 20px;
}
.woocommerce-checkout #payment ul.payment_methods li label {
	font-weight: 600;
	font-size: 15px;
}
.woocommerce-checkout #payment #place_order {
	background-color: var(--cgbd-coral) !important;
	font-size: 17px !important;
	padding: 16px 32px !important;
	width: 100% !important;
}

/* Order received */
.woocommerce-order {
	text-align: center;
	padding: 60px 0;
}
.woocommerce-order .woocommerce-order-overview {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 32px;
	margin: 32px 0;
	padding: 24px;
	background: var(--cgbd-surface-low);
	border-radius: var(--cgbd-radius-md);
	list-style: none;
}
.woocommerce-order .woocommerce-order-overview li {
	font-size: 14px;
	font-weight: 600;
	color: var(--cgbd-on-surface-variant);
}
.woocommerce-order .woocommerce-order-overview li strong {
	display: block;
	font-size: 18px;
	font-weight: 800;
	color: var(--cgbd-navy-md);
	margin-top: 4px;
}

/* --- Notices --- */
.woocommerce-message,
.woocommerce-error,
.woocommerce-info {
	border-radius: var(--cgbd-radius-md) !important;
	font-family: var(--cgbd-font) !important;
	padding: 16px 20px !important;
}
.woocommerce-message { border-top-color: var(--cgbd-teal) !important; }
.woocommerce-error { border-top-color: var(--cgbd-coral) !important; }
.woocommerce-info { border-top-color: var(--cgbd-navy-md) !important; }

/* --- Star Ratings --- */
.woocommerce .star-rating span::before,
.woocommerce .star-rating::before {
	color: #f59e0b !important;
}

/* ============================================
   Block-Based Single Product (single-product.html)
   ============================================ */

.cgbd-product-main {
	background: var(--cgbd-bg);
	width: 100% !important;
	max-width: none !important;
	box-sizing: border-box !important;
	padding: 0 clamp(16px, 3vw, 64px) 80px !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

.cgbd-product-breadcrumb .woocommerce-breadcrumb,
.cgbd-product-breadcrumb .wc-block-components-breadcrumbs {
	font-size: 13px;
	color: var(--cgbd-on-surface-variant);
}

/* 2-column hero (gallery + buy box) */
.cgbd-product-hero {
	gap: 56px !important;
	align-items: flex-start !important;
}
.cgbd-product-gallery-col,
.cgbd-product-buybox-col {
	min-width: 0;
}

/* Gallery — override WC's hardcoded 512px max-width and inline FlexSlider widths */
.woocommerce .cgbd-product-gallery-col .wp-block-woocommerce-product-image-gallery,
.cgbd-product-gallery-col .wp-block-woocommerce-product-image-gallery,
.cgbd-product-gallery-col .woocommerce-product-gallery {
	position: relative;
	max-width: 100% !important;
	width: 100% !important;
	float: none !important;
	margin-bottom: 0 !important;
}
.cgbd-product-gallery-col .woocommerce-product-gallery__wrapper,
.cgbd-product-gallery-col .flex-viewport,
.cgbd-product-gallery-col .flexslider {
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
}
.cgbd-product-gallery-col .woocommerce-product-gallery__image {
	width: 100% !important;
	float: none !important;
	margin-right: 0 !important;
	display: block !important;
}
.cgbd-product-gallery-col .woocommerce-product-gallery__image a,
.cgbd-product-gallery-col .woocommerce-product-gallery__image > a,
.cgbd-product-gallery-col .woocommerce-product-gallery__image > img {
	display: block !important;
	width: 100% !important;
}
.cgbd-product-gallery-col .woocommerce-product-gallery__image img,
.cgbd-product-gallery-col .wp-block-woocommerce-product-image-gallery img {
	width: 100% !important;
	max-width: 100% !important;
	height: clamp(320px, 42vw, 540px) !important;
	max-height: 540px !important;
	aspect-ratio: auto !important;
	border-radius: var(--cgbd-radius-lg) !important;
	background: var(--cgbd-surface-low);
	object-fit: cover !important;
	object-position: center !important;
	display: block !important;
}
/* Cap the slide container too so FlexSlider's wrapper doesn't overflow */
.cgbd-product-gallery-col .woocommerce-product-gallery__image,
.cgbd-product-gallery-col .flex-viewport {
	max-height: 540px !important;
	overflow: hidden !important;
}

/* Override FlexSlider's transform-based slide track. The slides in this
   theme are direct children of .woocommerce-product-gallery__wrapper, so
   we hide every slide and only show the .flex-active-slide. */
.cgbd-product-gallery-col .woocommerce-product-gallery__wrapper {
	transform: none !important;
	width: auto !important;
	height: auto !important;
	display: block !important;
	margin: 0 !important;
	padding: 0 !important;
	position: relative !important;
}
.cgbd-product-gallery-col .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image {
	width: 100% !important;
	max-width: 100% !important;
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
	position: static !important;
	display: none !important;
	max-height: 540px !important;
	overflow: hidden !important;
}
.cgbd-product-gallery-col .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image.flex-active-slide,
.cgbd-product-gallery-col .woocommerce-product-gallery__wrapper > .woocommerce-product-gallery__image:only-child {
	display: block !important;
}
/* Sale badge on gallery */
.cgbd-product-gallery-col .onsale,
.cgbd-product-gallery-col span.onsale {
	background: var(--cgbd-coral) !important;
	color: #fff !important;
	font-weight: 700 !important;
	font-size: 12px !important;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	border-radius: var(--cgbd-radius-pill) !important;
	padding: 6px 14px !important;
	top: 16px !important;
	left: 16px !important;
	right: auto !important;
	min-height: 0 !important;
	min-width: 0 !important;
	line-height: 1 !important;
	z-index: 5;
}
/* Gallery zoom trigger */
.cgbd-product-gallery-col .woocommerce-product-gallery__trigger {
	top: 16px !important;
	right: 16px !important;
	z-index: 5;
}
/* Thumbnails row */
.cgbd-product-gallery-col .flex-control-thumbs {
	display: flex !important;
	gap: 12px !important;
	margin: 16px 0 0 !important;
	padding: 0 !important;
	list-style: none !important;
	flex-wrap: nowrap !important;
	overflow-x: auto;
	scrollbar-width: thin;
}
.cgbd-product-gallery-col .flex-control-thumbs li {
	flex: 0 0 88px !important;
	width: 88px !important;
	height: 88px !important;
	max-height: 88px !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	overflow: hidden !important;
	border-radius: var(--cgbd-radius) !important;
}
.cgbd-product-gallery-col .flex-control-thumbs li img,
.cgbd-product-gallery-col .flex-control-thumbs img {
	width: 88px !important;
	height: 88px !important;
	max-width: 88px !important;
	max-height: 88px !important;
	min-height: 88px !important;
	object-fit: cover !important;
	object-position: center !important;
	display: block !important;
	border-radius: var(--cgbd-radius) !important;
	border: 2px solid transparent !important;
	box-sizing: border-box !important;
	cursor: pointer;
	transition: border-color 0.2s, opacity 0.2s;
	opacity: 0.7;
	aspect-ratio: auto !important;
}
.cgbd-product-gallery-col .flex-control-thumbs img.flex-active,
.cgbd-product-gallery-col .flex-control-thumbs img:hover,
.cgbd-product-gallery-col .flex-control-thumbs li img.flex-active {
	border-color: var(--cgbd-teal) !important;
	opacity: 1 !important;
}

/* Buy box card */
.cgbd-buybox {
	position: sticky;
	top: 100px;
	background: var(--cgbd-white);
	border: 1px solid rgba(14, 42, 59, 0.08);
	border-radius: var(--cgbd-radius-lg);
	padding: 28px 32px;
	box-shadow: var(--cgbd-shadow-card);
}
.cgbd-buybox > * + * { margin-top: 14px; }

.cgbd-product-title {
	font-size: 26px !important;
	font-weight: 800 !important;
	color: var(--cgbd-navy-md) !important;
	line-height: 1.25 !important;
	margin: 0 !important;
}

.cgbd-product-buybox-col .wc-block-components-product-rating {
	color: #f59e0b;
}

.cgbd-product-price,
.cgbd-product-buybox-col .wp-block-woocommerce-product-price,
.cgbd-product-buybox-col .wc-block-components-product-price {
	font-size: 28px !important;
	font-weight: 800 !important;
	color: var(--cgbd-coral) !important;
	display: flex !important;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 12px;
}
.cgbd-product-buybox-col .wc-block-components-product-price del,
.cgbd-product-buybox-col .wc-block-components-product-price__regular {
	font-size: 17px !important;
	color: var(--cgbd-outline) !important;
	font-weight: 500 !important;
	text-decoration: line-through;
}

.cgbd-product-buybox-col .wp-block-woocommerce-product-sku {
	font-size: 12px;
	color: var(--cgbd-outline);
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.cgbd-product-buybox-col .wp-block-woocommerce-product-stock-indicator {
	font-size: 13px;
	font-weight: 600;
}
.cgbd-product-buybox-col .wc-block-components-product-stock-indicator--in-stock {
	color: var(--cgbd-teal) !important;
}

.cgbd-product-buybox-col .woocommerce-product-details__short-description,
.cgbd-product-buybox-col .wp-block-woocommerce-product-summary {
	font-size: 14px;
	line-height: 1.6;
	color: var(--cgbd-on-surface-variant);
}
.cgbd-product-buybox-col .woocommerce-product-details__short-description p:last-child {
	margin-bottom: 0;
}

/* Trust chips inside buy box */
.cgbd-buybox .cgbd-trust-chips {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px 16px;
	padding: 14px;
	background: var(--cgbd-surface-low);
	border-radius: var(--cgbd-radius);
	margin-top: 18px !important;
}
.cgbd-buybox .cgbd-trust-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	font-weight: 600;
	color: var(--cgbd-on-surface-variant);
}
.cgbd-buybox .cgbd-trust-chip .material-symbols-outlined {
	color: var(--cgbd-teal);
	font-size: 18px;
}

/* Wrapper just needs to be a full-width block */
.cgbd-buybox .wp-block-woocommerce-add-to-cart-form {
	display: block !important;
	width: 100% !important;
	margin-top: 18px !important;
}
/* The form is the actual grid: Buy Now (full row) + [Qty | Add to Cart] (split row) */
.cgbd-buybox form.cart {
	display: grid !important;
	grid-template-columns: auto 1fr !important;
	grid-template-areas:
		"buynow buynow"
		"qty addtocart" !important;
	gap: 12px !important;
	align-items: stretch !important;
	width: 100% !important;
	margin: 0 !important;
}
.cgbd-buybox form.cart > .quantity {
	grid-area: qty !important;
	margin: 0 !important;
	display: flex !important;
	align-items: stretch !important;
}
.cgbd-buybox form.cart .quantity input.qty {
	width: 96px !important;
	max-width: 96px !important;
	font-family: var(--cgbd-font);
	font-size: 16px;
	font-weight: 700;
	text-align: center;
	border: 1.5px solid var(--cgbd-outline-variant);
	border-radius: var(--cgbd-radius-pill);
	padding: 0 18px;
	background: var(--cgbd-white);
	min-height: 54px;
	box-sizing: border-box;
}
/* Add to Cart - secondary navy outline */
.cgbd-buybox form.cart .single_add_to_cart_button,
.woocommerce .cgbd-buybox form.cart button.single_add_to_cart_button {
	grid-area: addtocart !important;
	background-color: var(--cgbd-white) !important;
	color: var(--cgbd-navy-md) !important;
	border: 1.5px solid var(--cgbd-navy-md) !important;
	border-radius: var(--cgbd-radius-pill) !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	padding: 0 28px !important;
	min-height: 54px !important;
	width: 100% !important;
	margin: 0 !important;
	transition: background-color 0.15s, color 0.15s;
	letter-spacing: 0.01em;
}
.cgbd-buybox form.cart .single_add_to_cart_button:hover,
.woocommerce .cgbd-buybox form.cart button.single_add_to_cart_button:hover {
	background-color: var(--cgbd-navy-md) !important;
	color: var(--cgbd-white) !important;
}
/* Buy Now - primary coral (boost specificity to beat .woocommerce button.button rules) */
.cgbd-buybox .cgbd-buy-now,
.cgbd-buybox button.cgbd-buy-now,
.woocommerce .cgbd-buybox button.cgbd-buy-now,
.woocommerce .cgbd-buybox button.button.cgbd-buy-now {
	grid-area: buynow !important;
	background-color: var(--cgbd-coral) !important;
	color: #ffffff !important;
	border: none !important;
	border-radius: var(--cgbd-radius-pill) !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	padding: 0 28px !important;
	min-height: 56px !important;
	width: 100% !important;
	margin: 0 !important;
	cursor: pointer;
	box-shadow: 0 4px 14px rgba(255, 111, 97, 0.30) !important;
	transition: background-color 0.15s, transform 0.05s, box-shadow 0.15s;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}
.cgbd-buybox button.cgbd-buy-now:hover,
.woocommerce .cgbd-buybox button.button.cgbd-buy-now:hover {
	background-color: var(--cgbd-coral-dark) !important;
	color: #ffffff !important;
	box-shadow: 0 6px 18px rgba(255, 111, 97, 0.40) !important;
}
.cgbd-buybox button.cgbd-buy-now:active {
	transform: translateY(1px);
}

/* Product meta (categories / SKU) */
.cgbd-buybox .wp-block-woocommerce-product-meta,
.cgbd-buybox .product_meta {
	font-size: 12px;
	color: var(--cgbd-outline);
	margin-top: 18px !important;
	padding-top: 16px;
	border-top: 1px dashed rgba(14, 42, 59, 0.12);
}
.cgbd-buybox .product_meta > span,
.cgbd-buybox .wp-block-woocommerce-product-meta > * {
	display: block;
	margin: 4px 0;
}

/* Description / Reviews tabs */
.cgbd-product-tabs-wrap .wp-block-woocommerce-product-details {
	max-width: 100% !important;
}
.cgbd-product-tabs-wrap .wp-block-woocommerce-product-details ul[role=tablist],
.cgbd-product-tabs-wrap .woocommerce-tabs ul.tabs {
	display: flex !important;
	gap: 0 !important;
	margin: 0 0 24px !important;
	padding: 0 !important;
	border-bottom: 2px solid var(--cgbd-outline-variant) !important;
	list-style: none !important;
}
.cgbd-product-tabs-wrap .wp-block-woocommerce-product-details ul[role=tablist] li,
.cgbd-product-tabs-wrap .woocommerce-tabs ul.tabs li {
	background: none !important;
	border: none !important;
	padding: 0 !important;
	margin: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}
.cgbd-product-tabs-wrap .woocommerce-tabs ul.tabs li::before,
.cgbd-product-tabs-wrap .woocommerce-tabs ul.tabs li::after {
	display: none !important;
}
.cgbd-product-tabs-wrap .woocommerce-tabs ul.tabs li a,
.cgbd-product-tabs-wrap .wp-block-woocommerce-product-details [role=tab] {
	font-family: var(--cgbd-font) !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	color: var(--cgbd-on-surface-variant) !important;
	padding: 12px 24px !important;
	display: block !important;
	border-bottom: 2px solid transparent !important;
	margin-bottom: -2px !important;
	background: none !important;
}
.cgbd-product-tabs-wrap .woocommerce-tabs ul.tabs li.active a,
.cgbd-product-tabs-wrap .wp-block-woocommerce-product-details [role=tab][aria-selected=true] {
	color: var(--cgbd-teal) !important;
	border-bottom-color: var(--cgbd-teal) !important;
}

/* Upsells / Related */
.cgbd-upsells__title {
	font-size: 22px !important;
	font-weight: 800 !important;
	color: var(--cgbd-navy-md) !important;
	margin: 0 0 24px !important;
}

/* Responsive */
@media (max-width: 899px) {
	.cgbd-product-hero {
		flex-wrap: wrap !important;
	}
	.cgbd-product-hero > .wp-block-column {
		flex-basis: 100% !important;
		width: 100% !important;
	}
	.cgbd-buybox {
		position: static;
	}
}
@media (max-width: 600px) {
	/* Tighter buy-box card on phones */
	.cgbd-buybox {
		padding: 22px 18px;
		border-radius: var(--cgbd-radius-md);
	}
	/* Stack the qty + add-to-cart row so the buttons are not squeezed */
	.cgbd-buybox form.cart {
		grid-template-columns: 1fr !important;
		grid-template-areas:
			"buynow"
			"addtocart"
			"qty" !important;
	}
	.cgbd-buybox form.cart > .quantity {
		justify-self: stretch !important;
	}
	.cgbd-buybox form.cart .quantity input.qty {
		width: 100% !important;
		max-width: 100% !important;
	}
	.cgbd-buybox .cgbd-trust-chips {
		grid-template-columns: 1fr 1fr;
	}
}
@media (max-width: 480px) {
	.cgbd-product-main {
		padding-top: 16px !important;
	}
	.cgbd-product-title {
		font-size: 22px !important;
	}
}

/* ============================================
   Block-Based Cart (page-cart.html)
   Same width-fix pattern as checkout: align:full main, no constrained
   layout, override WC's max-width-1000px rule from blocktheme.css.
   ============================================ */
.cgbd-cart-main {
	background: var(--cgbd-bg);
	width: 100% !important;
	max-width: none !important;
	box-sizing: border-box !important;
	padding: 40px clamp(16px, 3vw, 64px) 80px !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}
body.woocommerce-cart main .woocommerce,
body.woocommerce-cart .wp-block-post-title,
body.woocommerce-cart .wp-block-woocommerce-cart,
body.woocommerce-cart .wp-block-woocommerce-cart.alignwide,
body.woocommerce-cart .wc-block-cart {
	max-width: none !important;
	width: 100% !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}
.cgbd-cart-header {
	margin-bottom: 28px;
	padding-bottom: 20px;
	border-bottom: 1px solid var(--cgbd-outline-variant);
	align-items: center !important;
	width: 100%;
}
.cgbd-cart-title {
	font-size: 26px !important;
	font-weight: 800 !important;
	color: var(--cgbd-navy-md) !important;
	margin: 0 !important;
}
.cgbd-cart-continue {
	font-size: 14px;
	font-weight: 600;
	color: var(--cgbd-teal);
	text-decoration: none;
}
.cgbd-cart-continue:hover { color: var(--cgbd-navy-md); }

/* WC cart-block product-image needs sizing or its <picture> wrapper collapses */
.wc-block-cart-item__image img {
	border-radius: var(--cgbd-radius) !important;
}

/* ============================================
   Block-Based Checkout (page-checkout.html)
   ============================================ */

/* ---------------------------------------------------------
   FULL-WIDTH CHECKOUT
   The template uses align:full so the <main> spans the entire
   viewport. We add responsive internal padding here, plus
   nuke every WC / WP rule that could narrow the page.
   --------------------------------------------------------- */
.cgbd-checkout-main {
	background: var(--cgbd-bg);
	width: 100% !important;
	max-width: none !important;
	box-sizing: border-box !important;
	padding: 40px clamp(16px, 3vw, 64px) 80px !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

/* Kill WC's blocktheme rule: .woocommerce-checkout main .woocommerce { max-width:1000px } */
body.woocommerce-checkout main .woocommerce,
body.woocommerce-checkout .wp-block-post-title,
body.woocommerce-checkout .wp-block-woocommerce-checkout,
body.woocommerce-checkout .wp-block-woocommerce-checkout.alignwide,
body.woocommerce-checkout .wc-block-checkout {
	max-width: none !important;
	width: 100% !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

/* If the main ever ends up wrapped in a constrained-layout group,
   don't let it auto-center its children. */
.cgbd-checkout-main.is-layout-constrained > :where(:not(.alignleft):not(.alignright)),
.cgbd-checkout-main.is-layout-constrained > .alignwide,
.cgbd-checkout-main.is-layout-constrained > .alignfull {
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

.cgbd-checkout-header {
	margin-bottom: 28px;
	padding-bottom: 20px;
	border-bottom: 1px solid var(--cgbd-outline-variant);
	align-items: center !important;
	width: 100%;
}
.cgbd-checkout-title {
	font-size: 26px !important;
	font-weight: 800 !important;
	color: var(--cgbd-navy-md) !important;
	margin: 0 !important;
}
.cgbd-checkout-trust {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	font-weight: 600;
	color: var(--cgbd-on-surface-variant);
	background: rgba(0, 106, 106, 0.06);
	padding: 8px 14px;
	border-radius: var(--cgbd-radius-pill);
}
.cgbd-checkout-trust .material-symbols-outlined {
	font-size: 16px;
	color: var(--cgbd-teal);
}

/* Two-column container override (block checkout) */
.wp-block-woocommerce-checkout.wc-block-checkout {
	gap: 40px !important;
}
@media (min-width: 900px) {
	.wp-block-woocommerce-checkout.wc-block-checkout {
		grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr) !important;
	}
}

/* --- Left column: form steps --- */
.wc-block-components-checkout-step {
	background: var(--cgbd-white) !important;
	border: 1px solid rgba(14, 42, 59, 0.08) !important;
	border-radius: var(--cgbd-radius-md) !important;
	padding: 24px 28px !important;
	margin-bottom: 16px !important;
	box-shadow: var(--cgbd-shadow-card);
}
.wc-block-components-checkout-step::before,
.wc-block-components-checkout-step::after { display: none !important; }

.wc-block-components-checkout-step__title,
.wc-block-components-title.wc-block-components-checkout-step__title {
	font-size: 16px !important;
	font-weight: 700 !important;
	color: var(--cgbd-navy-md) !important;
	margin: 0 0 4px !important;
	font-family: var(--cgbd-font) !important;
}
.wc-block-components-checkout-step__description {
	color: var(--cgbd-on-surface-variant) !important;
	font-size: 13px !important;
	margin-bottom: 16px !important;
}
.wc-block-components-checkout-step__heading {
	margin-bottom: 16px !important;
}
.wc-block-components-checkout-step__heading-content {
	color: var(--cgbd-on-surface-variant) !important;
	font-size: 13px !important;
}
.wc-block-components-checkout-step__heading-content a {
	color: var(--cgbd-teal) !important;
	font-weight: 600 !important;
}

/* Inputs (text, email, tel) */
.wc-block-components-text-input,
.wc-block-components-checkout-step__container .wc-block-components-text-input {
	margin-top: 12px !important;
}
.wc-block-components-text-input input,
.wc-block-components-text-input input.is-active,
.wc-block-components-select select {
	border-radius: var(--cgbd-radius) !important;
	border: 1.5px solid var(--cgbd-outline-variant) !important;
	padding: 18px 14px 8px !important;
	font-family: var(--cgbd-font) !important;
	font-size: 14px !important;
	background: var(--cgbd-white) !important;
	color: var(--cgbd-on-surface) !important;
	min-height: 52px !important;
	transition: border-color 0.15s, box-shadow 0.15s;
}
.wc-block-components-text-input input:focus,
.wc-block-components-select select:focus {
	border-color: var(--cgbd-teal) !important;
	box-shadow: 0 0 0 3px rgba(0, 106, 106, 0.14) !important;
	outline: none !important;
}
.wc-block-components-text-input label,
.wc-block-components-select label {
	color: var(--cgbd-outline) !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	font-family: var(--cgbd-font) !important;
}
.wc-block-components-text-input.is-active label,
.wc-block-components-select.is-active label {
	color: var(--cgbd-teal) !important;
	font-size: 11px !important;
	font-weight: 600 !important;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

/* Checkbox (newsletter opt-in, etc.) */
.wc-block-components-checkbox__input:checked {
	background: var(--cgbd-teal) !important;
	border-color: var(--cgbd-teal) !important;
}
.wc-block-components-checkbox__label {
	font-size: 13px !important;
	color: var(--cgbd-on-surface-variant) !important;
}

/* Radio options (Shipping methods, Payment) */
.wc-block-components-radio-control__option {
	border: 1.5px solid var(--cgbd-outline-variant) !important;
	border-radius: var(--cgbd-radius) !important;
	padding: 14px 16px 14px 48px !important;
	margin: 0 0 10px !important;
	background: var(--cgbd-white) !important;
	transition: border-color 0.15s, background-color 0.15s, box-shadow 0.15s;
	cursor: pointer;
}
.wc-block-components-radio-control__option:hover {
	border-color: var(--cgbd-teal) !important;
}
.wc-block-components-radio-control__option-checked-content,
.wc-block-components-radio-control__option--checked,
.wc-block-components-radio-control__option:has(input:checked) {
	border-color: var(--cgbd-teal) !important;
	background: rgba(0, 106, 106, 0.05) !important;
	box-shadow: 0 0 0 3px rgba(0, 106, 106, 0.10) !important;
}
.wc-block-components-radio-control__option .wc-block-components-radio-control__label {
	font-weight: 600 !important;
	color: var(--cgbd-navy-md) !important;
	font-size: 14px !important;
}
.wc-block-components-radio-control__option .wc-block-components-radio-control__secondary-label {
	color: var(--cgbd-coral) !important;
	font-weight: 700 !important;
}
.wc-block-components-radio-control__option .wc-block-components-radio-control__description {
	font-size: 13px !important;
	color: var(--cgbd-on-surface-variant) !important;
	margin-top: 4px !important;
}
.wc-block-components-radio-control__input {
	left: 16px !important;
	accent-color: var(--cgbd-teal);
}

/* Payment method icons */
.wc-block-components-payment-method-icons {
	margin-top: 8px;
}

/* --- Right column: Order summary --- */
.wp-block-woocommerce-checkout-totals-block {
	background: var(--cgbd-white) !important;
	border: 1px solid rgba(14, 42, 59, 0.08);
	border-radius: var(--cgbd-radius-md) !important;
	padding: 24px !important;
	box-shadow: var(--cgbd-shadow-card);
	position: sticky;
	top: 100px;
}
.wp-block-woocommerce-checkout-order-summary-block {
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
}
.wc-block-components-checkout-order-summary__title-text,
.wc-block-checkout__sidebar .wc-block-components-title {
	font-size: 16px !important;
	font-weight: 700 !important;
	color: var(--cgbd-navy-md) !important;
	margin: 0 0 16px !important;
}

/* Cart items in summary */
.wc-block-components-order-summary-item {
	position: relative;
	padding: 14px 0 14px 36px !important;
	border-bottom: 1px solid rgba(14, 42, 59, 0.06);
	gap: 12px !important;
	align-items: flex-start !important;
}
.wc-block-components-order-summary-item:last-of-type { border-bottom: none; }
.wc-block-components-order-summary-item__image img,
.wc-block-components-order-summary-item__image > div {
	border-radius: var(--cgbd-radius) !important;
	background: var(--cgbd-surface-low) !important;
	width: 56px !important;
	height: 56px !important;
}
/* Hide verbose description - keep summary compact */
.wc-block-components-order-summary-item__description,
.wc-block-components-order-summary-item__description p {
	display: none !important;
}
.wc-block-components-order-summary-item__quantity {
	font-size: 13px !important;
	color: var(--cgbd-on-surface-variant) !important;
}
.wc-block-components-product-name {
	font-weight: 600 !important;
	color: var(--cgbd-navy-md) !important;
	font-size: 14px !important;
	line-height: 1.35 !important;
}
.wc-block-components-product-price__value,
.wc-block-components-order-summary-item__total-price {
	color: var(--cgbd-navy-md) !important;
	font-weight: 700 !important;
	font-size: 14px !important;
}

/* Remove × button (injected via JS) */
.cgbd-remove-item {
	position: absolute;
	left: 0;
	top: 22px;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: rgba(14, 42, 59, 0.06);
	border: none;
	color: var(--cgbd-on-surface-variant);
	font-size: 14px;
	line-height: 1;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	transition: background-color 0.15s, color 0.15s, transform 0.1s;
}
.cgbd-remove-item:hover {
	background: rgba(255, 111, 97, 0.16);
	color: var(--cgbd-coral);
	transform: scale(1.08);
}
.cgbd-remove-item:focus-visible {
	outline: 2px solid var(--cgbd-teal);
	outline-offset: 2px;
}
.cgbd-remove-item[disabled] {
	opacity: 0.5;
	cursor: wait;
}
.cgbd-remove-item span { pointer-events: none; }

/* Coupon / discount input */
.wc-block-components-totals-coupon {
	padding: 16px 0 !important;
	border-bottom: 1px solid rgba(14, 42, 59, 0.06);
}
.wc-block-components-totals-coupon-link {
	color: var(--cgbd-teal) !important;
	font-weight: 600 !important;
	font-size: 14px !important;
}
.wc-block-components-totals-coupon__form {
	gap: 8px !important;
}
.wc-block-components-totals-coupon__form .wc-block-components-text-input input {
	min-height: 44px !important;
	padding: 12px 14px !important;
}
.wc-block-components-totals-coupon__button {
	background: var(--cgbd-navy-md) !important;
	color: var(--cgbd-white) !important;
	border-radius: var(--cgbd-radius) !important;
	border: none !important;
	font-weight: 600 !important;
	padding: 0 18px !important;
}

/* Totals rows */
.wc-block-components-totals-item {
	padding: 8px 0 !important;
	font-size: 14px !important;
}
.wc-block-components-totals-item__label {
	color: var(--cgbd-on-surface-variant) !important;
	font-weight: 500 !important;
}
.wc-block-components-totals-item__value {
	color: var(--cgbd-navy-md) !important;
	font-weight: 600 !important;
}
.wc-block-components-totals-footer-item {
	border-top: 1px solid rgba(14, 42, 59, 0.10) !important;
	margin-top: 8px !important;
	padding-top: 14px !important;
}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
	font-size: 18px !important;
	font-weight: 800 !important;
	color: var(--cgbd-navy-md) !important;
}

/* Place Order button */
.wc-block-components-checkout-place-order-button,
.wc-block-components-button.wc-block-components-checkout-place-order-button {
	background-color: var(--cgbd-coral) !important;
	color: var(--cgbd-white) !important;
	width: 100% !important;
	min-height: 54px !important;
	padding: 16px 24px !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	border-radius: var(--cgbd-radius-pill) !important;
	border: none !important;
	box-shadow: 0 4px 14px rgba(255, 111, 97, 0.30) !important;
	transition: background-color 0.15s, transform 0.05s, box-shadow 0.15s !important;
	margin-top: 16px !important;
	letter-spacing: 0.01em;
}
.wc-block-components-checkout-place-order-button:hover {
	background-color: var(--cgbd-coral-dark) !important;
	box-shadow: 0 6px 18px rgba(255, 111, 97, 0.40) !important;
}
.wc-block-components-checkout-place-order-button:active {
	transform: translateY(1px);
}

/* Trust badges below Place Order (CSS-only) */
.wp-block-woocommerce-checkout-totals-block::after {
	content: "🔒  SECURE      🚚  FAST DELIVERY      ↩  RETURNS";
	display: block;
	text-align: center;
	margin-top: 16px;
	padding-top: 16px;
	border-top: 1px dashed rgba(14, 42, 59, 0.15);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.05em;
	color: var(--cgbd-on-surface-variant);
	white-space: pre;
}

/* Hide loader / placeholder skeleton once mounted */
.wp-block-woocommerce-checkout.is-loading {
	min-height: 600px;
}

/* Mobile */
@media (max-width: 899px) {
	.wp-block-woocommerce-checkout-totals-block {
		position: static;
		margin-top: 16px;
	}
	.cgbd-checkout-header {
		flex-direction: column;
		align-items: flex-start !important;
		gap: 8px;
	}
	.wc-block-components-checkout-step {
		padding: 20px !important;
	}
}

/* Order-summary card mobile padding — labels/values were touching the card edge.
   WC's mobile sidebar resets our padding via a more specific rule, so re-apply
   with `body.woocommerce-checkout` to win on specificity. */
@media (max-width: 768px) {
	body.woocommerce-checkout .wp-block-woocommerce-checkout-totals-block,
	body.woocommerce-page .wp-block-woocommerce-checkout-totals-block,
	body.woocommerce-cart .wp-block-woocommerce-cart-totals-block {
		padding: 18px 16px !important;
		border-radius: var(--cgbd-radius-md) !important;
	}
	body.woocommerce-checkout .wc-block-components-totals-item,
	body.woocommerce-page .wc-block-components-totals-item,
	body.woocommerce-cart .wc-block-components-totals-item {
		padding-left: 4px !important;
		padding-right: 4px !important;
	}
	body.woocommerce-checkout .wc-block-components-totals-coupon,
	body.woocommerce-page .wc-block-components-totals-coupon,
	body.woocommerce-cart .wc-block-components-totals-coupon {
		padding-left: 4px !important;
		padding-right: 4px !important;
	}
	body.woocommerce-checkout .wc-block-components-totals-coupon-link,
	body.woocommerce-page .wc-block-components-totals-coupon-link {
		padding-left: 0 !important;
	}
}