/**
 * AVELUNEXA - WooCommerce layer.
 *
 * Loaded only on WooCommerce pages (see functions.php). Everything here targets
 * Woo's own markup, so selectors follow its class names rather than our scheme.
 */

/* --- Shop / category archive --- */

.woocommerce ul.products {
	display: grid;
	gap: var(--av-space-lg) var(--av-space-md);
	grid-template-columns: repeat(auto-fill, minmax(min(15rem, 100%), 1fr));
	margin: 0;
	padding: 0;
	list-style: none;
}

/* Woo ships float-based columns; neutralise them so the grid governs. */
.woocommerce ul.products li.product {
	position: relative;
	width: auto !important; /* overrides Woo's inline .columns-N widths */
	float: none;
	margin: 0;
	text-align: left;
}

.woocommerce ul.products li.product a img {
	margin-block-end: var(--av-space-xs);
	border-radius: var(--av-radius-sm);
	aspect-ratio: 3 / 4;
	object-fit: cover;
}

.woocommerce ul.products li.product:hover a img { transform: scale(1.02); }

.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--av-font-display);
	font-size: var(--av-text-lg);
	font-weight: var(--av-weight-regular);
	line-height: var(--av-leading-snug);
	padding: 0;
	margin-block-end: var(--av-space-3xs);
}

.woocommerce ul.products li.product .price {
	display: block;
	font-family: var(--av-font-body);
	font-size: var(--av-text-sm);
	font-weight: var(--av-weight-medium);
	color: var(--av-color-text);
}

.woocommerce ul.products li.product .price del {
	margin-inline-end: var(--av-space-3xs);
	color: var(--av-color-text-muted);
}

.woocommerce ul.products li.product .price ins {
	text-decoration: none;
	font-weight: var(--av-weight-semibold);
}

/* Sale flash - restrained, gold on navy rather than the default green. */
.woocommerce span.onsale {
	position: absolute;
	inset-block-start: var(--av-space-2xs);
	inset-inline-start: var(--av-space-2xs);
	min-height: 0;
	min-width: 0;
	margin: 0;
	padding: 0.25rem 0.6rem;
	border-radius: var(--av-radius-pill);
	background-color: var(--av-color-bg-inverse);
	color: var(--av-color-accent);
	font-size: var(--av-text-xs);
	font-weight: var(--av-weight-medium);
	letter-spacing: var(--av-tracking-wide);
	text-transform: uppercase;
	line-height: 1.4;
}

/* --- Single product --- */

.woocommerce div.product .product_title {
	font-size: var(--av-text-3xl);
	margin-block-end: var(--av-space-2xs);
}

.woocommerce div.product p.price {
	font-family: var(--av-font-body);
	font-size: var(--av-text-xl);
	font-weight: var(--av-weight-medium);
	color: var(--av-color-text);
	margin-block-end: var(--av-space-md);
}

.woocommerce div.product .woocommerce-product-details__short-description {
	max-width: 52ch;
	color: var(--av-color-text-muted);
	line-height: var(--av-leading-relaxed);
}

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

.woocommerce div.product form.cart .quantity input[type='number'] {
	width: 5rem;
	min-height: var(--av-tap-target);
	text-align: center;
}

.av-care-note {
	margin-block: calc(var(--av-space-md) * -1) var(--av-space-md);
	font-size: var(--av-text-sm);
}

/* --- Buttons: one visual language with .av-btn --- */

.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 {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: var(--av-tap-target);
	padding: var(--av-space-xs) var(--av-space-lg);
	border: 1px solid transparent;
	border-radius: var(--av-radius-sm);
	background-color: var(--av-color-bg-inverse);
	color: var(--av-color-text-inverse);
	font-family: var(--av-font-body);
	font-size: var(--av-text-sm);
	font-weight: var(--av-weight-medium);
	letter-spacing: var(--av-tracking-wide);
	text-transform: uppercase;
	line-height: 1.2;
	transition: background-color var(--av-duration-fast) var(--av-ease);
}

.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 {
	background-color: var(--av-navy-600);
	color: var(--av-color-text-inverse);
}

/* The one place gold leads: place-order. Navy text keeps contrast at ~8.3:1. */
.woocommerce #place_order,
.woocommerce a.checkout-button,
.woocommerce button.button.alt.checkout-button {
	background-color: var(--av-color-accent);
	color: var(--av-color-text-on-gold);
	width: 100%;
}

.woocommerce #place_order:hover,
.woocommerce a.checkout-button:hover {
	background-color: var(--av-color-accent-hover);
	color: var(--av-ivory-100);
}

/* --- Cart and checkout --- */

.woocommerce table.shop_table {
	border: 1px solid var(--av-color-border);
	border-radius: var(--av-radius-md);
	border-collapse: separate;
	border-spacing: 0;
}

.woocommerce table.shop_table th {
	font-family: var(--av-font-body);
	font-size: var(--av-text-xs);
	font-weight: var(--av-weight-semibold);
	letter-spacing: var(--av-tracking-wide);
	text-transform: uppercase;
	color: var(--av-color-text-muted);
}

.woocommerce-checkout #payment {
	border-radius: var(--av-radius-md);
	background-color: var(--av-color-bg-sunken);
}

.woocommerce-checkout #payment div.payment_box {
	background-color: var(--av-color-bg-raised);
	border-radius: var(--av-radius-sm);
	font-size: var(--av-text-sm);
}

.woocommerce-checkout #payment div.payment_box::before { display: none; }

/* Wide tables must scroll inside themselves, never widen the page. */
.woocommerce-cart .shop_table_responsive,
.woocommerce-checkout .shop_table_responsive {
	display: block;
	max-width: 100%;
	overflow-x: auto;
}

.av-shipping-progress td {
	font-size: var(--av-text-sm);
	color: var(--av-color-accent-hover);
}

/* --- Notices --- */

.woocommerce-message, .woocommerce-info, .woocommerce-error {
	border-top: 0;
	border-inline-start: 3px solid var(--av-color-info);
	border-radius: var(--av-radius-sm);
	background-color: var(--av-color-bg-raised);
	color: var(--av-color-text);
	font-size: var(--av-text-sm);
}

.woocommerce-message { border-inline-start-color: var(--av-color-success); }
.woocommerce-error { border-inline-start-color: var(--av-color-danger); }

.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before { display: none; }

/* --- Discretion notice, set by avelunexa-core --- */

.av-discretion {
	display: flex;
	gap: var(--av-space-2xs);
	margin-block: var(--av-space-md);
	padding: var(--av-space-xs) var(--av-space-sm);
	border: 1px solid var(--av-color-border);
	border-radius: var(--av-radius-md);
	background-color: var(--av-color-bg-sunken);
	font-size: var(--av-text-sm);
	color: var(--av-color-text-muted);
	line-height: var(--av-leading-normal);
}

.av-discretion strong {
	color: var(--av-color-text);
	font-weight: var(--av-weight-medium);
}

/* --- Mobile --- */

@media (max-width: 47.9375em) {
	.woocommerce ul.products {
		/* Two columns at 360px keeps the grid scannable; the 15rem floor above
		   would otherwise force a single column. */
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--av-space-md) var(--av-space-2xs);
	}

	.woocommerce ul.products li.product .woocommerce-loop-product__title {
		font-size: var(--av-text-base);
	}

	.woocommerce div.product .product_title { font-size: var(--av-text-2xl); }

	/* Full-width primary actions are easier to hit one-handed. */
	.woocommerce div.product form.cart .button,
	.woocommerce .cart .button,
	.woocommerce .cart input.button { width: 100%; }
}