/**
 * AHBenayan storefront.
 *
 * Restyles WooCommerce output — shop archive, single product, purchase
 * controls, and safe global tokens for cart / checkout / my account — inside
 * the same editorial system as the homepage.
 *
 * Presentation only: no product data, prices, checkout behaviour or cart logic.
 * Logical properties throughout; no hardcoded left/right.
 */

/* ===========================================================
   0. Protect the theme shell from WooCommerce's global rules

   WooCommerce ships `.woocommerce img { height: auto }` (0,1,1), which beats
   `.brand__signature` (0,1,0) and blew the header signature up to its
   intrinsic height on store pages only.
   =========================================================== */

.site-header .brand__signature {
	inline-size: auto;
	block-size: clamp(2rem, 4vw, 2.6rem);
}

.site-footer .site-footer__signature {
	inline-size: auto;
	block-size: 3rem;
}

@media (max-width: 47.999rem) {
	.site-header .brand__signature {
		block-size: 1.75rem;
	}

	.site-footer .site-footer__signature {
		block-size: 2.25rem;
	}
}

/* ===========================================================
   1. Store shell
   =========================================================== */

.ahb-store {
	padding-block: var(--wp--preset--spacing--70) var(--wp--preset--spacing--80);
}

.woocommerce .ahb-shell > h1.page-title,
.ahb-store .woocommerce-products-header__title {
	margin-block: 0 var(--wp--preset--spacing--30);
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--xx-large);
	font-weight: 800;
	color: var(--wp--preset--color--deep-green);
}

.ahb-store .term-description,
.ahb-store .woocommerce-product-details__short-description,
.ahb-store .page-description {
	max-inline-size: 44rem;
}

.woocommerce-products-header {
	margin-block-end: var(--wp--preset--spacing--50);
}

/* WooCommerce prints its archive description into this wrapper. */
.ahb-store .woocommerce-products-header + .woocommerce-notices-wrapper,
.ahb-store .woocommerce-result-count {
	margin-block: 0;
}

.ahb-store header.woocommerce-products-header,
.ahb-store .ahb-eyebrow {
	max-inline-size: 44rem;
}

.ahb-store .woocommerce-archive-description {
	max-inline-size: 44rem;
	margin-block-end: var(--wp--preset--spacing--60);
	padding-block-end: var(--wp--preset--spacing--50);
	border-block-end: var(--wp--custom--rule--hairline) solid var(--wp--preset--color--sand);
	color: var(--wp--preset--color--charcoal);
}

/* ===========================================================
   2. Product grid
   =========================================================== */

/*
 * WooCommerce clears floats with `ul.products::before/::after { content: " " }`.
 * In a grid (or flex) container those pseudo-elements become real items: the
 * ::before took the first cell and pushed the first product onto row two, which
 * is why three products rendered as 2 + 1 instead of one row.
 */
.woocommerce .ahb-store ul.products::before,
.woocommerce .ahb-store ul.products::after,
.ahb-store ul.products::before,
.ahb-store ul.products::after,
.woocommerce ul.products::before,
.woocommerce ul.products::after {
	content: none;
}

.woocommerce .ahb-store ul.products,
.ahb-store ul.products,
.woocommerce ul.products {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--wp--preset--spacing--60);
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (min-width: 34rem) {
	.woocommerce .ahb-store ul.products,
	.ahb-store ul.products,
	.woocommerce ul.products {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 60rem) {
	.woocommerce .ahb-store ul.products,
	.ahb-store ul.products,
	.woocommerce ul.products {
		grid-template-columns: repeat(3, 1fr);
	}
}

.woocommerce .ahb-store ul.products li.product,
.ahb-store ul.products li.product,
.woocommerce ul.products li.product {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	inline-size: auto;
	max-inline-size: none;
	margin: 0;
	padding: 0;
	float: none;
	text-align: start;
}

/* Consistent image box: posters are contained, never cropped through text. */
.woocommerce .ahb-store ul.products li.product a img,
.ahb-store ul.products li.product a img,
.woocommerce ul.products li.product a img {
	aspect-ratio: 4 / 5;
	inline-size: 100%;
	object-fit: contain;
	margin-block-end: var(--wp--preset--spacing--30);
	padding: var(--wp--preset--spacing--30);
	border: var(--wp--custom--rule--hairline) solid var(--wp--preset--color--sand);
	border-radius: var(--wp--custom--radius--none);
	background-color: var(--wp--preset--color--white);
}

.ahb-store ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	margin: 0;
	padding: 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 700;
	line-height: 1.35;
	color: var(--wp--preset--color--deep-green);
}

.ahb-store ul.products li.product .price,
.woocommerce ul.products li.product .price {
	margin: 0;
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 600;
	color: var(--wp--preset--color--charcoal);
}

.ahb-store ul.products li.product .price del,
.woocommerce ul.products li.product .price del {
	margin-inline-end: 0.5rem;
	color: var(--wp--preset--color--muted);
	font-weight: 400;
	opacity: 1;
}

.ahb-store ul.products li.product .price ins,
.woocommerce ul.products li.product .price ins {
	text-decoration: none;
	background: none;
	color: var(--wp--preset--color--deep-green);
}

.ahb-card__cta {
	align-self: start;
	margin-block-start: var(--wp--preset--spacing--20);
}

/* Sale marker: a small label pinned to the image frame, not a floating badge.
   Gold is the hairline, never the text colour at this size. */
.woocommerce span.onsale,
.woocommerce ul.products li.product .onsale,
.ahb-product__media .onsale {
	position: absolute;
	inset-block-start: 0;
	inset-inline-start: 0;
	/* WooCommerce anchors the opposite edge, which left both insets at 0 and
	   stretched the label across the whole card. Pin one edge only. */
	inset-inline-end: auto;
	inset-block-end: auto;
	z-index: 2;
	display: inline-block;
	inline-size: auto;
	min-block-size: 0;
	min-inline-size: 0;
	margin: 0;
	padding: 0.1rem 0.55rem;
	border: var(--wp--custom--rule--hairline) solid var(--wp--preset--color--gold);
	border-radius: var(--wp--custom--radius--none);
	background-color: var(--wp--preset--color--white);
	color: var(--wp--preset--color--charcoal);
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	letter-spacing: 0.04em;
	line-height: 1.7;
}

.ahb-store ul.products li.product,
.ahb-product__media {
	position: relative;
}

/* ===========================================================
   3. Single product
   =========================================================== */

.ahb-product {
	display: grid;
	gap: var(--wp--preset--spacing--70);
}

.ahb-product__main {
	display: grid;
	gap: var(--wp--preset--spacing--60);
	align-items: start;
}

@media (min-width: 60rem) {
	.ahb-product__main {
		/* Balanced columns, narrower gutter: the information should read as part
		   of the same composition as the visual, not float away from it. */
		grid-template-columns: 1fr 1fr;
		gap: var(--wp--preset--spacing--60);
		align-items: start;
	}
}

.ahb-product__info > * {
	margin-block: 0;
}

.ahb-product__info > * + * {
	margin-block-start: var(--wp--preset--spacing--30);
}

.ahb-product .product_title {
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--xx-large);
	font-weight: 800;
	line-height: 1.2;
	color: var(--wp--preset--color--deep-green);
	text-wrap: balance;
}

.ahb-product .woocommerce-product-details__short-description {
	max-inline-size: 34rem;
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.7;
	color: var(--wp--preset--color--charcoal);
}

/* These images carry padding, so they must size border-box or they push past
   their container (7px of inline-start overflow at 390px before this). */
.ahb-store img,
.ahb-product__media img,
.woocommerce ul.products li.product a img {
	box-sizing: border-box;
	max-inline-size: 100%;
}

.ahb-product__media img {
	inline-size: 100%;
	block-size: auto;
	padding: var(--wp--preset--spacing--40);
	border: var(--wp--custom--rule--hairline) solid var(--wp--preset--color--sand);
	background-color: var(--wp--preset--color--white);
}

.ahb-product__media .woocommerce-product-gallery__wrapper {
	margin: 0;
}

/* Key facts ------------------------------------------------- */

.ahb-product__facts {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--20);
	margin: 0;
	padding: 0;
	list-style: none;
}

.ahb-fact {
	padding: 0.25rem 0.7rem;
	border: var(--wp--custom--rule--hairline) solid var(--wp--preset--color--sand);
	background-color: var(--wp--preset--color--white);
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	color: var(--wp--preset--color--green);
}

/* Editorial detail sections ---------------------------------- */

.ahb-product__details {
	display: grid;
	gap: var(--wp--preset--spacing--60);
	max-inline-size: 46rem;
}

.ahb-product__section {
	padding-block-start: var(--wp--preset--spacing--40);
	border-block-start: var(--wp--custom--rule--hairline) solid var(--wp--preset--color--sand);
}

.ahb-product__section-title {
	margin-block: 0 var(--wp--preset--spacing--30);
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 700;
	color: var(--wp--preset--color--deep-green);
}

.ahb-product__prose {
	max-inline-size: 38rem;
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.95;
	overflow-wrap: anywhere;
}

.ahb-product__prose > * + * {
	margin-block-start: var(--wp--preset--spacing--30);
}

/* Disclosures ------------------------------------------------ */

.ahb-disclosure > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--30);
	cursor: pointer;
	list-style: none;
}

.ahb-disclosure > summary::-webkit-details-marker {
	display: none;
}

.ahb-disclosure > summary::after {
	content: "+";
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 400;
	color: var(--wp--preset--color--green);
}

.ahb-disclosure[open] > summary::after {
	content: "\2013";
}

.ahb-disclosure > summary:focus-visible {
	outline: 2px solid var(--wp--preset--color--gold);
	outline-offset: 3px;
}

.ahb-disclosure > ul {
	margin-block-start: var(--wp--preset--spacing--30);
}

@media (min-width: 48rem) {
	/* Expanded on desktop; the summary reads as a heading, not a control. */
	.ahb-disclosure > summary {
		cursor: default;
	}

	.ahb-disclosure > summary::after {
		display: none;
	}
}

.ahb-product__includes,
.ahb-product__delivery {
	margin: 0;
	padding-inline-start: 1.15rem;
}

.ahb-product__includes li + li,
.ahb-product__delivery li + li {
	margin-block-start: 0.4rem;
}

/* Related products ------------------------------------------- */

.related.products > h2,
.up-sells > h2 {
	margin-block: 0 var(--wp--preset--spacing--40);
	padding-block-start: var(--wp--preset--spacing--40);
	border-block-start: var(--wp--custom--rule--hairline) solid var(--wp--preset--color--sand);
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--x-large);
	color: var(--wp--preset--color--deep-green);
}

/* ===========================================================
   4. Purchase controls
   =========================================================== */

.ahb-product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 600;
	color: var(--wp--preset--color--charcoal);
}

.woocommerce div.product p.price del,
.woocommerce div.product span.price del {
	margin-inline-end: 0.6rem;
	font-size: var(--wp--preset--font-size--large);
	font-weight: 400;
	color: var(--wp--preset--color--muted);
	opacity: 1;
}

.woocommerce div.product p.price ins,
.woocommerce div.product span.price ins {
	text-decoration: none;
	background: none;
	color: var(--wp--preset--color--deep-green);
}

.woocommerce div.product form.cart {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	gap: var(--wp--preset--spacing--30);
	margin-block: var(--wp--preset--spacing--40) 0;
}

.woocommerce .quantity {
	display: inline-flex;
}

.woocommerce .quantity .qty {
	inline-size: 5rem;
	min-block-size: 3rem;
	padding-inline: 0.75rem;
	border: var(--wp--custom--rule--hairline) solid var(--wp--preset--color--sand);
	border-radius: var(--wp--custom--radius--sm);
	background-color: var(--wp--preset--color--white);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--medium);
	color: var(--wp--preset--color--charcoal);
	text-align: center;
}

/* Primary purchase button: deep green on paper, never purple. */
.woocommerce button.button.alt,
.woocommerce a.button.alt,
.woocommerce input.button.alt,
.woocommerce button.button,
.woocommerce a.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-block-size: 3rem;
	padding-block: 0.85rem;
	padding-inline: 1.6rem;
	border: var(--wp--custom--rule--hairline) solid var(--wp--preset--color--deep-green);
	border-radius: var(--wp--custom--radius--sm);
	background-color: var(--wp--preset--color--deep-green);
	color: var(--wp--preset--color--paper);
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	text-shadow: none;
	transition: background-color 0.18s ease, color 0.18s ease;
}

.woocommerce button.button.alt:hover,
.woocommerce a.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce button.button:hover,
.woocommerce a.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover {
	background-color: var(--wp--preset--color--green);
	border-color: var(--wp--preset--color--green);
	color: var(--wp--preset--color--white);
}

.woocommerce .button:focus-visible {
	outline: 2px solid var(--wp--preset--color--gold);
	outline-offset: 3px;
}

/* Secondary actions read as quiet outlines. */
.woocommerce a.button.wc-forward:not(.checkout),
.woocommerce .cart .button[name="update_cart"] {
	background-color: transparent;
	color: var(--wp--preset--color--deep-green);
}

.woocommerce a.button.wc-forward:not(.checkout):hover,
.woocommerce .cart .button[name="update_cart"]:hover {
	background-color: var(--wp--preset--color--deep-green);
	color: var(--wp--preset--color--paper);
}

/* Stock and status messages --------------------------------- */

.woocommerce div.product .stock,
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-error {
	border-block-start: var(--wp--custom--rule--accent) solid var(--wp--preset--color--green);
	border-radius: var(--wp--custom--radius--none);
	background-color: var(--wp--preset--color--white);
	color: var(--wp--preset--color--charcoal);
	font-size: var(--wp--preset--font-size--small);
}

.woocommerce div.product .stock {
	border: 0;
	background: none;
	color: var(--wp--preset--color--green);
	font-weight: 600;
}

.woocommerce .woocommerce-info::before,
.woocommerce .woocommerce-message::before {
	color: var(--wp--preset--color--green);
}

.woocommerce .woocommerce-error {
	border-block-start-color: var(--wp--preset--color--signal-red);
}

.woocommerce .woocommerce-error::before {
	color: var(--wp--preset--color--signal-red);
}

/* ===========================================================
   5. Cart / Checkout / My Account — safe global tokens only
   No layout or logic changes in this phase.
   =========================================================== */

.woocommerce table.shop_table,
.woocommerce table.shop_table td,
.woocommerce table.shop_table th {
	border-radius: var(--wp--custom--radius--none);
	border-color: var(--wp--preset--color--sand);
	font-size: var(--wp--preset--font-size--small);
}

.woocommerce table.shop_table th {
	font-family: var(--wp--preset--font-family--heading);
	color: var(--wp--preset--color--deep-green);
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce .select2-container .select2-selection--single {
	min-block-size: 3rem;
	padding: 0.7rem 0.9rem;
	border: var(--wp--custom--rule--hairline) solid var(--wp--preset--color--sand);
	border-radius: var(--wp--custom--radius--sm);
	background-color: var(--wp--preset--color--white);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--medium);
	color: var(--wp--preset--color--charcoal);
}

.woocommerce form .form-row label,
.woocommerce-checkout h3,
.woocommerce-account h2 {
	font-family: var(--wp--preset--font-family--heading);
	color: var(--wp--preset--color--deep-green);
}

.woocommerce-checkout #payment,
.woocommerce-cart .cart_totals,
.woocommerce-account .woocommerce-MyAccount-navigation {
	border-radius: var(--wp--custom--radius--none);
	background-color: var(--wp--preset--color--white);
}

.woocommerce-checkout #payment ul.payment_methods {
	border-block-end-color: var(--wp--preset--color--sand);
}

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

.woocommerce-account .woocommerce-MyAccount-navigation li {
	border-block-end: var(--wp--custom--rule--hairline) solid var(--wp--preset--color--sand);
}

.woocommerce-account .woocommerce-MyAccount-navigation li a {
	display: block;
	padding-block: 0.7rem;
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--charcoal);
	text-decoration: none;
}

.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
	color: var(--wp--preset--color--deep-green);
	text-decoration: underline;
	text-underline-offset: 0.35em;
}

/* ===========================================================
   6. Mobile store
   =========================================================== */

@media (max-width: 47.999rem) {

	.ahb-store {
		padding-block: clamp(2.5rem, 7vw, 3.5rem) clamp(3rem, 8vw, 4rem);
	}

	.ahb-product {
		gap: var(--wp--preset--spacing--60);
	}

	.ahb-product__main {
		gap: var(--wp--preset--spacing--50);
	}

	.ahb-product .product_title {
		font-size: 1.6rem;
	}

	.ahb-product .woocommerce-product-details__short-description {
		font-size: var(--wp--preset--font-size--medium);
	}

	/* The poster never eats the first screen. */
	.ahb-product__media img {
		max-block-size: 46vh;
		inline-size: auto;
		margin-inline: auto;
		padding: var(--wp--preset--spacing--30);
	}

	.woocommerce div.product form.cart {
		gap: var(--wp--preset--spacing--20);
	}

	.woocommerce div.product form.cart .button {
		flex: 1 1 auto;
	}

	.ahb-product__section-title {
		font-size: var(--wp--preset--font-size--large);
	}

	/* Compact media-object cards: a visitor can scan all three products
	   without scrolling through three near-full-screen posters. */
	.ahb-store ul.products,
	.woocommerce .ahb-store ul.products {
		gap: var(--wp--preset--spacing--40);
	}

	.ahb-store ul.products li.product,
	.woocommerce .ahb-store ul.products li.product {
		display: block;
		padding-block-end: var(--wp--preset--spacing--40);
		border-block-end: var(--wp--custom--rule--hairline) solid var(--wp--preset--color--sand);
	}

	.ahb-store ul.products li.product > a.woocommerce-LoopProduct-link {
		display: grid;
		grid-template-columns: 104px 1fr;
		column-gap: var(--wp--preset--spacing--30);
		row-gap: 0.25rem;
		align-items: start;
		text-decoration: none;
	}

	.ahb-store ul.products li.product > a.woocommerce-LoopProduct-link img,
	.woocommerce .ahb-store ul.products li.product a img {
		grid-row: 1 / span 2;
		aspect-ratio: 3 / 4;
		inline-size: 104px;
		margin-block-end: 0;
		padding: var(--wp--preset--spacing--20);
	}

	.ahb-store ul.products li.product .woocommerce-loop-product__title {
		grid-column: 2;
		font-size: var(--wp--preset--font-size--medium);
		line-height: 1.4;
	}

	.ahb-store ul.products li.product .price {
		grid-column: 2;
		align-self: start;
	}

	.ahb-card__cta {
		/* Compact, aligned to the card's start edge — not a full-width slab. */
		display: inline-flex;
		inline-size: auto;
		margin-block-start: var(--wp--preset--spacing--30);
		margin-inline-start: calc(104px + var(--wp--preset--spacing--30));
		padding-block: 0.6rem;
		padding-inline: 1.1rem;
	}

	/* Tighter purchase block; the CTA stays dominant. */
	.ahb-product__info > * + * {
		margin-block-start: var(--wp--preset--spacing--20);
	}

	.ahb-product__facts {
		gap: 0.35rem;
	}

	.ahb-product__details {
		gap: var(--wp--preset--spacing--40);
	}

	.ahb-product__prose {
		font-size: var(--wp--preset--font-size--small);
		line-height: 1.9;
	}

	.ahb-product__section {
		padding-block-start: var(--wp--preset--spacing--30);
	}
}