/**
 * ANZO Store — WooCommerce Cart & Checkout blocks.
 *
 * WooCommerce 8+ ships block-based Cart and Checkout pages by default, and this
 * store uses them. Keeping the blocks (rather than reverting to the classic
 * shortcodes) is the forward-compatible choice: they carry express payments,
 * inline validation and the newer extension APIs.
 *
 * This file only restyles them onto the ANZO design system — no block markup
 * is replaced and no checkout behaviour is overridden.
 *
 * Loaded only on cart/checkout (see inc/enqueue.php).
 */

/* ---------------------------------------------------------------
 * Page frame
 * --------------------------------------------------------------- */

.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout {
	margin-inline: auto;
	max-inline-size: var(--container-max);
}

.wc-block-components-title,
.wp-block-woocommerce-cart h1,
.wp-block-woocommerce-checkout h1 {
	font-family: var(--font-display);
	letter-spacing: var(--tracking-tight);
}

/* Two-column shell: items/fields on the lead side, summary alongside. */
.wc-block-cart,
.wc-block-checkout {
	display: block;
}

@media (min-width: 1024px) {
	.wc-block-cart__main,
	.wc-block-checkout__main {
		padding-inline-end: var(--space-12);
	}

	[dir="rtl"] .wc-block-cart__main,
	[dir="rtl"] .wc-block-checkout__main {
		padding-inline-end: 0;
		padding-inline-start: var(--space-12);
	}
}

/* ---------------------------------------------------------------
 * Order summary panel
 * --------------------------------------------------------------- */

.wc-block-cart__sidebar,
.wc-block-checkout__sidebar {
	position: relative;
}

.wc-block-components-sidebar .wc-block-components-totals-wrapper,
.wc-block-cart__sidebar .wc-block-components-sidebar-layout,
.wp-block-woocommerce-cart-totals-block,
.wp-block-woocommerce-checkout-totals-block {
	background-color: var(--surface-muted);
	border: 1px solid var(--border);
	border-radius: var(--radius-lg);
}

.wp-block-woocommerce-cart-totals-block,
.wp-block-woocommerce-checkout-totals-block {
	padding: var(--space-6);
}

.wc-block-components-totals-wrapper {
	border-block-start-color: var(--border);
	padding-block: var(--space-3);
}

.wc-block-components-totals-item__label {
	color: var(--text-muted);
	font-weight: var(--weight-normal);
}

.wc-block-components-totals-footer-item {
	border-block-start: 1px solid var(--border);
	font-size: var(--text-lg);
	font-weight: var(--weight-semibold);
}

/* ---------------------------------------------------------------
 * Line items
 * --------------------------------------------------------------- */

.wc-block-cart-items {
	border: 1px solid var(--border);
	border-radius: var(--radius-lg);
	overflow: hidden;
}

.wc-block-cart-items__header {
	background-color: var(--surface-muted);
	color: var(--text-muted);
	font-size: var(--text-xs);
	letter-spacing: var(--tracking-wide);
	text-transform: uppercase;
}

.wc-block-cart-items__header th {
	border-block-end: 1px solid var(--border);
	padding: var(--space-4);
}

.wc-block-cart-items__row td {
	border-block-end: 1px solid var(--border);
	padding-block: var(--space-5);
}

.wc-block-cart-item__image img,
.wc-block-components-order-summary-item__image img {
	border-radius: var(--radius-md);
	background-color: var(--surface-muted);
}

.wc-block-components-product-name {
	color: var(--color-ink-900);
	font-weight: var(--weight-medium);
	text-decoration: none;
}

.wc-block-components-product-name:hover {
	color: var(--color-accent);
}

.wc-block-components-product-metadata {
	color: var(--text-muted);
	font-size: var(--text-sm);
}

.wc-block-cart-item__remove-link {
	color: var(--text-subtle);
	font-size: var(--text-xs);
	text-decoration: underline;
}

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

/* Quantity selector */
.wc-block-components-quantity-selector {
	border: 1px solid var(--border-strong);
	border-radius: var(--radius-md);
	overflow: hidden;
}

.wc-block-components-quantity-selector::after {
	display: none;
}

.wc-block-components-quantity-selector__button {
	color: var(--color-ink-600);
	font-weight: var(--weight-normal);
}

.wc-block-components-quantity-selector__button:hover {
	background-color: var(--surface-muted);
	color: var(--color-ink-900);
}

.wc-block-components-quantity-selector__input {
	color: var(--text);
}

/* ---------------------------------------------------------------
 * Buttons
 * --------------------------------------------------------------- */

.wc-block-components-button:not(.is-link) {
	background-color: var(--color-primary);
	border: 1px solid transparent;
	border-radius: var(--radius-md);
	color: var(--color-white);
	font-family: var(--font-sans);
	font-size: var(--text-base);
	font-weight: var(--weight-semibold);
	min-block-size: 48px;
	padding-inline: var(--space-6);
	transition: background-color var(--duration-fast) var(--ease);
}

.wc-block-components-button:not(.is-link):hover {
	background-color: var(--color-primary-hover);
	color: var(--color-white);
}

.wc-block-cart__submit-button,
.wc-block-checkout__actions_row .wc-block-components-checkout-place-order-button {
	background-color: var(--color-accent);
	inline-size: 100%;
	min-block-size: 54px;
}

.wc-block-cart__submit-button:hover,
.wc-block-checkout__actions_row .wc-block-components-checkout-place-order-button:hover {
	background-color: var(--color-accent-hover);
}

.wc-block-components-button.is-link {
	color: var(--color-accent);
}

/* ---------------------------------------------------------------
 * Form fields
 * --------------------------------------------------------------- */

.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-combobox input,
.wc-block-components-textarea {
	background-color: var(--surface);
	border: 1px solid var(--border-strong);
	border-radius: var(--radius-md);
	color: var(--text);
	padding-block: 0.9rem 0.5rem;
	padding-inline: var(--space-4);
}

.wc-block-components-text-input.is-active label,
.wc-block-components-text-input input:focus + label {
	color: var(--text-muted);
}

.wc-block-components-text-input input:focus,
.wc-block-components-combobox input:focus,
.wc-block-components-textarea:focus {
	border-color: var(--color-accent);
	box-shadow: var(--ring);
	outline: none;
}

.wc-block-components-text-input.has-error input {
	border-color: var(--color-danger);
}

.wc-block-components-validation-error {
	color: var(--color-danger);
	font-size: var(--text-sm);
}

.wc-block-components-checkbox__input[type="checkbox"] {
	accent-color: var(--color-accent);
}

/* ---------------------------------------------------------------
 * Checkout step headings
 * --------------------------------------------------------------- */

.wc-block-components-checkout-step__heading {
	align-items: baseline;
	gap: var(--space-3);
	margin-block: var(--space-8) var(--space-4);
}

.wc-block-components-checkout-step__title {
	font-family: var(--font-display);
	font-size: var(--text-lg);
	font-weight: var(--weight-semibold);
	letter-spacing: var(--tracking-tight);
}

.wc-block-components-checkout-step__description {
	color: var(--text-muted);
	font-size: var(--text-sm);
}

.wc-block-checkout__form .wc-block-components-checkout-step {
	border-block-end: 1px solid var(--border);
	padding-block-end: var(--space-6);
}

/* Radio controls: shipping methods, payment methods, pickup */
.wc-block-components-radio-control__option {
	border-radius: var(--radius-md);
	padding-block: var(--space-4);
}

.wc-block-components-radio-control-accordion-option,
.wc-block-components-radio-control__option--checked-option-highlighted {
	border: 1px solid var(--border);
	border-radius: var(--radius-md);
}

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

/* ---------------------------------------------------------------
 * Coupons & notices
 * --------------------------------------------------------------- */

.wc-block-components-totals-coupon__form .wc-block-components-text-input {
	margin-block-end: 0;
}

.wc-block-components-chip {
	background-color: var(--color-accent-soft);
	border-color: transparent;
	border-radius: var(--radius-pill);
	color: var(--color-accent-hover);
}

.wc-block-components-notice-banner {
	border-radius: var(--radius-md);
	font-size: var(--text-base);
}

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

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

.wc-block-components-notice-banner.is-info {
	background-color: var(--color-accent-soft);
	border-color: var(--color-accent);
}

/* ---------------------------------------------------------------
 * Empty cart
 * --------------------------------------------------------------- */

.wc-block-cart__empty-cart__title {
	font-family: var(--font-display);
	font-size: var(--text-2xl);
}

.wp-block-woocommerce-empty-cart-block {
	padding-block: var(--space-12);
	text-align: center;
}

/* ---------------------------------------------------------------
 * RTL: the blocks still ship a few physical rules
 * --------------------------------------------------------------- */

[dir="rtl"] .wc-block-components-sidebar-layout .wc-block-components-main,
[dir="rtl"] .wc-block-cart__main {
	float: right;
}

[dir="rtl"] .wc-block-components-sidebar-layout .wc-block-components-sidebar {
	float: left;
}

[dir="rtl"] .wc-block-components-order-summary-item__image,
[dir="rtl"] .wc-block-cart-item__image {
	padding-inline-end: var(--space-4);
	padding-inline-start: 0;
}