/* ==========================================================================
   Voice of Akash — WooCommerce

   The Modern theme does not declare WooCommerce support, so WooCommerce
   renders shop, category and product views inside the page content
   ("theme compatibility" mode). All rules are scoped to WooCommerce markup:
   .woocommerce, .woocommerce-page, .single-product, .woocommerce-cart,
   .woocommerce-checkout, .wp-block-woocommerce-*, .wc-block-components-*.

   Never styled here: payment gateway iframes (PayPal, Stripe), cart
   fragments, coupon/shipping/variation logic. No entrance animation on
   cart or checkout (interactions.js skips those pages).

   Contents
   1.  Product grid (shop, categories, homepage, related products)
   2.  Product card
   3.  Shop archive header, result count, ordering
   4.  Single product layout
   5.  Variations, quantity, add to cart
   6.  Product meta, tabs, related products
   7.  Notices
   8.  Buttons (WooCommerce classic + Blocks)
   9.  Cart — classic and Blocks
   10. Checkout — classic and Blocks
   11. Express payment and gateway wrappers
   12. My account
   ========================================================================== */


/* 1. Product grid
   WooCommerce floats products with % widths; replaced by CSS Grid using the
   shortcode/archive column count (columns-N) as the desktop maximum.
   ========================================================================== */

.woocommerce ul.products,
.woocommerce-page ul.products {
	--voa-cols: 4;
	display: grid;
	grid-template-columns: repeat(var(--voa-cols), minmax(0, 1fr));
	gap: var(--voa-space-xl) var(--voa-space-lg);
	margin: 0 0 var(--voa-space-xl);
	padding: 0;
	list-style: none;
}

/* WooCommerce clearfix pseudo-elements would become grid cells. */
.woocommerce ul.products::before,
.woocommerce ul.products::after,
.woocommerce-page ul.products::before,
.woocommerce-page ul.products::after {
	content: none;
	display: none;
}

.woocommerce ul.products.columns-2 { --voa-cols: 2; }
.woocommerce ul.products.columns-3 { --voa-cols: 3; }
.woocommerce ul.products.columns-5 { --voa-cols: 5; }
.woocommerce ul.products.columns-6 { --voa-cols: 6; }

/* Homepage shop section: full width, so 4 across on desktop. */
.voa-home-layout .woocommerce ul.products {
	--voa-cols: 4;
}

@media (max-width: 63.9375em) {
	.woocommerce ul.products,
	.woocommerce-page ul.products,
	.voa-home-layout .woocommerce ul.products {
		--voa-cols: 3;
	}

	.woocommerce ul.products.columns-2 {
		--voa-cols: 2;
	}
}

@media (max-width: 47.9375em) {
	.woocommerce ul.products,
	.woocommerce-page ul.products,
	.voa-home-layout .woocommerce ul.products {
		--voa-cols: 2;
		gap: var(--voa-space-lg) var(--voa-space-md);
	}
}

@media (max-width: 47.9375em) {
	.woocommerce ul.products[class] li.product .woocommerce-loop-product__title {
		font-size: 1.0625rem;
	}

	.woocommerce ul.products[class] li.product .price {
		font-size: 0.875rem;
	}

	.woocommerce ul.products[class] li.product .button {
		align-self: stretch;
		padding-left: 0.5rem;
		padding-right: 0.5rem;
	}
}

@media (max-width: 22.4375em) {
	.woocommerce ul.products,
	.woocommerce-page ul.products,
	.voa-home-layout .woocommerce ul.products {
		--voa-cols: 1;
	}
}


/* 2. Product card: imagery first, no box, no shadow.
   ========================================================================== */

/* [class] raises specificity above WooCommerce's `ul.products.columns-N li.product` widths. */
.woocommerce ul.products[class] li.product,
.woocommerce-page ul.products[class] li.product {
	position: relative;
	display: flex;
	flex-direction: column;
	width: auto;
	margin: 0;
	padding: 0;
	float: none;
	clear: none;
	background: transparent;
	box-shadow: none;
	text-align: left;
}

.woocommerce ul.products li.product .woocommerce-loop-product__link {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	color: var(--voa-charcoal);
	text-decoration: none;
}

/* Image: square crop, reserved space (no layout shift), subtle hover. */
.woocommerce ul.products li.product a img,
.woocommerce ul.products li.product .attachment-woocommerce_thumbnail {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	margin: 0 0 var(--voa-space-sm);
	object-fit: cover;
	background: var(--voa-cream);
	box-shadow: none;
	transition: transform var(--voa-transition-slow), filter var(--voa-transition-slow);
}

/* Clips the 1.02 image scale to the card edges. */
.woocommerce ul.products li.product .woocommerce-loop-product__link {
	overflow: hidden;
}

.woocommerce ul.products li.product .woocommerce-loop-product__link:hover img,
.woocommerce ul.products li.product .woocommerce-loop-product__link:focus-visible img {
	transform: scale(1.02);
	filter: contrast(1.04);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3 {
	margin: 0 0 0.35rem;
	padding: 0;
	color: var(--voa-ink);
	font-family: var(--voa-font-serif);
	font-size: 1.25rem;
	font-weight: 500;
	line-height: 1.25;
	letter-spacing: -0.005em;
	transition: color var(--voa-transition-fast), transform var(--voa-transition);
}

.woocommerce ul.products li.product .woocommerce-loop-product__link:hover .woocommerce-loop-product__title {
	color: var(--voa-forest);
	transform: translateX(2px);
}

/* Price: restrained sans; sale price clear, original price muted + struck. */
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
	display: block;
	margin: 0 0 var(--voa-space-sm);
	color: var(--voa-charcoal);
	font-family: var(--voa-font-sans);
	font-size: 0.9375rem;
	font-weight: 600;
	letter-spacing: 0.01em;
}

.woocommerce ul.products li.product .price del,
.woocommerce div.product p.price del,
.woocommerce div.product span.price del {
	margin-right: 0.4em;
	color: var(--voa-muted);
	font-weight: 400;
	opacity: 1;
	text-decoration-color: var(--voa-muted);
}

.woocommerce ul.products li.product .price ins,
.woocommerce div.product p.price ins,
.woocommerce div.product span.price ins {
	color: var(--voa-ink);
	font-weight: 650;
	text-decoration: none;
}

/* Sale label: quiet text label, not a round badge. */
.woocommerce span.onsale,
.woocommerce ul.products li.product .onsale {
	position: absolute;
	top: 0.75rem;
	left: 0.75rem;
	right: auto;
	z-index: 2;
	min-width: 0;
	min-height: 0;
	margin: 0;
	padding: 0.3rem 0.6rem;
	border-radius: var(--voa-radius);
	background: var(--voa-paper);
	color: var(--voa-brass-text);
	font-family: var(--voa-font-sans);
	font-size: 0.6875rem;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: var(--voa-tracking-label);
	text-transform: uppercase;
}

/* Add to cart in the loop: always visible (touch + keyboard), secondary style. */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .added_to_cart {
	align-self: flex-start;
	margin-top: auto;
}

/* WooCommerce sets `display: inline-block; line-height: 1` here, which left the
   label sitting high in the 44px button. Flex centring fixes it at any height. */
.woocommerce ul.products li.product .button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1.2;
	text-align: center;
	min-height: 2.75rem;
	padding: 0.6rem 1.1rem;
	border: 1px solid var(--voa-line-strong);
	background: transparent;
	color: var(--voa-ink);
	font-size: 0.75rem;
}

.woocommerce ul.products li.product .button:hover,
.woocommerce ul.products li.product .button:focus-visible {
	border-color: var(--voa-ink);
	background: var(--voa-ink);
	color: var(--voa-paper);
}

.woocommerce ul.products li.product .button.loading {
	opacity: 0.6;
}

.woocommerce ul.products li.product .button.added::after {
	margin-left: 0.4em;
}

.woocommerce ul.products li.product .added_to_cart {
	display: inline-flex;
	align-items: center;
	min-height: 2.75rem;
	margin-top: 0.25rem;
	color: var(--voa-forest);
	font-size: var(--voa-text-small);
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 0.25em;
}

/* Product category tiles (if categories are shown in a grid). */
.woocommerce ul.products li.product-category a {
	color: var(--voa-ink);
	text-decoration: none;
}

.woocommerce ul.products li.product-category .woocommerce-loop-category__title mark {
	background: none;
	color: var(--voa-muted);
	font-family: var(--voa-font-sans);
	font-size: 0.8125rem;
}


/* 3. Shop archive header, result count, ordering
   ========================================================================== */

.woocommerce-page.archive .page-title,
.woocommerce-shop .entry-title,
.woocommerce-products-header__title {
	font-family: var(--voa-font-serif);
	font-size: var(--voa-h1);
	font-weight: 500;
}

.woocommerce-page .term-description,
.woocommerce-page .page-description {
	max-width: var(--voa-reading-max);
	color: var(--voa-muted);
}

/* The parent limits singular content to a ~735px reading column; shop,
   product, cart, checkout and account pages use the full content width. */
.woocommerce-page .site-main > .entry > .entry-content-container,
.woocommerce .site-main > .entry > .entry-content-container,
.woocommerce-cart .site-main > .entry > .entry-content-container,
.woocommerce-checkout .site-main > .entry > .entry-content-container,
.woocommerce-account .site-main > .entry > .entry-content-container,
.woocommerce-page .site-main > .entry .entry-content,
.woocommerce .site-main > .entry .entry-content {
	width: 100%;
	max-width: none;
}

.woocommerce .woocommerce-result-count {
	float: left;
	margin: 0 0 var(--voa-space-lg);
	color: var(--voa-muted);
	font-size: var(--voa-text-small);
	line-height: var(--voa-control-h);
}

.woocommerce .woocommerce-ordering {
	float: right;
	margin: 0 0 var(--voa-space-lg);
}

.woocommerce .woocommerce-ordering select {
	min-width: 14rem;
	padding-right: 2.25rem;
	font-size: var(--voa-text-small);
}

.woocommerce .woocommerce-ordering + ul.products,
.woocommerce .woocommerce-result-count + .woocommerce-ordering + ul.products {
	clear: both;
}

@media (max-width: 41.9375em) {
	.woocommerce .woocommerce-result-count,
	.woocommerce .woocommerce-ordering {
		float: none;
		margin-bottom: var(--voa-space-sm);
	}

	.woocommerce .woocommerce-ordering select {
		width: 100%;
	}
}


/* 4. Single product layout
   Gallery and summary in balanced columns; tabs and related products below.
   ========================================================================== */

/* The parent prints the featured image above the article as well; WooCommerce
   shows the same image in the gallery. Hide the duplicate on product pages only. */
.single-product .site-main > .entry.product > .entry-media {
	display: none;
}

/* The parent also prints the post excerpt above the content; for products the
   excerpt IS the WooCommerce short description, already shown in the summary.
   Only the parent's copy (a direct child of .entry-content) is hidden. */
.single-product .site-main > .entry.product .entry-content > .entry-summary {
	display: none;
}

.single-product .site-main > .entry > .entry-content-container > .entry-header {
	max-width: var(--voa-content-max);
	margin-bottom: var(--voa-space-lg);
}

.single-product .site-main > .entry .entry-title {
	max-width: 22ch;
	font-size: clamp(2.25rem, 1.6rem + 1.8vw, 3.5rem);
}

@media (min-width: 55em) {
	.woocommerce div.product {
		display: grid;
		grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
		gap: 0 clamp(2.5rem, 5vw, 5rem);
		align-items: start;
	}

	.woocommerce div.product > * {
		grid-column: 1 / -1;
	}

	.woocommerce div.product > div.images,
	.woocommerce div.product > .woocommerce-product-gallery {
		grid-column: 1;
		grid-row: 1;
	}

	.woocommerce div.product > div.summary {
		grid-column: 2;
		grid-row: 1;
		position: sticky;
		top: calc(var(--voa-nav-h) + var(--voa-space-lg));
	}
}

/* #content matches WooCommerce's own `.woocommerce #content div.product div.images { width: 48% }`. */
.woocommerce #content div.product div.images,
.woocommerce #content div.product div.summary,
.woocommerce div.product div.images,
.woocommerce div.product div.summary {
	float: none;
	width: 100%;
	margin-bottom: var(--voa-space-xl);
}

/* Gallery */
.woocommerce div.product div.images img {
	background: var(--voa-cream);
}

.woocommerce div.product div.images .flex-control-thumbs {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--voa-space-sm);
	margin: var(--voa-space-sm) 0 0;
}

.woocommerce div.product div.images .flex-control-thumbs li {
	width: auto;
	float: none;
	margin: 0;
}

.woocommerce div.product div.images .flex-control-thumbs li img {
	opacity: 0.6;
	border: 1px solid transparent;
	transition: opacity var(--voa-transition), border-color var(--voa-transition);
}

.woocommerce div.product div.images .flex-control-thumbs li img:hover,
.woocommerce div.product div.images .flex-control-thumbs li img.flex-active {
	opacity: 1;
	border-color: var(--voa-brass);
}

.woocommerce div.product div.images .woocommerce-product-gallery__trigger {
	border-radius: var(--voa-radius);
	background: var(--voa-paper);
}

/* Summary */
.woocommerce div.product div.summary p.price,
.woocommerce div.product div.summary span.price {
	margin-bottom: var(--voa-space-md);
	font-size: 1.25rem;
}

.woocommerce div.product .woocommerce-product-details__short-description {
	margin-bottom: var(--voa-space-lg);
	color: var(--voa-charcoal);
	font-size: 1.0625rem;
	line-height: 1.7;
}

.woocommerce div.product .stock {
	color: var(--voa-forest);
	font-size: var(--voa-text-small);
	font-weight: 600;
}

.woocommerce div.product .stock.out-of-stock {
	color: var(--voa-error);
}

/* Single-product sale label sits on the gallery. */
.woocommerce div.product > span.onsale {
	top: 1rem;
	left: 1rem;
}

.woocommerce div.product {
	position: relative;
}


/* 5. Variations, quantity, add to cart
   Labels sit above fields at every size; the stacking is scoped to the
   variation form table only (not every WooCommerce table).
   ========================================================================== */

.woocommerce div.product form.cart {
	margin: 0 0 var(--voa-space-lg);
}

.woocommerce div.product form.cart .variations,
.woocommerce div.product form.cart .variations tbody,
.woocommerce div.product form.cart .variations tr,
.woocommerce div.product form.cart .variations th,
.woocommerce div.product form.cart .variations td {
	display: block;
	width: 100%;
	max-width: 100%;
	padding: 0;
	border: 0;
	text-align: left;
}

.woocommerce div.product form.cart .variations {
	margin: 0 0 var(--voa-space-md);
	table-layout: fixed;
}

.woocommerce div.product form.cart .variations tr {
	margin-bottom: var(--voa-space-md);
}

.woocommerce div.product form.cart .variations th.label {
	margin-bottom: 0.4rem;
	line-height: 1.4;
}

.woocommerce div.product form.cart .variations label {
	color: var(--voa-ink);
	font-size: var(--voa-text-label);
	font-weight: 600;
	letter-spacing: var(--voa-tracking-label);
	text-transform: uppercase;
}

.woocommerce div.product form.cart .variations select {
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	margin: 0;
	padding-right: 2.5rem;
	cursor: pointer;
}

.woocommerce div.product form.cart .variations .select2-container {
	width: 100% !important; /* Select2 writes an inline pixel width */
	max-width: 100%;
}

.woocommerce div.product form.cart .reset_variations {
	display: inline-flex;
	align-items: center;
	min-height: 2.75rem;
	margin-top: 0.25rem;
	color: var(--voa-muted);
	font-size: var(--voa-text-small);
	text-decoration: underline;
	text-underline-offset: 0.25em;
}

.woocommerce div.product form.cart .single_variation_wrap .woocommerce-variation {
	margin-bottom: var(--voa-space-md);
}

.woocommerce div.product form.cart .woocommerce-variation-price .price {
	font-size: 1.25rem;
}

/* Quantity + add to cart on one row; wraps cleanly on narrow screens. */
.woocommerce div.product form.cart:not(.variations_form),
.woocommerce div.product form.cart .woocommerce-variation-add-to-cart {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	gap: var(--voa-space-sm);
	max-width: 100%;
}

.woocommerce div.product form.cart::before,
.woocommerce div.product form.cart::after,
.woocommerce div.product form.cart .woocommerce-variation-add-to-cart::before,
.woocommerce div.product form.cart .woocommerce-variation-add-to-cart::after {
	display: none;
}

.woocommerce .quantity .qty {
	width: 5rem;
	min-height: var(--voa-control-h);
	padding: 0.5rem;
	text-align: center;
}

.woocommerce div.product form.cart div.quantity {
	float: none;
	margin: 0;
}

.woocommerce div.product form.cart .button,
.woocommerce div.product form.cart .single_add_to_cart_button {
	flex: 1 1 12rem;
	float: none;
	min-height: var(--voa-control-h);
	margin: 0;
}

.woocommerce div.product form.cart .single_add_to_cart_button.disabled,
.woocommerce div.product form.cart .single_add_to_cart_button:disabled {
	opacity: 1;
	background: var(--voa-cream);
	border-color: var(--voa-line-strong);
	color: var(--voa-muted);
}

/* Grouped products table: keep table layout. */
.woocommerce div.product form.cart.grouped_form {
	display: block;
}


/* 6. Product meta, tabs, related products
   ========================================================================== */

/* Product meta stays visible (categories and tags help discovery).
   Only the SKU line is hidden, when "Hide the SKU line" is on (body class). */
.woocommerce div.product .product_meta {
	padding-top: var(--voa-space-md);
	border-top: 1px solid var(--voa-line);
	color: var(--voa-muted);
	font-size: var(--voa-text-small);
	line-height: 1.8;
}

.woocommerce div.product .product_meta > span {
	display: block;
}

.woocommerce div.product .product_meta a {
	color: var(--voa-ink);
	text-decoration: underline;
	text-decoration-color: var(--voa-brass);
	text-underline-offset: 0.25em;
}

.woocommerce div.product .product_meta a:hover {
	color: var(--voa-forest);
}

body.voa-hide-sku div.product .product_meta > span.sku_wrapper {
	display: none;
}

/* Tabs: underline style. */
.woocommerce div.product .woocommerce-tabs {
	margin-top: var(--voa-space-lg);
	padding-top: var(--voa-space-lg);
	border-top: 1px solid var(--voa-line);
}

.woocommerce div.product .woocommerce-tabs ul.tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 0 var(--voa-space-lg);
	margin: 0 0 var(--voa-space-lg);
	padding: 0;
	border-bottom: 1px solid var(--voa-line);
	overflow: visible;
}

.woocommerce div.product .woocommerce-tabs ul.tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs::after,
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after {
	display: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	display: inline-flex;
	align-items: center;
	min-height: 2.75rem;
	padding: 0.5rem 0;
	border-bottom: 2px solid transparent;
	margin-bottom: -1px;
	color: var(--voa-muted);
	font-size: var(--voa-text-label);
	font-weight: 600;
	letter-spacing: var(--voa-tracking-label);
	text-transform: uppercase;
	transition: color var(--voa-transition-fast), border-color var(--voa-transition-fast);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover {
	color: var(--voa-ink);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
	border-bottom-color: var(--voa-brass);
	color: var(--voa-ink);
}

.woocommerce div.product .woocommerce-tabs .panel {
	max-width: var(--voa-reading-max);
	margin: 0;
	font-size: 1.0625rem;
	line-height: 1.75;
}

.woocommerce div.product .woocommerce-tabs .panel > h2:first-child {
	font-size: var(--voa-h3);
}

/* Reviews */
.woocommerce #reviews #comments ol.commentlist li .comment-text {
	border: 1px solid var(--voa-line);
	border-radius: var(--voa-radius);
}

.woocommerce .star-rating span::before,
.woocommerce p.stars a {
	color: var(--voa-brass);
}

/* Related / upsells */
.woocommerce div.product .related,
.woocommerce div.product .upsells {
	margin-top: var(--voa-space-xl);
	padding-top: var(--voa-space-xl);
	border-top: 1px solid var(--voa-line);
}

.woocommerce div.product .related > h2,
.woocommerce div.product .upsells > h2 {
	margin-bottom: var(--voa-space-lg);
	font-size: var(--voa-h2);
}


/* 7. Notices (classic + Blocks): high contrast, icon + text, no motion.
   ========================================================================== */

.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-noreviews,
p.no-comments {
	margin: 0 0 var(--voa-space-lg);
	padding: 1rem 1.25rem 1rem 3rem;
	border: 1px solid var(--voa-line-strong);
	border-left-width: 3px;
	border-radius: var(--voa-radius);
	background: var(--voa-white);
	color: var(--voa-charcoal);
	font-size: 0.9375rem;
}

.woocommerce-message {
	border-left-color: var(--voa-forest);
}

.woocommerce-info {
	border-left-color: var(--voa-brass);
}

.woocommerce-error {
	border-left-color: var(--voa-error);
	color: var(--voa-ink);
}

.woocommerce-message::before { color: var(--voa-forest); }
.woocommerce-info::before { color: var(--voa-brass); }
.woocommerce-error::before { color: var(--voa-error); }

.woocommerce-message .button,
.woocommerce-info .button,
.woocommerce-error .button {
	float: right;
	min-height: 2.5rem;
	margin-left: var(--voa-space-sm);
	padding: 0.5rem 1rem;
	font-size: 0.75rem;
}

.wc-block-components-notice-banner {
	border-radius: var(--voa-radius);
	font-size: 0.9375rem;
}

.wc-block-components-notice-banner.is-error {
	border-color: var(--voa-error);
}

/* Field validation messages: colour plus text (not colour only). */
.woocommerce form .form-row.woocommerce-invalid input.input-text,
.woocommerce form .form-row.woocommerce-invalid select,
.wc-block-components-text-input.has-error input,
.wc-block-components-validation-error {
	border-color: var(--voa-error);
}

.wc-block-components-validation-error,
.woocommerce-error li,
.checkout-inline-error-message {
	color: var(--voa-error);
	font-weight: 600;
}


/* 8. Buttons (WooCommerce classic + Blocks)
   ========================================================================== */

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.wc-block-components-button:not(.is-link),
.wp-block-woocommerce-cart .wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: var(--voa-control-h);
	padding: 0.75rem 1.75rem;
	border: 1px solid var(--voa-ink);
	border-radius: var(--voa-radius);
	background: var(--voa-ink);
	color: var(--voa-paper);
	font-family: var(--voa-font-sans);
	font-size: 0.8125rem;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	text-decoration: none;
	box-shadow: none;
	transition:
		background-color var(--voa-transition),
		border-color var(--voa-transition),
		color var(--voa-transition);
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.wc-block-components-button:not(.is-link):hover,
.wp-block-woocommerce-cart .wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover {
	border-color: var(--voa-forest);
	background: var(--voa-forest);
	color: var(--voa-paper);
}

/* WooCommerce's default "alt" purple is replaced by the ink primary. */
.woocommerce a.button.alt.disabled,
.woocommerce button.button.alt.disabled,
.woocommerce button.button:disabled,
.woocommerce button.button:disabled[disabled],
.wc-block-components-button:disabled {
	border-color: var(--voa-line-strong);
	background: var(--voa-cream);
	color: var(--voa-muted);
	opacity: 1;
	cursor: not-allowed;
}

.wc-block-components-button:not(.is-link) .wc-block-components-button__text {
	color: inherit;
}


/* 9. Cart — classic and Blocks
   Calm hairline dividers, strong totals hierarchy, primary checkout action.
   ========================================================================== */

/* Classic cart */
.woocommerce-cart table.shop_table,
.woocommerce table.shop_table {
	margin: 0 0 var(--voa-space-lg);
	border: 0;
	border-top: 1px solid var(--voa-line-strong);
	border-radius: var(--voa-radius);
	border-collapse: collapse;
}

.woocommerce table.shop_table th {
	padding: 0.9rem 0.75rem;
	color: var(--voa-muted);
	font-size: var(--voa-text-label);
	font-weight: 600;
	letter-spacing: var(--voa-tracking-label);
	text-transform: uppercase;
}

.woocommerce table.shop_table td {
	padding: 1.1rem 0.75rem;
	border-top: 1px solid var(--voa-line);
}

.woocommerce table.shop_table td.product-name a {
	color: var(--voa-ink);
	font-family: var(--voa-font-serif);
	font-size: 1.125rem;
	text-decoration: none;
}

.woocommerce-cart table.cart img {
	width: 5rem;
	background: var(--voa-cream);
}

.woocommerce a.remove {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	border-radius: 0;
	color: var(--voa-muted) !important; /* WooCommerce sets red with !important */
	font-size: 1.25rem;
}

.woocommerce a.remove:hover {
	background: var(--voa-cream);
	color: var(--voa-error) !important;
}

.woocommerce-cart table.cart td.actions .coupon {
	display: flex;
	flex-wrap: wrap;
	gap: var(--voa-space-xs);
}

.woocommerce-cart table.cart td.actions .coupon .input-text {
	min-width: 12rem;
	min-height: var(--voa-control-h);
}

.woocommerce .cart-collaterals .cart_totals h2,
.wc-block-cart .wc-block-cart__totals-title {
	font-family: var(--voa-font-serif);
	font-size: var(--voa-h3);
	font-weight: 500;
	text-transform: none;
	letter-spacing: 0;
}

.woocommerce .cart_totals .order-total th,
.woocommerce .cart_totals .order-total td {
	color: var(--voa-ink);
	font-size: 1.125rem;
	font-weight: 700;
}

.woocommerce .wc-proceed-to-checkout a.checkout-button {
	width: 100%;
	font-size: 0.875rem;
}

/* Blocks cart */
.wp-block-woocommerce-cart {
	color: var(--voa-charcoal);
	font-family: var(--voa-font-sans);
}

.wc-block-cart-items,
.wc-block-cart-items__row,
.wc-block-components-totals-wrapper,
.wc-block-components-order-summary-item {
	border-color: var(--voa-line) !important; /* Blocks uses hard-coded rgba borders */
}

.wc-block-cart-items .wc-block-cart-items__header {
	color: var(--voa-muted);
	font-size: var(--voa-text-label);
	letter-spacing: var(--voa-tracking-label);
}

.wc-block-components-product-name {
	color: var(--voa-ink);
	font-family: var(--voa-font-serif);
	font-size: 1.125rem;
	text-decoration: none;
}

.wc-block-cart-item__image img {
	background: var(--voa-cream);
}

.wc-block-components-quantity-selector {
	border-radius: var(--voa-radius);
}

.wc-block-components-quantity-selector::after {
	border-color: var(--voa-line-strong) !important;
	border-radius: var(--voa-radius) !important;
}

.wc-block-components-quantity-selector .wc-block-components-quantity-selector__button {
	min-width: 2.75rem;
	min-height: 2.75rem;
	color: var(--voa-ink);
}

.wc-block-cart-item__remove-link {
	min-height: 2.75rem;
	color: var(--voa-muted) !important;
	font-size: var(--voa-text-small) !important;
	text-decoration: underline !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 {
	color: var(--voa-ink);
	font-size: 1.125rem;
	font-weight: 700;
}

.wc-block-cart__submit-container .wc-block-cart__submit-button {
	width: 100%;
	font-size: 0.875rem;
}

.wc-block-components-sidebar-layout .wc-block-components-sidebar {
	padding-left: var(--voa-space-lg);
}

.wc-block-components-panel__button,
.wc-block-components-totals-coupon-link {
	color: var(--voa-ink);
	font-weight: 600;
}


/* 10. Checkout — classic and Blocks
   One consistent 1px full-border field system (see global.css), visible
   labels, strong focus ring, high-contrast validation.
   No entrance animation anywhere in checkout.
   ========================================================================== */

/* Classic checkout */
.woocommerce-checkout h3,
#order_review_heading {
	margin: var(--voa-space-lg) 0 var(--voa-space-md);
	font-family: var(--voa-font-serif);
	font-size: var(--voa-h3);
	font-weight: 500;
}

.woocommerce form .form-row {
	margin: 0 0 var(--voa-space-md);
	padding: 0;
}

.woocommerce form .form-row label {
	display: block;
	margin-bottom: 0.35rem;
	color: var(--voa-ink);
	font-size: var(--voa-text-small);
	font-weight: 600;
	line-height: 1.4;
}

.woocommerce form .form-row .input-text,
.woocommerce form .form-row select,
.woocommerce-page form .form-row .input-text {
	width: 100%;
	min-height: var(--voa-control-h);
}

.woocommerce form .form-row .required {
	color: var(--voa-error);
	text-decoration: none;
}

/* "(optional)" stays visible and readable, just quieter.
   (The legacy Additional CSS hid every .optional label.) */
.woocommerce form .form-row .optional,
.wc-block-components-form .optional {
	color: var(--voa-muted);
	font-weight: 400;
}

.select2-container .select2-selection--single {
	height: var(--voa-control-h);
	border: 1px solid var(--voa-line-strong);
	border-radius: var(--voa-radius);
	background: var(--voa-white);
}

.select2-container .select2-selection--single .select2-selection__rendered {
	padding-left: 0.9rem;
	line-height: calc(var(--voa-control-h) - 2px);
	color: var(--voa-charcoal);
}

.select2-container .select2-selection--single .select2-selection__arrow {
	height: calc(var(--voa-control-h) - 2px);
}

.select2-container--focus .select2-selection--single,
.select2-container--open .select2-selection--single {
	border-color: var(--voa-forest);
	outline: 2px solid var(--voa-forest);
}

.select2-dropdown {
	border-color: var(--voa-line-strong);
	border-radius: var(--voa-radius);
}

.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted[data-selected] {
	background: var(--voa-forest);
	color: var(--voa-paper);
}

.woocommerce-checkout-review-order-table {
	font-size: 0.9375rem;
}

.woocommerce-checkout #payment {
	border-radius: var(--voa-radius);
	background: var(--voa-cream);
}

.woocommerce-checkout #payment ul.payment_methods {
	border-bottom-color: var(--voa-line);
}

.woocommerce-checkout #payment div.payment_box {
	border-radius: var(--voa-radius);
	background: var(--voa-paper);
	color: var(--voa-charcoal);
}

.woocommerce-checkout #payment div.payment_box::before {
	border-bottom-color: var(--voa-paper);
}

.woocommerce #payment #place_order,
.woocommerce-page #payment #place_order {
	width: 100%;
	min-height: 3.25rem;
	font-size: 0.875rem;
}

/* Blocks checkout */
.wp-block-woocommerce-checkout {
	color: var(--voa-charcoal);
	font-family: var(--voa-font-sans);
}

.wc-block-components-checkout-step__title,
.wc-block-components-title.wc-block-components-title {
	color: var(--voa-ink);
	font-family: var(--voa-font-serif);
	font-size: var(--voa-h3);
	font-weight: 500;
	letter-spacing: 0;
	text-transform: none;
}

.wc-block-components-checkout-step__description {
	color: var(--voa-muted);
}

.wc-block-components-text-input input[type],
.wc-block-components-text-input textarea,
.wc-block-components-combobox .wc-block-components-combobox-control input.components-combobox-control__input,
.wc-block-components-select-input select,
.wc-blocks-components-select .wc-blocks-components-select__select {
	border: 1px solid var(--voa-line-strong);
	border-radius: var(--voa-radius);
	background-color: var(--voa-white);
	color: var(--voa-charcoal);
	font-family: var(--voa-font-sans);
}

.wc-blocks-components-select .wc-blocks-components-select__container {
	border-radius: var(--voa-radius);
	background: var(--voa-white);
}

/* Floating labels stay visible (WooCommerce Blocks design). */
.wc-block-components-text-input label,
.wc-blocks-components-select .wc-blocks-components-select__label {
	color: var(--voa-muted);
}

.wc-block-components-text-input input[type]:focus,
.wc-block-components-text-input textarea:focus,
.wc-blocks-components-select .wc-blocks-components-select__select:focus {
	border-color: var(--voa-forest);
	outline: 2px solid var(--voa-forest);
	outline-offset: 0;
	box-shadow: none;
}

.wc-block-components-text-input.has-error input[type] {
	border-color: var(--voa-error);
	outline-color: var(--voa-error);
}

.wc-block-components-radio-control__option,
.wc-block-components-radio-control-accordion-option {
	border-radius: var(--voa-radius);
}

.wc-block-components-radio-control .wc-block-components-radio-control__input:checked {
	border-color: var(--voa-forest);
}

.wc-block-components-radio-control .wc-block-components-radio-control__input:checked::before {
	background: var(--voa-forest);
}

.wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"] {
	border-radius: var(--voa-radius);
	border-color: var(--voa-line-strong);
}

.wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"]:checked {
	background: var(--voa-forest);
	border-color: var(--voa-forest);
}

.wc-block-components-checkbox .wc-block-components-checkbox__mark {
	fill: var(--voa-paper);
}

.wc-block-components-order-summary .wc-block-components-order-summary-item__quantity {
	border-color: var(--voa-paper);
	background: var(--voa-ink);
	color: var(--voa-paper);
	box-shadow: none;
}

/* Place Order: visible, legible, full width, no movement. */
.wc-block-checkout__actions_row .wc-block-components-checkout-place-order-button,
.wc-block-components-checkout-place-order-button {
	min-height: 3.25rem;
	font-size: 0.875rem;
	transform: none;
}

.wc-block-checkout__actions_row .wc-block-components-checkout-return-to-cart-button {
	color: var(--voa-ink);
	font-weight: 600;
}


/* 11. Express payment and gateway wrappers
   Only WooCommerce's own wrappers are styled. Gateway buttons themselves
   (PayPal, Stripe, Apple Pay, Google Pay) render inside iframes controlled
   by the provider and are deliberately left alone.
   ========================================================================== */

.wc-block-components-express-payment {
	margin-bottom: var(--voa-space-lg);
}

.wc-block-components-express-payment--checkout .wc-block-components-express-payment__title-container::before,
.wc-block-components-express-payment--checkout .wc-block-components-express-payment__title-container::after,
.wc-block-components-express-payment--checkout .wc-block-components-express-payment__content {
	border-color: var(--voa-line-strong);
	border-radius: var(--voa-radius);
}

.wc-block-components-express-payment__title {
	color: var(--voa-ink);
	font-family: var(--voa-font-sans);
	font-size: var(--voa-text-label);
	font-weight: 600;
	letter-spacing: var(--voa-tracking-label);
	text-transform: uppercase;
}

.wc-block-components-express-payment__event-buttons,
.wc-block-components-express-payment--cart .wc-block-components-express-payment__event-buttons {
	min-height: var(--voa-control-h);
}

.wc-block-components-express-payment-continue-rule {
	color: var(--voa-muted);
	font-size: var(--voa-text-small);
}

.wc-block-components-express-payment-continue-rule::before,
.wc-block-components-express-payment-continue-rule::after {
	border-color: var(--voa-line);
}


/* 12. My account
   ========================================================================== */

.woocommerce-account .woocommerce-MyAccount-navigation ul {
	margin: 0 0 var(--voa-space-lg);
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--voa-line);
}

.woocommerce-account .woocommerce-MyAccount-navigation li {
	border-bottom: 1px solid var(--voa-line);
}

.woocommerce-account .woocommerce-MyAccount-navigation li a {
	display: block;
	padding: 0.75rem 0;
	color: var(--voa-ink);
	text-decoration: none;
}

.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
	color: var(--voa-forest);
	font-weight: 600;
}
