/**
 * WCE Theme - WooCommerce Styles (Functional Only)
 *
 * Minimal CSS for WooCommerce functional elements.
 * Visual styling is left to the user via the Site Editor.
 *
 * @package WCE_Theme
 */

/* ========================================
   Buy Now Button
   ======================================== */

.wce-buy-now-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: 0.75rem 1.5rem;
	margin-top: 0.5rem;
	border: 2px solid currentColor;
	border-radius: 6px;
	background: transparent;
	font-size: 0.875rem;
	font-weight: 600;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	transition: opacity 0.2s;
}

.wce-buy-now-btn:hover {
	opacity: 0.7;
}

/* ========================================
   Product Badges
   ======================================== */

.wce-product-badge {
	display: inline-block;
	padding: 0.25rem 0.625rem;
	border-radius: 4px;
	font-size: 0.6875rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	line-height: 1.3;
}

.wce-product-badge--new {
	background: var(--wp--preset--color--info);
	color: var(--wp--preset--color--background);
}

/* Sale badge (WooCommerce .onsale override) */
.woocommerce span.onsale,
.wc-block-components-product-sale-badge {
	border-radius: 4px;
	font-size: 0.6875rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

/* ========================================
   Category Label on Product Cards
   ======================================== */

.wce-product-card__category {
	font-size: 0.6875rem;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	opacity: 0.6;
}

/* ========================================
   Product Trust Strip
   ======================================== */

.wce-trust-strip {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	padding: 1rem 0;
	margin-top: 1rem;
	border-top: 1px solid var(--wp--preset--color--border);
	font-size: 0.8125rem;
}

.wce-trust-strip__item {
	display: flex;
	align-items: center;
	gap: 0.375rem;
}

.wce-trust-strip__item svg {
	flex-shrink: 0;
	width: 16px;
	height: 16px;
}

/* ========================================
   Accordion Tabs (Product Details)
   ======================================== */

.wce-accordion-tab {
	border-bottom: 1px solid var(--wp--preset--color--border);
}

.wce-accordion-tab__summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1rem 0;
	cursor: pointer;
	font-weight: 600;
	font-size: 1rem;
	list-style: none;
}

.wce-accordion-tab__summary::-webkit-details-marker {
	display: none;
}

.wce-accordion-tab__summary::after {
	content: '+';
	font-size: 1.25rem;
	font-weight: 400;
	transition: transform 0.2s;
}

.wce-accordion-tab[open] .wce-accordion-tab__summary::after {
	content: '\2212';
}

.wce-accordion-tab > *:not(summary) {
	padding-bottom: 1rem;
}

/* ========================================
   Cart & Checkout Wrappers
   ======================================== */

.wce-cart-wrapper,
.wce-checkout-wrapper {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 1rem;
}

/* ========================================
   Threshold / Shipping Progress Messages
   ======================================== */

.wce-threshold-message {
	padding: 0.75rem 1rem;
	border-radius: 8px;
	font-size: 0.875rem;
	text-align: center;
	transition: opacity 0.3s;
}

.wce-threshold-message--updating {
	opacity: 0.5;
}

.wce-mini-cart-info {
	font-size: 0.8125rem;
	padding: 0.5rem 0;
}

/* ========================================
   Phase 5 Pass V: Cart dark-theme
   ========================================
   Scope: wp:woocommerce/cart block + its filled/empty children.
   Plugin-owned wrappers (.wce-shipping-progress, .wce-delivery-message) are
   handled by wce-plugin-bridge.css — do not restyle here.
   ======================================== */

/* Shell spacing + two-column layout on desktop */
.wp-block-woocommerce-cart {
	color: var(--wp--preset--color--foreground);
	margin-block-start: var(--wp--preset--spacing--40);
}

.wp-block-woocommerce-filled-cart-block {
	display: grid;
	gap: var(--wp--preset--spacing--40);
	grid-template-columns: 1fr;
	align-items: start;
}

@media (min-width: 1024px) {
	.wp-block-woocommerce-filled-cart-block {
		grid-template-columns: minmax(0, 1fr) 380px;
	}
}

/* WC 10.6.2 cart.css ships width:65%/35% on these two children (with asymmetric
   percentage padding) for its own float/flex layout. Inside our grid cells that
   collapses the sidebar to ~35% of 380px and leaves the items column short of
   its track, producing a large "dead-space" gap. WC also ships
   `.wp-block-woocommerce-cart.is-loading .wp-block-woocommerce-cart-totals-block`
   at 2-class specificity which beats our 1-class override during hydration.
   !important is the only cross-cascade-and-specificity fix. */
.wp-block-woocommerce-cart-items-block,
.wp-block-woocommerce-cart-totals-block,
.wp-block-woocommerce-cart.is-loading .wp-block-woocommerce-cart-items-block,
.wp-block-woocommerce-cart.is-loading .wp-block-woocommerce-cart-totals-block {
	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding-inline: 0;
	min-height: 0;
	float: none !important;
	justify-self: stretch;
}

/* Also force the filled-cart-block grid itself against WC's display:flex
   override (same-specificity cascade would leave ours winning anyway, but
   some WC hydration paths re-apply the flex. Belt + braces.) */
.wp-block-woocommerce-filled-cart-block {
	display: grid !important;
	flex-wrap: initial;
}

/* Items column: dark card wrapping the line items + cross-sells */
.wp-block-woocommerce-cart-items-block {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--wce--borderRadius, 12px);
	padding: 1.25rem;
}

/* Cart line items table */
.wc-block-cart-items,
.wc-block-cart-items table {
	background: transparent;
	color: var(--wp--preset--color--foreground);
	border: 0;
}

.wc-block-cart-items__header,
.wc-block-cart-items__header-product,
.wc-block-cart-items__header-total {
	color: var(--wp--preset--color--foreground-muted);
	border-bottom: 1px solid var(--wp--preset--color--border);
	text-transform: uppercase;
	font-size: 0.75rem;
	letter-spacing: var(--wp--custom--wce--letter-spacing-kicker, 0.08em);
	font-weight: 700;
}

.wc-block-cart-items__row {
	border-bottom: 1px solid var(--wp--preset--color--border);
}

.wc-block-cart-items__row:last-child {
	border-bottom: 0;
}

.wc-block-cart-item__product a,
.wc-block-components-product-name {
	color: var(--wp--preset--color--foreground);
	text-decoration: none;
	font-weight: 600;
}

.wc-block-cart-item__product a:hover,
.wc-block-components-product-name:hover {
	color: var(--wp--preset--color--primary);
}

.wc-block-cart-item__image img {
	border-radius: var(--wp--custom--wce--borderRadius-small, 6px);
	background: var(--wp--preset--color--surface-alt);
}

.wc-block-components-product-metadata,
.wc-block-components-product-metadata__description,
.wc-block-cart-item__product-metadata {
	color: var(--wp--preset--color--foreground-muted);
	font-size: 0.8125rem;
}

.wc-block-components-product-price,
.wc-block-cart-item__total-price-and-sale-badge-wrapper {
	color: var(--wp--preset--color--foreground);
	font-weight: 600;
}

.wc-block-components-product-price__regular {
	color: var(--wp--preset--color--foreground-muted);
	text-decoration: line-through;
}

.wc-block-components-product-price__value,
.wc-block-components-product-price--sale .wc-block-components-product-price__value {
	color: var(--wp--preset--color--primary);
}

.wc-block-components-sale-badge,
.wc-block-components-product-sale-badge {
	background: var(--wp--preset--color--urgent);
	color: var(--wp--preset--color--foreground);
}

/* Quantity stepper */
.wc-block-components-quantity-selector {
	background: var(--wp--preset--color--surface-alt);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--wce--borderRadius-pill, 999px);
	color: var(--wp--preset--color--foreground);
}

.wc-block-components-quantity-selector input.wc-block-components-quantity-selector__input {
	background: transparent;
	color: var(--wp--preset--color--foreground);
	border: 0;
}

.wc-block-components-quantity-selector button.wc-block-components-quantity-selector__button {
	background: transparent;
	color: var(--wp--preset--color--foreground-muted);
	border: 0;
	transition: color var(--wp--custom--wce--transition-fast, 0.15s ease);
}

.wc-block-components-quantity-selector button.wc-block-components-quantity-selector__button:hover:not(:disabled) {
	color: var(--wp--preset--color--primary);
}

.wc-block-components-quantity-selector button.wc-block-components-quantity-selector__button:disabled {
	opacity: 0.4;
}

/* Remove link */
.wc-block-cart-item__remove-link {
	color: var(--wp--preset--color--foreground-muted);
	text-decoration: underline;
	font-size: 0.8125rem;
	transition: color var(--wp--custom--wce--transition-fast, 0.15s ease);
}

.wc-block-cart-item__remove-link:hover {
	color: var(--wp--preset--color--urgent);
}

/* Cross-sells under the line items */
.wp-block-woocommerce-cart-cross-sells-block {
	margin-block-start: var(--wp--preset--spacing--50);
	padding-block-start: var(--wp--preset--spacing--40);
	border-top: 1px solid var(--wp--preset--color--border);
}

.wp-block-woocommerce-cart-cross-sells-block h2 {
	color: var(--wp--preset--color--foreground);
	margin-block-end: var(--wp--preset--spacing--30);
}

/* Totals column: the sticky sidebar card */
.wp-block-woocommerce-cart-totals-block {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--wce--borderRadius, 12px);
	padding: 1.25rem;
	position: static;
}

@media (min-width: 1024px) {
	.wp-block-woocommerce-cart-totals-block {
		position: sticky;
		top: 90px;
	}
}

.wp-block-woocommerce-cart-order-summary-heading-block {
	color: var(--wp--preset--color--foreground);
	font-weight: 700;
	font-size: 1.125rem;
	margin-block-end: 0.75rem;
}

.wc-block-components-totals-wrapper,
.wc-block-components-totals-item {
	color: var(--wp--preset--color--foreground);
	border-color: var(--wp--preset--color--border) !important;
}

.wc-block-components-totals-item__label {
	color: var(--wp--preset--color--foreground-muted);
}

.wc-block-components-totals-item__value {
	color: var(--wp--preset--color--foreground);
	font-weight: 600;
}

.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(--wp--preset--color--foreground);
	font-weight: 700;
	font-size: 1.125rem;
}

.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
	color: var(--wp--preset--color--primary);
}

/* Coupon form */
.wc-block-components-totals-coupon,
.wc-block-components-totals-coupon__form {
	color: var(--wp--preset--color--foreground);
}

.wc-block-components-totals-coupon-link,
.wc-block-components-panel__button {
	color: var(--wp--preset--color--primary);
	background: transparent;
}

.wc-block-components-totals-coupon-link:hover,
.wc-block-components-panel__button:hover {
	color: var(--wp--preset--color--primary-dark);
}

.wc-block-components-totals-coupon__form .wc-block-components-text-input input {
	background: var(--wp--preset--color--surface-alt);
	color: var(--wp--preset--color--foreground);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--wce--borderRadius-small, 6px);
}

.wc-block-components-totals-coupon__form .wc-block-components-text-input input:focus {
	border-color: var(--wp--preset--color--primary);
	outline: none;
	box-shadow: 0 0 0 3px rgb(from var(--wp--preset--color--primary) r g b / 0.25);
}

.wc-block-components-totals-coupon__form .wc-block-components-text-input label {
	color: var(--wp--preset--color--foreground-muted);
}

.wc-block-components-chip {
	background: var(--wp--preset--color--surface-alt);
	color: var(--wp--preset--color--foreground);
	border: 1px solid var(--wp--preset--color--border);
}

.wc-block-components-chip__remove {
	color: var(--wp--preset--color--foreground-muted);
}

.wc-block-components-chip__remove:hover {
	color: var(--wp--preset--color--urgent);
}

/* Buttons — contained (primary CTA)
   NOTE: Pass Y replaces the 999px pill with rectangular radius; keeps pill only
   on chip-like selectors. If you're looking for the proceed/place-order CTA
   rules, see the "Pass Y" block at the bottom of this file — that is the
   source of truth now. These rules remain as base styling. */
.wc-block-cart__submit-button,
.wc-block-components-button.wc-block-components-button.contained,
.wp-block-woocommerce-proceed-to-checkout-block .wc-block-cart__submit-container .wc-block-components-button {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--background);
	border: 2px solid var(--wp--preset--color--primary);
	border-radius: var(--wp--custom--wce--borderRadius, 12px);
	font-weight: 700;
	letter-spacing: var(--wp--custom--wce--letter-spacing-kicker, 0.04em);
	text-transform: uppercase;
	transition: background var(--wp--custom--wce--transition-fast, 0.15s ease), color var(--wp--custom--wce--transition-fast, 0.15s ease), box-shadow var(--wp--custom--wce--transition-fast, 0.15s ease);
}

.wc-block-cart__submit-button:hover,
.wc-block-components-button.wc-block-components-button.contained:hover {
	background: var(--wp--preset--color--primary-dark);
	border-color: var(--wp--preset--color--primary-dark);
	box-shadow: var(--wp--custom--wce--glow-primary, 0 0 20px rgba(212, 255, 58, 0.35));
}

/* Buttons — outlined (secondary) */
.wc-block-components-button.wc-block-components-button.outlined {
	background: transparent;
	color: var(--wp--preset--color--foreground);
	border: 2px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--wce--borderRadius-pill, 999px);
	font-weight: 600;
}

.wc-block-components-button.wc-block-components-button.outlined:hover {
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary);
}

/* Express payment + accepted methods */
.wp-block-woocommerce-cart-express-payment-block,
.wc-block-components-express-payment {
	background: transparent;
	color: var(--wp--preset--color--foreground);
}

.wc-block-components-express-payment__title-container {
	color: var(--wp--preset--color--foreground-muted);
}

.wc-block-components-express-payment__title-container::before,
.wc-block-components-express-payment__title-container::after {
	background: var(--wp--preset--color--border);
}

.wp-block-woocommerce-cart-accepted-payment-methods-block {
	color: var(--wp--preset--color--foreground-muted);
	opacity: 0.8;
	margin-block-start: 0.75rem;
}

/* Empty-cart state */
.wp-block-woocommerce-empty-cart-block {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--wce--borderRadius, 12px);
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--40);
	text-align: center;
}

.wp-block-woocommerce-empty-cart-block h2 {
	color: var(--wp--preset--color--foreground);
}

.wp-block-woocommerce-empty-cart-block p {
	color: var(--wp--preset--color--foreground-muted);
}

/* Store notices above the cart */
.wc-block-components-notice-banner {
	background: var(--wp--preset--color--surface-alt);
	color: var(--wp--preset--color--foreground);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--wce--borderRadius-small, 6px);
}

.wc-block-components-notice-banner.is-info {
	border-color: var(--wp--preset--color--info);
}

.wc-block-components-notice-banner.is-success {
	border-color: var(--wp--preset--color--success);
}

.wc-block-components-notice-banner.is-warning {
	border-color: var(--wp--preset--color--warning);
}

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

/* Cross-sell product cards inherit Phase 2 homepage styling; no overrides needed */

/* ========================================
   Phase 5 Pass W: Checkout + shared form inputs
   ========================================
   Scope: wp:woocommerce/checkout block + its fields/totals children,
   PLUS the shared .wc-block-components-* form input selectors that also
   apply to the cart coupon form and the my-account edit form (Pass X).
   ======================================== */

/* Shell + two-column layout */
.wp-block-woocommerce-checkout {
	color: var(--wp--preset--color--foreground);
	display: grid;
	gap: var(--wp--preset--spacing--40);
	grid-template-columns: 1fr;
	align-items: start;
	margin-block-start: var(--wp--preset--spacing--40);
}

@media (min-width: 1024px) {
	.wp-block-woocommerce-checkout {
		grid-template-columns: minmax(0, 1fr) 380px;
	}
}

/* WC 10.6.2 checkout layout. After React hydration:
   - the outer block class changes from .wp-block-woocommerce-checkout to .wc-block-checkout,
   - the real 2-column layout lives inside <form class="wc-block-components-form wc-block-checkout__form">,
   - direct children are .wc-block-checkout__main (fields) and .wc-block-checkout__sidebar (totals).
   So target the form wrapper unscoped, and make __main/__sidebar fill their cells. */
.wc-block-checkout__form {
	display: grid !important;
	grid-template-columns: 1fr;
	gap: var(--wp--preset--spacing--40);
	align-items: start;
}

@media (min-width: 1024px) {
	.wc-block-checkout__form {
		grid-template-columns: minmax(0, 1fr) 380px;
	}
}

.wc-block-checkout__main,
.wc-block-checkout__sidebar {
	width: 100% !important;
	max-width: none !important;
	min-width: 0;
	margin: 0 !important;
	float: none !important;
}

@media (min-width: 1024px) {
	.wc-block-checkout__sidebar {
		position: sticky;
		top: 90px;
		align-self: start;
	}
}

.wp-block-woocommerce-checkout-fields-block,
.wp-block-woocommerce-checkout-totals-block,
.wp-block-woocommerce-checkout.is-loading .wp-block-woocommerce-checkout-fields-block,
.wp-block-woocommerce-checkout.is-loading .wp-block-woocommerce-checkout-totals-block {
	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding-inline: 0;
	float: none !important;
	justify-self: stretch;
}

.wp-block-woocommerce-checkout-fields-block {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--wce--borderRadius, 12px);
	padding: 1.5rem;
	/* padding-inline override above dropped to 0; restore inline padding here
	   alongside the block/top/bottom padding. */
	padding-inline: 1.5rem;
}

.wp-block-woocommerce-checkout-totals-block {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--wce--borderRadius, 12px);
	padding: 1.5rem;
	padding-inline: 1.5rem;
}

/* WC's fixed-width place-order button (width:190px) — let it fill the actions row. */
.wp-block-woocommerce-checkout-actions-block {
	width: 100%;
	height: auto;
}

@media (min-width: 1024px) {
	.wp-block-woocommerce-checkout-totals-block {
		position: sticky;
		top: 90px;
	}
}

/* Checkout step headings — Contact, Shipping, Payment, etc. */
.wc-block-components-checkout-step {
	padding: var(--wp--preset--spacing--30) 0;
	border-bottom: 1px solid var(--wp--preset--color--border);
}

.wc-block-components-checkout-step:last-of-type {
	border-bottom: 0;
}

.wc-block-components-checkout-step__heading {
	color: var(--wp--preset--color--foreground);
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 0.75rem;
	margin-block-end: 0.5rem;
}

.wc-block-components-checkout-step__title {
	color: var(--wp--preset--color--foreground);
	font-weight: 700;
	font-size: 1.125rem;
}

.wc-block-components-checkout-step__heading-content,
.wc-block-components-checkout-step__description {
	color: var(--wp--preset--color--foreground-muted);
	font-size: 0.8125rem;
}

.wc-block-components-checkout-step__container {
	padding-block-start: 0.5rem;
}

/* Express payment */
.wc-block-components-express-payment {
	background: transparent;
	color: var(--wp--preset--color--foreground);
}

.wc-block-components-express-payment__content {
	background: var(--wp--preset--color--surface-alt);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--wce--borderRadius-small, 6px);
	padding: 0.75rem;
}

.wc-block-components-express-payment-continue-rule {
	color: var(--wp--preset--color--foreground-muted);
}

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

/* Shipping methods / payment methods — radio card pattern */
.wc-block-components-radio-control__option,
.wc-block-components-shipping-rates-control__package .wc-block-components-radio-control__option,
.wc-block-components-payment-method-label {
	background: var(--wp--preset--color--surface-alt);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--wce--borderRadius-small, 6px);
	color: var(--wp--preset--color--foreground);
	padding: 0.875rem 1rem;
	transition: border-color var(--wp--custom--wce--transition-fast, 0.15s ease), box-shadow var(--wp--custom--wce--transition-fast, 0.15s ease);
}

.wc-block-components-radio-control__option:hover {
	border-color: var(--wp--preset--color--foreground-muted);
}

.wc-block-components-radio-control__option-checked,
.wc-block-components-radio-control__option--checked-option-highlighted {
	border-color: var(--wp--preset--color--primary);
	box-shadow: 0 0 0 1px var(--wp--preset--color--primary), 0 0 18px rgb(from var(--wp--preset--color--primary) r g b / 0.15);
}

.wc-block-components-radio-control__input {
	accent-color: var(--wp--preset--color--primary);
}

.wc-block-components-radio-control__label,
.wc-block-components-radio-control__description {
	color: var(--wp--preset--color--foreground);
}

.wc-block-components-radio-control__description,
.wc-block-components-radio-control__secondary-label {
	color: var(--wp--preset--color--foreground-muted);
	font-size: 0.8125rem;
}

/* Shipping rates: the container of options */
.wc-block-components-shipping-rates-control {
	color: var(--wp--preset--color--foreground);
}

.wc-block-components-shipping-rates-control__package {
	background: transparent;
	color: var(--wp--preset--color--foreground);
}

.wc-block-components-shipping-rates-control__package-title {
	color: var(--wp--preset--color--foreground-muted);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: var(--wp--custom--wce--letter-spacing-kicker, 0.08em);
	font-size: 0.75rem;
}

.wc-block-components-shipping-rates-control__no-results-notice {
	color: var(--wp--preset--color--foreground-muted);
}

/* Payment method container */
.wc-block-components-payment-methods {
	color: var(--wp--preset--color--foreground);
}

/* ================
   Shared form inputs (Text, Email, Tel, Number)
   ================ */

.wc-block-components-text-input,
.wc-block-components-textarea {
	background: transparent;
}

.wc-block-components-text-input input[type="text"],
.wc-block-components-text-input input[type="email"],
.wc-block-components-text-input input[type="tel"],
.wc-block-components-text-input input[type="number"],
.wc-block-components-text-input input[type="password"],
.wc-block-components-textarea textarea,
.wp-block-woocommerce-checkout-order-note-block textarea {
	background: var(--wp--preset--color--surface-alt);
	color: var(--wp--preset--color--foreground);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--wce--borderRadius-small, 6px);
	transition: border-color var(--wp--custom--wce--transition-fast, 0.15s ease), box-shadow var(--wp--custom--wce--transition-fast, 0.15s ease);
}

.wc-block-components-text-input input[type="text"]:hover,
.wc-block-components-text-input input[type="email"]:hover,
.wc-block-components-text-input input[type="tel"]:hover,
.wc-block-components-text-input input[type="number"]:hover,
.wc-block-components-text-input input[type="password"]:hover,
.wc-block-components-textarea textarea:hover {
	border-color: var(--wp--preset--color--foreground-muted);
}

.wc-block-components-text-input input[type="text"]:focus,
.wc-block-components-text-input input[type="email"]:focus,
.wc-block-components-text-input input[type="tel"]:focus,
.wc-block-components-text-input input[type="number"]:focus,
.wc-block-components-text-input input[type="password"]:focus,
.wc-block-components-textarea textarea:focus,
.wp-block-woocommerce-checkout-order-note-block textarea:focus {
	border-color: var(--wp--preset--color--primary);
	outline: none;
	box-shadow: 0 0 0 3px rgb(from var(--wp--preset--color--primary) r g b / 0.22);
}

.wc-block-components-text-input input::placeholder,
.wc-block-components-textarea textarea::placeholder {
	color: var(--wp--preset--color--foreground-muted);
	opacity: 0.7;
}

/* Floating label */
.wc-block-components-text-input label,
.wc-block-components-textarea label {
	color: var(--wp--preset--color--foreground-muted);
	background: transparent;
}

.wc-block-components-text-input.is-active label,
.wc-block-components-text-input.has-filled-value label,
.wc-block-components-text-input input:focus + label,
.wc-block-components-textarea.is-active label {
	color: var(--wp--preset--color--primary);
	background: var(--wp--preset--color--surface);
	padding: 0 0.35rem;
}

/* Combobox (country, state) */
.wc-block-components-combobox {
	color: var(--wp--preset--color--foreground);
}

.wc-block-components-combobox-control {
	background: var(--wp--preset--color--surface-alt);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--wce--borderRadius-small, 6px);
}

.wc-block-components-combobox-control__input,
.wc-block-components-combobox input {
	background: transparent !important;
	color: var(--wp--preset--color--foreground) !important;
	border: 0;
}

.wc-block-components-combobox-control__suggestions-container {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	color: var(--wp--preset--color--foreground);
	border-radius: var(--wp--custom--wce--borderRadius-small, 6px);
	box-shadow: var(--wp--custom--wce--boxShadow-elevated, 0 8px 24px rgba(0, 0, 0, 0.35));
}

.wc-block-components-combobox-control__suggestions-container .components-form-token-field__suggestion {
	color: var(--wp--preset--color--foreground);
}

.wc-block-components-combobox-control__suggestions-container .components-form-token-field__suggestion.is-selected,
.wc-block-components-combobox-control__suggestions-container .components-form-token-field__suggestion:hover {
	background: var(--wp--preset--color--surface-alt);
	color: var(--wp--preset--color--primary);
}

/* Checkbox */
.wc-block-components-checkbox__input {
	accent-color: var(--wp--preset--color--primary);
	background: var(--wp--preset--color--surface-alt);
	border: 1px solid var(--wp--preset--color--border);
}

.wc-block-components-checkbox .wc-block-components-checkbox__mark {
	fill: var(--wp--preset--color--background);
}

.wc-block-components-checkbox__label,
.wc-block-checkout-use-address-for-billing .wc-block-components-checkbox__label {
	color: var(--wp--preset--color--foreground);
}

/* Validation error */
.wc-block-components-validation-error,
.wc-block-components-validation-error *,
.has-error .wc-block-components-text-input-label {
	color: var(--wp--preset--color--urgent);
}

.has-error .wc-block-components-text-input input,
.wc-block-components-text-input.has-error input,
.has-error .wc-block-components-combobox-control,
.has-error textarea {
	border-color: var(--wp--preset--color--urgent);
	box-shadow: 0 0 0 3px rgb(from var(--wp--preset--color--urgent) r g b / 0.18);
}

/* Terms checkbox block */
.wc-block-checkout__terms,
.wp-block-woocommerce-checkout-terms-block {
	color: var(--wp--preset--color--foreground-muted);
	font-size: 0.8125rem;
}

.wc-block-checkout__terms a,
.wp-block-woocommerce-checkout-terms-block a {
	color: var(--wp--preset--color--primary);
}

.wc-block-checkout__terms a:hover,
.wp-block-woocommerce-checkout-terms-block a:hover {
	color: var(--wp--preset--color--primary-dark);
}

/* Place order button — override default contained styling with stronger CTA */
.wc-block-components-checkout-place-order-button,
.wp-block-woocommerce-checkout-actions-block .wc-block-components-button {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--background);
	border: 2px solid var(--wp--preset--color--primary);
	border-radius: var(--wp--custom--wce--borderRadius-pill, 999px);
	font-weight: 800;
	letter-spacing: var(--wp--custom--wce--letter-spacing-kicker, 0.04em);
	text-transform: uppercase;
	padding: 1rem 1.5rem;
	width: 100%;
	transition: background var(--wp--custom--wce--transition-fast, 0.15s ease), box-shadow var(--wp--custom--wce--transition-fast, 0.15s ease);
}

.wc-block-components-checkout-place-order-button:hover:not(:disabled),
.wp-block-woocommerce-checkout-actions-block .wc-block-components-button:hover:not(:disabled) {
	background: var(--wp--preset--color--primary-dark);
	border-color: var(--wp--preset--color--primary-dark);
	box-shadow: var(--wp--custom--wce--glow-primary, 0 0 20px rgba(212, 255, 58, 0.45));
}

.wc-block-components-checkout-place-order-button:disabled {
	opacity: 0.55;
	cursor: not-allowed;
}

/* Checkout return-to-cart link */
.wc-block-components-checkout-return-to-cart-button {
	color: var(--wp--preset--color--foreground-muted);
}

.wc-block-components-checkout-return-to-cart-button:hover {
	color: var(--wp--preset--color--primary);
}

/* Order summary cart items inside checkout sidebar */
.wc-block-components-order-summary-item {
	color: var(--wp--preset--color--foreground);
	border-bottom: 1px solid var(--wp--preset--color--border);
}

.wc-block-components-order-summary-item:last-child {
	border-bottom: 0;
}

.wc-block-components-order-summary-item__quantity {
	background: var(--wp--preset--color--surface-alt);
	color: var(--wp--preset--color--foreground);
	border: 1px solid var(--wp--preset--color--border);
}

.wc-block-components-order-summary-item__description {
	color: var(--wp--preset--color--foreground-muted);
	font-size: 0.8125rem;
}

/* Additional information / order note textarea block */
.wp-block-woocommerce-checkout-additional-information-block {
	color: var(--wp--preset--color--foreground);
}

.wp-block-woocommerce-checkout-order-note-block textarea {
	min-height: 6rem;
}

/* Loading states */
.wp-block-woocommerce-checkout.is-loading,
.wc-block-components-skeleton .wc-block-components-skeleton__element {
	background: var(--wp--preset--color--surface-alt);
}

/* ========================================
   Phase 5 Pass X: My Account
   ========================================
   Scope: templates/page-my-account.html (block frame) + legacy
   .woocommerce-MyAccount-* markup emitted by [woocommerce_my_account].
   WC 10.6.2 ships only woocommerce/customer-account as a block — the
   endpoint content (orders, addresses, downloads, edit form) is still
   legacy template HTML, styled here.
   ======================================== */

/* Hero band */
.wce-account__hero {
	border-bottom: 1px solid var(--wp--preset--color--border);
	border-radius: 0;
}

.wce-account__kicker {
	color: var(--wp--preset--color--primary);
	text-transform: uppercase;
	letter-spacing: var(--wp--custom--wce--letter-spacing-kicker, 0.12em);
	font-weight: 700;
	margin-block-end: 0.25rem;
}

/* WC customer-account block inside the hero */
.wce-account__hero .wc-block-customer-account {
	color: var(--wp--preset--color--foreground);
	font-size: 1.75rem;
	font-weight: 800;
	line-height: 1.15;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
}

.wce-account__hero .wc-block-customer-account:hover {
	color: var(--wp--preset--color--primary);
}

.wce-account__hero .wc-block-customer-account__account-icon {
	fill: currentColor;
	color: currentColor;
}

/* Body wrapper */
.wce-account__body {
	color: var(--wp--preset--color--foreground);
}

/* Layout: nav + content side-by-side on desktop.
   WC emits .woocommerce-MyAccount-navigation and .woocommerce-MyAccount-content
   as siblings inside a .woocommerce container. Broad selectors so this
   applies whether or not body.woocommerce-account is present. */

.wce-account .woocommerce,
.woocommerce-account .woocommerce,
.wce-account__body .woocommerce {
	display: grid !important;
	gap: var(--wp--preset--spacing--40);
	grid-template-columns: 1fr;
	align-items: start;
}

@media (min-width: 900px) {
	.wce-account .woocommerce,
	.woocommerce-account .woocommerce,
	.wce-account__body .woocommerce {
		grid-template-columns: 280px minmax(0, 1fr);
	}

	/* WC can emit content before nav in some contexts; pin explicitly
	   so nav is always column 1 and content is column 2 regardless of
	   DOM order. */
	.wce-account .woocommerce > .woocommerce-MyAccount-navigation,
	.woocommerce-account .woocommerce > .woocommerce-MyAccount-navigation,
	.wce-account__body .woocommerce > .woocommerce-MyAccount-navigation {
		grid-column: 1;
		grid-row: 1;
	}
	.wce-account .woocommerce > .woocommerce-MyAccount-content,
	.woocommerce-account .woocommerce > .woocommerce-MyAccount-content,
	.wce-account__body .woocommerce > .woocommerce-MyAccount-content {
		grid-column: 2;
		grid-row: 1;
		min-width: 0;
	}
}

/* Suppress the giant "My Account" post-title H1 that WP/WC inject
   above the shortcode — our hero already sets the page heading. */
.wce-account .wce-account__body > h1.entry-title,
.wce-account .wce-account__body .page-title,
.wce-account__body > .woocommerce > h1 {
	display: none !important;
}

/* Sidebar navigation */
.woocommerce-MyAccount-navigation {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--wce--borderRadius, 12px);
	padding: 0.75rem;
	position: sticky;
	top: 90px;
	align-self: start;
}

.woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.woocommerce-MyAccount-navigation ul li {
	margin: 0 0 0.25rem;
	border: 0;
}

.woocommerce-MyAccount-navigation ul li a {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	padding: 0.75rem 1rem;
	color: var(--wp--preset--color--foreground);
	text-decoration: none;
	border-radius: var(--wp--custom--wce--borderRadius-small, 8px);
	font-weight: 600;
	font-size: 0.9375rem;
	transition: background var(--wp--custom--wce--transition-fast, 0.15s ease), color var(--wp--custom--wce--transition-fast, 0.15s ease), transform var(--wp--custom--wce--transition-fast, 0.15s ease);
}

/* Icon glyph before each nav label. WC emits a stable per-endpoint
   class on the <li>, so we target those to paint an icon via
   background-image (inline SVG → no extra HTTP, recolours via mask). */
.woocommerce-MyAccount-navigation ul li a::before {
	content: "";
	flex: 0 0 1.25rem;
	width: 1.25rem;
	height: 1.25rem;
	background-color: currentColor;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	mask-size: contain;
	opacity: 0.85;
}

.woocommerce-MyAccount-navigation-link--dashboard a::before {
	-webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='3' width='7' height='9'/><rect x='14' y='3' width='7' height='5'/><rect x='14' y='12' width='7' height='9'/><rect x='3' y='16' width='7' height='5'/></svg>");
	        mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='3' width='7' height='9'/><rect x='14' y='3' width='7' height='5'/><rect x='14' y='12' width='7' height='9'/><rect x='3' y='16' width='7' height='5'/></svg>");
}
.woocommerce-MyAccount-navigation-link--orders a::before {
	-webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M6 2 3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4Z'/><line x1='3' y1='6' x2='21' y2='6'/><path d='M16 10a4 4 0 0 1-8 0'/></svg>");
	        mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M6 2 3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4Z'/><line x1='3' y1='6' x2='21' y2='6'/><path d='M16 10a4 4 0 0 1-8 0'/></svg>");
}
.woocommerce-MyAccount-navigation-link--downloads a::before {
	-webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/><polyline points='7 10 12 15 17 10'/><line x1='12' y1='15' x2='12' y2='3'/></svg>");
	        mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/><polyline points='7 10 12 15 17 10'/><line x1='12' y1='15' x2='12' y2='3'/></svg>");
}
.woocommerce-MyAccount-navigation-link--edit-address a::before,
.woocommerce-MyAccount-navigation-link--addresses a::before {
	-webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M20 10c0 7-8 13-8 13S4 17 4 10a8 8 0 0 1 16 0Z'/><circle cx='12' cy='10' r='3'/></svg>");
	        mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M20 10c0 7-8 13-8 13S4 17 4 10a8 8 0 0 1 16 0Z'/><circle cx='12' cy='10' r='3'/></svg>");
}
.woocommerce-MyAccount-navigation-link--payment-methods a::before {
	-webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='2' y='5' width='20' height='14' rx='2'/><line x1='2' y1='10' x2='22' y2='10'/></svg>");
	        mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='2' y='5' width='20' height='14' rx='2'/><line x1='2' y1='10' x2='22' y2='10'/></svg>");
}
.woocommerce-MyAccount-navigation-link--edit-account a::before {
	-webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/><circle cx='12' cy='7' r='4'/></svg>");
	        mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/><circle cx='12' cy='7' r='4'/></svg>");
}
.woocommerce-MyAccount-navigation-link--customer-logout a::before {
	-webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/><polyline points='16 17 21 12 16 7'/><line x1='21' y1='12' x2='9' y2='12'/></svg>");
	        mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/><polyline points='16 17 21 12 16 7'/><line x1='21' y1='12' x2='9' y2='12'/></svg>");
}

.woocommerce-MyAccount-navigation ul li a:hover {
	background: var(--wp--preset--color--surface-alt);
	color: var(--wp--preset--color--primary);
	transform: translateX(2px);
}

.woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--is-active a {
	background: color-mix(in srgb, var(--wp--preset--color--primary) 12%, var(--wp--preset--color--surface));
	color: var(--wp--preset--color--primary);
	box-shadow: inset 3px 0 0 var(--wp--preset--color--primary);
}

.woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--customer-logout {
	margin-top: 0.75rem;
	padding-top: 0.75rem;
	border-top: 1px solid var(--wp--preset--color--border);
}
.woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--customer-logout a {
	color: var(--wp--preset--color--foreground-muted);
}

/* Content panel */
.woocommerce-MyAccount-content {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--wce--borderRadius, 12px);
	padding: var(--wp--preset--spacing--40);
	color: var(--wp--preset--color--foreground);
}

.woocommerce-MyAccount-content h2,
.woocommerce-MyAccount-content h3 {
	color: var(--wp--preset--color--foreground);
}

.woocommerce-MyAccount-content p {
	color: var(--wp--preset--color--foreground);
}

.woocommerce-MyAccount-content p mark,
.woocommerce-MyAccount-content mark {
	background: transparent;
	color: var(--wp--preset--color--primary);
	font-weight: 700;
}

.woocommerce-MyAccount-content a:not(.button) {
	color: var(--wp--preset--color--primary);
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.woocommerce-MyAccount-content a:not(.button):hover {
	color: var(--wp--preset--color--primary-dark);
}

/* Tables: orders / downloads / addresses overview */
.woocommerce-MyAccount-content table,
.woocommerce-orders-table,
.woocommerce-table {
	width: 100%;
	border-collapse: collapse;
	background: transparent;
	color: var(--wp--preset--color--foreground);
}

.woocommerce-MyAccount-content table th,
.woocommerce-orders-table th,
.woocommerce-table th {
	text-align: left;
	color: var(--wp--preset--color--foreground-muted);
	text-transform: uppercase;
	font-size: 0.75rem;
	letter-spacing: var(--wp--custom--wce--letter-spacing-kicker, 0.08em);
	font-weight: 700;
	padding: 0.75rem 0.75rem;
	border-bottom: 1px solid var(--wp--preset--color--border);
	background: transparent;
}

.woocommerce-MyAccount-content table td,
.woocommerce-orders-table td,
.woocommerce-table td {
	padding: 0.875rem 0.75rem;
	border-bottom: 1px solid var(--wp--preset--color--border);
	color: var(--wp--preset--color--foreground);
	background: transparent;
}

.woocommerce-orders-table tbody tr:last-child td,
.woocommerce-table tbody tr:last-child td,
.woocommerce-MyAccount-content table tbody tr:last-child td {
	border-bottom: 0;
}

.woocommerce-orders-table__cell-order-status {
	text-transform: uppercase;
	font-size: 0.75rem;
	letter-spacing: var(--wp--custom--wce--letter-spacing-kicker, 0.08em);
	font-weight: 700;
}

/* Order status pill */
.woocommerce-orders-table mark {
	display: inline-block;
	padding: 0.125rem 0.5rem;
	border-radius: var(--wp--custom--wce--borderRadius-pill, 999px);
	background: var(--wp--preset--color--surface-alt);
	color: var(--wp--preset--color--foreground);
	border: 1px solid var(--wp--preset--color--border);
	font-size: 0.75rem;
}

/* Address cards on the Addresses endpoint */
.woocommerce-Addresses,
.addresses {
	display: grid;
	gap: var(--wp--preset--spacing--30);
	grid-template-columns: 1fr;
}

@media (min-width: 720px) {
	.woocommerce-Addresses,
	.addresses {
		grid-template-columns: 1fr 1fr;
	}
}

.woocommerce-Addresses .woocommerce-Address,
.addresses .woocommerce-Address {
	background: var(--wp--preset--color--surface-alt);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--wce--borderRadius-small, 6px);
	padding: 1.25rem;
	color: var(--wp--preset--color--foreground);
}

.woocommerce-Address-title {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 0.75rem;
	margin-block-end: 0.75rem;
}

.woocommerce-Address-title h3 {
	color: var(--wp--preset--color--foreground);
	font-size: 1rem;
	margin: 0;
}

.woocommerce-Address-title .edit {
	color: var(--wp--preset--color--primary);
	font-size: 0.8125rem;
	text-transform: uppercase;
	letter-spacing: var(--wp--custom--wce--letter-spacing-kicker, 0.08em);
	font-weight: 700;
	text-decoration: none;
}

.woocommerce-Address-title .edit:hover {
	color: var(--wp--preset--color--primary-dark);
}

/* Edit Account + Edit Address forms use WC's legacy form-row markup */
.woocommerce form .form-row {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	margin-block-end: 0.875rem;
}

.woocommerce form .form-row label {
	color: var(--wp--preset--color--foreground-muted);
	font-size: 0.8125rem;
	font-weight: 600;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-EditAccountForm input[type="text"],
.woocommerce-EditAccountForm input[type="email"],
.woocommerce-EditAccountForm input[type="password"],
.woocommerce-EditAccountForm input[type="tel"] {
	background: var(--wp--preset--color--surface-alt);
	color: var(--wp--preset--color--foreground);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--wce--borderRadius-small, 6px);
	padding: 0.625rem 0.75rem;
	font-size: 0.9375rem;
	transition: border-color var(--wp--custom--wce--transition-fast, 0.15s ease), box-shadow var(--wp--custom--wce--transition-fast, 0.15s ease);
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus,
.woocommerce-EditAccountForm input:focus {
	border-color: var(--wp--preset--color--primary);
	outline: none;
	box-shadow: 0 0 0 3px rgb(from var(--wp--preset--color--primary) r g b / 0.22);
}

.woocommerce form .form-row.woocommerce-invalid input.input-text,
.woocommerce form .form-row.woocommerce-invalid textarea,
.woocommerce form .form-row.woocommerce-invalid select {
	border-color: var(--wp--preset--color--urgent);
	box-shadow: 0 0 0 3px rgb(from var(--wp--preset--color--urgent) r g b / 0.18);
}

.woocommerce form .form-row.woocommerce-validated input.input-text {
	border-color: var(--wp--preset--color--success);
}

/* Legacy WC buttons inside my-account (Save, Add, View order) */
.woocommerce-MyAccount-content .button,
.woocommerce-MyAccount-content button[type="submit"],
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--background);
	border: 2px solid var(--wp--preset--color--primary);
	border-radius: var(--wp--custom--wce--borderRadius-pill, 999px);
	font-weight: 700;
	letter-spacing: var(--wp--custom--wce--letter-spacing-kicker, 0.04em);
	text-transform: uppercase;
	padding: 0.625rem 1.25rem;
	cursor: pointer;
	text-decoration: none;
	display: inline-block;
	transition: background var(--wp--custom--wce--transition-fast, 0.15s ease), box-shadow var(--wp--custom--wce--transition-fast, 0.15s ease);
}

.woocommerce-MyAccount-content .button:hover,
.woocommerce-MyAccount-content button[type="submit"]:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
	background: var(--wp--preset--color--primary-dark);
	border-color: var(--wp--preset--color--primary-dark);
	color: var(--wp--preset--color--background);
	box-shadow: var(--wp--custom--wce--glow-primary, 0 0 20px rgba(212, 255, 58, 0.35));
}

/* Secondary/outline variant on my-account (e.g. "View" on orders table) */
.woocommerce-MyAccount-content .button.view,
.woocommerce-orders-table .button {
	background: transparent;
	color: var(--wp--preset--color--foreground);
	border-color: var(--wp--preset--color--border);
	padding: 0.375rem 0.875rem;
	font-size: 0.75rem;
}

.woocommerce-MyAccount-content .button.view:hover,
.woocommerce-orders-table .button:hover {
	background: transparent;
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary);
	box-shadow: none;
}

/* WC message boxes inside my-account */
.woocommerce-MyAccount-content .woocommerce-message,
.woocommerce-MyAccount-content .woocommerce-info,
.woocommerce-MyAccount-content .woocommerce-error,
.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-info,
.woocommerce-notices-wrapper .woocommerce-error {
	background: var(--wp--preset--color--surface-alt);
	color: var(--wp--preset--color--foreground);
	border: 1px solid var(--wp--preset--color--border);
	border-left-width: 4px;
	border-radius: var(--wp--custom--wce--borderRadius-small, 6px);
	padding: 1rem 1.25rem;
	margin-block-end: var(--wp--preset--spacing--30);
	list-style: none;
}

.woocommerce-MyAccount-content .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-message {
	border-left-color: var(--wp--preset--color--success);
}

.woocommerce-MyAccount-content .woocommerce-info,
.woocommerce-notices-wrapper .woocommerce-info {
	border-left-color: var(--wp--preset--color--info);
}

.woocommerce-MyAccount-content .woocommerce-error,
.woocommerce-notices-wrapper .woocommerce-error {
	border-left-color: var(--wp--preset--color--urgent);
	color: var(--wp--preset--color--urgent);
}

/* Login form shown on my-account when logged out */
.woocommerce-account:not(.logged-in) .woocommerce form.woocommerce-form-login,
.woocommerce-account:not(.logged-in) .woocommerce form.woocommerce-form-register,
.u-column1.col-1,
.u-column2.col-2 {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--wce--borderRadius, 12px);
	padding: var(--wp--preset--spacing--40);
	color: var(--wp--preset--color--foreground);
}

.woocommerce-form-login__rememberme,
.woocommerce-form-register__submit {
	color: var(--wp--preset--color--foreground-muted);
}

.woocommerce-LostPassword a {
	color: var(--wp--preset--color--primary);
}

.woocommerce-LostPassword a:hover {
	color: var(--wp--preset--color--primary-dark);
}

/* Pagination inside orders list */
.woocommerce-pagination {
	margin-block-start: var(--wp--preset--spacing--40);
}

.woocommerce-pagination ul {
	display: flex;
	gap: 0.25rem;
	flex-wrap: wrap;
	list-style: none;
	padding: 0;
	margin: 0;
}

.woocommerce-pagination ul li a,
.woocommerce-pagination ul li span {
	display: inline-block;
	padding: 0.5rem 0.875rem;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--wce--borderRadius-small, 6px);
	color: var(--wp--preset--color--foreground);
	text-decoration: none;
	font-size: 0.875rem;
}

.woocommerce-pagination ul li a:hover {
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary);
}

.woocommerce-pagination ul li span.current {
	background: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--background);
	font-weight: 700;
}

/* ========================================
   Phase 5 Pass Y: Cart/Checkout visual bug fixes + Pass V/W overrides
   ========================================
   Targets visible Phase 5 regressions:
   - Proceed-to-Checkout button rendering as a giant round disc
   - Express payment row broken/misaligned (Google Pay truncated, odd green block)
   - Checkout radio-dot overlapping first letter of shipping method labels
   - Duplicate "Basket Totals" heading in cart sidebar
   - Trust strip stacking weirdly inside cart totals with visible separator pipes
   These rules are intentionally appended at the bottom to take precedence over
   Pass V/W without rewriting them; if Pass V/W is ever re-authored, merge these
   in at the correct section and delete this block.
   ======================================== */

/* --- Proceed to Checkout + Place Order: full-width rectangular CTA --- */
.wp-block-woocommerce-proceed-to-checkout-block,
.wp-block-woocommerce-proceed-to-checkout-block .wc-block-cart__submit-container,
.wc-block-components-checkout-place-order-button {
	display: block;
	width: 100%;
}

.wp-block-woocommerce-proceed-to-checkout-block .wc-block-components-button,
.wp-block-woocommerce-proceed-to-checkout-block .wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: 100% !important;
	min-height: 3.25rem;
	max-width: none !important;
	padding: 1rem 1.5rem !important;
	border-radius: var(--wp--custom--wce--borderRadius, 12px) !important;
	font-size: 0.95rem;
	font-weight: 800;
	letter-spacing: var(--wp--custom--wce--letter-spacing-kicker, 0.08em);
	text-transform: uppercase;
	aspect-ratio: auto !important;
	white-space: nowrap;
}

/* --- Express payment block: consistent frame for Google/Apple/Shop Pay --- */
.wp-block-woocommerce-cart-express-payment-block,
.wp-block-woocommerce-checkout-express-payment-block,
.wc-block-components-express-payment {
	padding: 1rem 0;
	display: block;
}

.wp-block-woocommerce-cart-express-payment-block .wc-block-components-express-payment__content,
.wp-block-woocommerce-checkout-express-payment-block .wc-block-components-express-payment__content {
	background: var(--wp--preset--color--surface-alt);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--wce--borderRadius-small, 6px);
	padding: 0.75rem;
}

.wp-block-woocommerce-cart-express-payment-block .wc-block-components-express-payment__event-buttons,
.wp-block-woocommerce-checkout-express-payment-block .wc-block-components-express-payment__event-buttons {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	list-style: none;
	padding: 0;
	margin: 0;
}

.wp-block-woocommerce-cart-express-payment-block .wc-block-components-express-payment__event-buttons > li,
.wp-block-woocommerce-checkout-express-payment-block .wc-block-components-express-payment__event-buttons > li {
	width: 100%;
	list-style: none;
}

.wp-block-woocommerce-cart-express-payment-block .wc-block-components-express-payment__event-buttons > li > *,
.wp-block-woocommerce-checkout-express-payment-block .wc-block-components-express-payment__event-buttons > li > *,
.wp-block-woocommerce-cart-express-payment-block .wc-block-components-express-payment__event-buttons button,
.wp-block-woocommerce-checkout-express-payment-block .wc-block-components-express-payment__event-buttons button {
	width: 100% !important;
	min-height: 48px;
	border-radius: var(--wp--custom--wce--borderRadius-small, 6px);
	overflow: hidden;
}

/* --- Checkout shipping/payment radio: custom-drawn dot, no overlap --- */
.wc-block-components-radio-control__option {
	display: flex !important;
	align-items: center;
	gap: 0.75rem;
	padding-inline-start: 1rem;
	position: relative;
}

.wc-block-components-radio-control__option > .wc-block-components-radio-control__input,
.wc-block-components-radio-control__input {
	position: static !important;
	top: auto !important;
	left: auto !important;
	inset: auto !important;
	margin: 0 !important;
	flex: 0 0 18px;
	width: 18px;
	height: 18px;
	appearance: none;
	-webkit-appearance: none;
	border: 2px solid var(--wp--preset--color--border);
	border-radius: 50%;
	background: transparent;
	cursor: pointer;
	transition: border-color var(--wp--custom--wce--transition-fast, 0.15s ease), box-shadow var(--wp--custom--wce--transition-fast, 0.15s ease);
}

.wc-block-components-radio-control__input:checked {
	border-color: var(--wp--preset--color--primary);
	box-shadow: inset 0 0 0 4px var(--wp--preset--color--primary);
}

.wc-block-components-radio-control__input:focus-visible {
	outline: 0;
	box-shadow: 0 0 0 3px rgb(from var(--wp--preset--color--primary) r g b / 0.35);
}

.wc-block-components-radio-control__option .wc-block-components-radio-control__label,
.wc-block-components-radio-control__option .wc-block-components-radio-control__label-group {
	padding-inline-start: 0 !important;
	margin-inline-start: 0 !important;
	flex: 1 1 auto;
	min-width: 0;
}

/* --- Duplicate "Basket Totals" heading: handled at template level in Pass Z.
   Pass Y CSS removed (template now uses canonical WC 10.6.2 inner-block names,
   so validator no longer appends a second heading). --- */

/* --- Delivery notice block (checkout only): info card above the form telling
   shoppers that Express / Saturday / Sunday delivery requires a phone number
   per DPD rules. Mirrors the chartreuse outline of the delivery-countdown. --- */
.wce-delivery-notice {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--primary);
	border-radius: var(--wp--custom--wce--borderRadius-small, 6px);
	padding: 1rem 1.25rem;
	margin-block: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
	color: var(--wp--preset--color--foreground);
	box-shadow: 0 0 0 1px rgb(from var(--wp--preset--color--primary) r g b / 0.12);
}

.wce-delivery-notice__title {
	color: var(--wp--preset--color--primary);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: var(--wp--custom--wce--letter-spacing-kicker, 0.08em);
	margin: 0 0 0.375rem;
	font-size: 0.8125rem;
}

.wce-delivery-notice__body {
	color: var(--wp--preset--color--foreground-muted);
	margin: 0;
	font-size: 0.875rem;
	line-height: 1.5;
}

.wce-delivery-notice__body strong {
	color: var(--wp--preset--color--foreground);
	font-weight: 700;
}

/* --- Trust strip: rendered as a SIBLING of the cart block via themed wrapper
   .wce-cart-trust-strip (see page-cart.html). Pass Z moved it out of
   cart-totals-block because WC's validator hoists non-allowed patterns
   out of that parent. --- */
.wce-cart-trust-strip {
	margin-top: var(--wp--preset--spacing--40);
}

.wce-cart-trust-strip .wce-trust-strip {
	border-top: 1px solid var(--wp--preset--color--border);
	margin-top: 0;
	padding: 1.25rem 0 0;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0.5rem;
	justify-items: center;
	text-align: center;
	color: var(--wp--preset--color--foreground-muted);
	font-size: 0.8125rem;
}

.wce-cart-trust-strip .wce-trust-strip__item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.375rem;
	line-height: 1.2;
	color: var(--wp--preset--color--foreground-muted);
	white-space: normal;
}

.wce-cart-trust-strip .wce-trust-strip__item svg {
	color: var(--wp--preset--color--primary);
	width: 20px;
	height: 20px;
}

.wce-cart-trust-strip .wce-trust-strip__sep {
	display: none;
}

/* ========================================
   Pass X+ — My Account dashboard quick-action tiles + order cards
   (2026-04-19)
   ========================================
   Dashboard endpoint: the default WC output is a dry paragraph
   ("Hello {name} (not {name}? Log out)") followed by a long list of
   paragraphs. We inject a "quick actions" grid via PHP
   (WCE_Theme_Woocommerce::render_account_dashboard_tiles hooked into
   woocommerce_account_dashboard) and style it here.
   ======================================== */

.wce-account-dashboard-greeting {
	font-size: 1.5rem;
	font-weight: 800;
	color: var(--wp--preset--color--foreground);
	margin: 0 0 0.25rem;
	letter-spacing: -0.01em;
}

.wce-account-dashboard-subtitle {
	color: var(--wp--preset--color--foreground-muted);
	font-size: 0.9375rem;
	margin: 0 0 var(--wp--preset--spacing--40);
}

.wce-account-tiles {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: var(--wp--preset--spacing--20);
	margin: 0 0 var(--wp--preset--spacing--40);
}

@media (min-width: 720px) {
	.wce-account-tiles {
		grid-template-columns: repeat(4, 1fr);
	}
}

.wce-account-tile {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	padding: 1rem 1.1rem;
	background: var(--wp--preset--color--surface-alt);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--wce--borderRadius-small, 10px);
	text-decoration: none !important;
	color: var(--wp--preset--color--foreground) !important;
	transition: transform var(--wp--custom--wce--transition-fast, 0.15s ease), border-color var(--wp--custom--wce--transition-fast, 0.15s ease), box-shadow var(--wp--custom--wce--transition-fast, 0.15s ease);
}

.wce-account-tile:hover {
	transform: translateY(-2px);
	border-color: var(--wp--preset--color--primary);
	box-shadow: var(--wp--custom--wce--box-shadow-hover, 0 10px 30px rgba(0,0,0,0.35));
	color: var(--wp--preset--color--foreground) !important;
}

.wce-account-tile__icon {
	width: 1.5rem;
	height: 1.5rem;
	color: var(--wp--preset--color--primary);
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.wce-account-tile__value {
	font-size: 1.5rem;
	font-weight: 800;
	line-height: 1;
	color: var(--wp--preset--color--foreground);
	letter-spacing: -0.01em;
}

.wce-account-tile__label {
	font-size: 0.75rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: var(--wp--custom--wce--letter-spacing-kicker, 0.08em);
	color: var(--wp--preset--color--foreground-muted);
}

.wce-account-tile__cta {
	margin-top: auto;
	font-size: 0.8125rem;
	font-weight: 700;
	color: var(--wp--preset--color--primary);
}

/* Recent orders strip (injected under the tiles) */
.wce-account-recent {
	margin: 0 0 var(--wp--preset--spacing--30);
}
.wce-account-recent h3 {
	font-size: 0.9375rem;
	text-transform: uppercase;
	letter-spacing: var(--wp--custom--wce--letter-spacing-kicker, 0.08em);
	color: var(--wp--preset--color--foreground-muted);
	margin: 0 0 0.75rem;
}

/* ========================================
   Orders table: responsive card layout on narrow widths
   ======================================== */

@media (max-width: 720px) {
	.woocommerce-MyAccount-content .woocommerce-orders-table {
		border: 0;
	}
	.woocommerce-MyAccount-content .woocommerce-orders-table thead {
		position: absolute;
		left: -9999px;
		width: 1px;
		height: 1px;
		overflow: hidden;
	}
	.woocommerce-MyAccount-content .woocommerce-orders-table tbody tr {
		display: grid;
		grid-template-columns: 1fr auto;
		gap: 0.25rem 1rem;
		align-items: center;
		padding: 1rem;
		margin-bottom: 0.75rem;
		background: var(--wp--preset--color--surface-alt);
		border: 1px solid var(--wp--preset--color--border);
		border-radius: var(--wp--custom--wce--borderRadius-small, 10px);
	}
	.woocommerce-MyAccount-content .woocommerce-orders-table tbody td {
		display: block;
		padding: 0 !important;
		border: 0 !important;
	}
	.woocommerce-MyAccount-content .woocommerce-orders-table tbody td::before {
		content: attr(data-title) ": ";
		display: inline-block;
		min-width: 70px;
		font-size: 0.7rem;
		text-transform: uppercase;
		letter-spacing: var(--wp--custom--wce--letter-spacing-kicker, 0.08em);
		color: var(--wp--preset--color--foreground-muted);
		font-weight: 700;
		margin-right: 0.4rem;
	}
	.woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-number {
		grid-column: 1;
		font-weight: 800;
		font-size: 1.0625rem;
	}
	.woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-number::before {
		content: "" !important;
	}
	.woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-actions {
		grid-column: 2;
		grid-row: 1 / span 2;
		align-self: center;
	}
	.woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-actions::before {
		content: "" !important;
	}
	.woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-status {
		grid-column: 1;
	}
	.woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-date,
	.woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-total {
		grid-column: 1 / -1;
		font-size: 0.8125rem;
		color: var(--wp--preset--color--foreground-muted);
	}
}

/* Desktop orders table: elevate row hover + pad cells a bit more */
@media (min-width: 721px) {
	.woocommerce-MyAccount-content .woocommerce-orders-table tbody tr {
		transition: background var(--wp--custom--wce--transition-fast, 0.15s ease);
	}
	.woocommerce-MyAccount-content .woocommerce-orders-table tbody tr:hover {
		background: var(--wp--preset--color--surface-alt);
	}
	.woocommerce-MyAccount-content .woocommerce-orders-table td,
	.woocommerce-MyAccount-content .woocommerce-orders-table th {
		padding: 1rem 0.75rem;
	}
}
