/* ========================================================================== ZELLIGE ATELIER — WOOCOMMERCE Catalog-first, quote-based commerce. Built on the tokens in main.css. Product grids mirror .za-card-grid; media mirrors .za-card__media. ========================================================================== */

/* -------------------------------------------------------------------------- 1. CATALOG HEADER — result count, ordering -------------------------------------------------------------------------- */
.za-woo-wrapper .woocommerce {
	display: block;
}
.woocommerce .woocommerce-result-count {
	margin: 0 0 var(--za-space-md); font-family: var(--za-font-body); font-size: var(--za-text-sm);
	text-transform: uppercase; letter-spacing: 0.1em; color: var(--za-charcoal-70);
}
.woocommerce .woocommerce-ordering {
	margin: 0 0 var(--za-space-md);
}
.woocommerce .woocommerce-ordering select {
	width: auto; min-width: 12rem;
}

/* Default WC breadcrumb is suppressed — the theme prints its own */
.woocommerce .woocommerce-breadcrumb, .woocommerce-breadcrumb {
	display: none;
}

/* -------------------------------------------------------------------------- 2. PRODUCT LOOP — grid + card -------------------------------------------------------------------------- */
.woocommerce ul.products, .woocommerce-page ul.products {
	display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
	gap: clamp(1.5rem, 3vw, 2.5rem); margin: 0; padding: 0; list-style: none;
}
.woocommerce ul.products::before, .woocommerce ul.products::after {
	content: none; display: none;
}
@media (min-width: 48em) {
	.woocommerce ul.products, .woocommerce-page ul.products {
	grid-template-columns: repeat(3, 1fr);
	}
}
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
	position: relative; float: none; width: auto; margin: 0; display: flex; flex-direction: column; text-align: left;
}
.woocommerce ul.products li.product .woocommerce-loop-product__link {
	display: flex; flex-direction: column; text-decoration: none; color: inherit;
}
.woocommerce ul.products li.product a img {
	display: block; width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; margin: 0;
	border: 1px solid rgba(173, 145, 106, 0.5); transition: transform 600ms var(--za-ease);
}
.woocommerce ul.products li.product:hover a img, .woocommerce ul.products li.product a:hover img {
	transform: scale(1.02);
}
.woocommerce ul.products li.product .woocommerce-loop-product__title, .woocommerce ul.products li.product h2 {
	margin: 0; padding: 0.75rem 0 0; font-family: var(--za-font-display); font-size: 1.15rem; font-weight: 500;
	line-height: 1.2; color: var(--za-green);
}
.woocommerce ul.products li.product:hover .woocommerce-loop-product__title, .woocommerce ul.products li.product:hover h2 {
	text-decoration: underline; text-decoration-thickness: 1px; text-decoration-color: var(--za-terracotta);
	text-underline-offset: 0.16em;
}

/* Specification teaser (inc/woo.php) */
.woocommerce ul.products li.product .za-card__spec {
	margin-top: 0.5rem; font-family: var(--za-font-body); font-size: 0.75rem; text-transform: uppercase;
	letter-spacing: 0.08em; color: var(--za-charcoal-70);
}

/* Prices stay small and quiet */
.woocommerce ul.products li.product .price {
	display: block; margin: 0.35rem 0 0; font-family: var(--za-font-body); font-size: var(--za-text-sm);
	color: var(--za-charcoal-70);
}
.woocommerce ul.products li.product .price del {
	color: var(--za-charcoal-55);
}
.woocommerce ul.products li.product .price ins {
	text-decoration: none; font-weight: 600;
}
.woocommerce-Price-amount {
	font-family: var(--za-font-body); font-size: 0.8125rem; color: var(--za-charcoal-70);
}
.woocommerce ul.products li.product .woocommerce-Price-currencySymbol {
	font-size: 0.85em;
}

/* Quote button replaces add-to-cart */
.woocommerce ul.products li.product .za-card__quote.button, .woocommerce ul.products li.product a.button, .woocommerce ul.products li.product .button {
	align-self: flex-start; margin: 1rem 0 0; padding: 0.75rem 1.25rem; font-family: var(--za-font-body);
	font-size: var(--za-text-xs); font-weight: 600; text-transform: uppercase; letter-spacing: 0.12em; line-height: 1.2;
	color: var(--za-charcoal); background-color: transparent; border: 1px solid var(--za-charcoal);
	border-radius: var(--za-radius); text-decoration: none;
	transition: background-color var(--za-transition), color var(--za-transition), border-color var(--za-transition);
}
.woocommerce ul.products li.product .za-card__quote.button:hover, .woocommerce ul.products li.product a.button:hover, .woocommerce ul.products li.product .button:hover, .woocommerce ul.products li.product .button:focus-visible {
	background-color: var(--za-green); border-color: var(--za-green); color: var(--za-ivory);
}

/* Loop badges (sale / out of stock) */
.woocommerce ul.products li.product .onsale, .woocommerce span.onsale {
	top: 0; left: 0; right: auto; z-index: 5; display: inline-block; min-width: 0; min-height: 0; margin: 0;
	padding: 0.5rem 0.75rem; background-color: var(--za-brass); color: var(--za-ivory);
	font-family: var(--za-font-body); font-size: 0.625rem; font-weight: 600; line-height: 1; text-transform: uppercase;
	letter-spacing: 0.14em; border-radius: var(--za-radius);
}
.woocommerce ul.products li.product .stock.out-of-stock {
	position: absolute; top: 0; left: 0; z-index: 5; margin: 0; padding: 0.5rem 0.75rem;
	background-color: var(--za-charcoal); color: var(--za-ivory); font-family: var(--za-font-body); font-size: 0.625rem;
	font-weight: 600; text-transform: uppercase; letter-spacing: 0.14em;
}

/* -------------------------------------------------------------------------- 3. SINGLE PRODUCT -------------------------------------------------------------------------- */
.woocommerce div.product {
	position: relative; margin-bottom: var(--za-space-xl);
}
.woocommerce div.product::after {
	content: ""; display: table; clear: both;
}
.woocommerce div.product .woocommerce-product-gallery {
	margin-bottom: var(--za-space-lg);
}
.woocommerce div.product div.images {
	float: left; width: 50%; margin-bottom: var(--za-space-lg);
}
.woocommerce div.product div.summary {
	float: right; width: 46%; margin-bottom: var(--za-space-lg);
}
@media (max-width: 47.98em) {
	.woocommerce div.product div.images, .woocommerce div.product div.summary {
	float: none; width: 100%;
	}
}
.woocommerce div.product .woocommerce-product-gallery__wrapper {
	margin: 0;
}
.woocommerce div.product div.images img {
	border: 1px solid rgba(173, 145, 106, 0.5);
}
.woocommerce div.product div.images .flex-control-thumbs {
	display: grid; grid-template-columns: repeat(4, 1fr); gap: 0.5rem; margin: 0.75rem 0 0; padding: 0;
	list-style: none;
}
.woocommerce div.product div.images .flex-control-thumbs li {
	float: none; width: auto; margin: 0;
}
.woocommerce div.product div.images .flex-control-thumbs img {
	border: 1px solid rgba(173, 145, 106, 0.35); cursor: pointer;
}
.woocommerce div.product div.images .flex-control-thumbs li img.flex-active {
	border-color: var(--za-terracotta);
}
.woocommerce div.product .product_title {
	margin: 0 0 var(--za-space-md); font-family: var(--za-font-display); font-size: clamp(2rem, 4.5vw, 3rem);
	font-weight: 500; line-height: 1.08; color: var(--za-green);
}
.woocommerce div.product p.price, .woocommerce div.product span.price {
	margin: 0 0 var(--za-space-md); font-family: var(--za-font-body); font-size: 1rem; color: var(--za-charcoal-70);
}
.woocommerce div.product .woocommerce-product-details__short-description {
	margin-bottom: var(--za-space-md); font-size: 1.0625rem; line-height: 1.75; color: var(--za-charcoal);
}
.woocommerce div.product .product_meta {
	padding-top: var(--za-space-md); border-top: 1px solid var(--za-hairline-sand); font-family: var(--za-font-body);
	font-size: var(--za-text-sm); text-transform: uppercase; letter-spacing: 0.08em; color: var(--za-charcoal-70);
}

/* Quote + sample CTAs (inc/woo.php) */
.za-single-ctas {
	display: flex; flex-wrap: wrap; align-items: center; gap: var(--za-space-sm); margin: var(--za-space-lg) 0;
}
.za-single-ctas__note {
	flex: 1 1 100%; margin: 0; font-family: var(--za-font-body); font-size: var(--za-text-sm);
	color: var(--za-charcoal-70);
}

/* Specification block */
.za-single-spec {
	margin: var(--za-space-xl) 0; padding: clamp(1.5rem, 4vw, 2.5rem); background-color: var(--za-tint);
	border-top: 1px solid var(--za-hairline);
}
.za-single-spec__title {
	margin: 0 0 var(--za-space-md); font-family: var(--za-font-display); font-size: clamp(1.5rem, 3vw, 2rem);
	font-weight: 500; color: var(--za-green);
}
.za-single-spec .za-spec-table th {
	width: 40%;
}

/* -------------------------------------------------------------------------- 4. QUANTITY + VARIATIONS -------------------------------------------------------------------------- */
.woocommerce .quantity .qty {
	width: 4.5rem; text-align: center;
}
.woocommerce div.product form.cart {
	margin-bottom: var(--za-space-md);
}
.woocommerce div.product form.cart .variations {
	margin-bottom: var(--za-space-md); border-collapse: collapse;
}
.woocommerce div.product form.cart .variations th, .woocommerce div.product form.cart .variations td {
	padding: 0.4rem 0; border: 0; vertical-align: middle;
}
.woocommerce div.product form.cart .variations label {
	margin: 0; font-family: var(--za-font-body); font-size: var(--za-text-sm); text-transform: uppercase;
	letter-spacing: 0.08em; color: var(--za-charcoal-80);
}
.woocommerce div.product form.cart .reset_variations {
	font-family: var(--za-font-body); font-size: var(--za-text-xs); text-transform: uppercase; letter-spacing: 0.08em;
	color: var(--za-terracotta); text-decoration: underline;
}
.woocommerce div.product .woocommerce-variation-price {
	margin-bottom: var(--za-space-sm);
}

/* -------------------------------------------------------------------------- 5. TABS + DESCRIPTION PANELS -------------------------------------------------------------------------- */
.woocommerce div.product .woocommerce-tabs {
	clear: both; padding-top: var(--za-space-lg); border-top: 1px solid var(--za-hairline-sand);
}
.woocommerce div.product .woocommerce-tabs ul.tabs {
	display: flex; flex-wrap: wrap; gap: var(--za-space-md); margin: 0 0 var(--za-space-lg); padding: 0;
	list-style: none; border-bottom: 1px solid var(--za-hairline);
}
.woocommerce div.product .woocommerce-tabs ul.tabs::before, .woocommerce div.product .woocommerce-tabs ul.tabs::after {
	content: none; display: none;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li {
	margin: 0; padding: 0; background: none; border: 0; border-radius: var(--za-radius);
}
.woocommerce div.product .woocommerce-tabs ul.tabs li::before, .woocommerce div.product .woocommerce-tabs ul.tabs li::after {
	content: none; display: none;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	display: block; padding: 0.75rem 0; font-family: var(--za-font-body); font-size: var(--za-text-sm);
	font-weight: 500; text-transform: uppercase; letter-spacing: 0.12em; color: var(--za-charcoal-70);
	text-decoration: none; border-bottom: 2px solid transparent;
	transition: color var(--za-transition), border-color var(--za-transition);
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover {
	color: var(--za-green);
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
	color: var(--za-green); border-bottom-color: var(--za-terracotta);
}
.woocommerce div.product .woocommerce-tabs .panel {
	margin: 0; padding: 0; font-size: 1.0625rem; line-height: 1.75; color: var(--za-charcoal);
}
.woocommerce div.product .woocommerce-tabs .panel h2 {
	font-family: var(--za-font-display); font-size: var(--za-h3); font-weight: 500; color: var(--za-green);
}

/* -------------------------------------------------------------------------- 6. REVIEWS / RATINGS HIDDEN (no published reviews) -------------------------------------------------------------------------- */
.woocommerce .star-rating, .woocommerce ul.products li.product .star-rating, .woocommerce div.product .woocommerce-product-rating {
	display: none;
}
.woocommerce #reviews {
	display: none;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.reviews_tab {
	display: none;
}

/* -------------------------------------------------------------------------- 7. RELATED / UPSELLS -------------------------------------------------------------------------- */
.woocommerce .related.products, .woocommerce .upsells.products {
	clear: both; margin-top: var(--za-section-y); padding-top: var(--za-space-lg);
	border-top: 1px solid var(--za-hairline-sand);
}
.woocommerce .related.products > h2, .woocommerce .upsells.products > h2 {
	margin: 0 0 var(--za-space-lg); font-family: var(--za-font-display); font-size: var(--za-h2); font-weight: 500;
	color: var(--za-green);
}
.woocommerce .related.products ul.products, .woocommerce .upsells.products ul.products {
	display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
	gap: clamp(1.5rem, 3vw, 2.5rem);
}

/* -------------------------------------------------------------------------- 8. MESSAGES + NOTICES -------------------------------------------------------------------------- */
.woocommerce-message, .woocommerce-info, .woocommerce-error, .woocommerce-noreviews, .woocommerce p.no-comments {
	position: relative; margin: 0 0 var(--za-space-md); padding: 1rem 1.25rem; background-color: var(--za-tint);
	border: 0; border-left: 2px solid var(--za-brass); border-radius: var(--za-radius);
	font-family: var(--za-font-body); font-size: 0.9375rem; line-height: 1.6; color: var(--za-charcoal);
	list-style: none;
}
.woocommerce-message {
	border-left-color: var(--za-green);
}
.woocommerce-info {
	border-left-color: var(--za-brass);
}
.woocommerce-error {
	border-left-color: var(--za-terracotta);
}
.woocommerce-error li {
	margin-bottom: 0.25rem;
}
.woocommerce-message::before, .woocommerce-info::before, .woocommerce-error::before {
	display: none;
}
.woocommerce-message .button, .woocommerce-info .button {
	margin-left: 0.75rem; padding: 0; font-size: var(--za-text-xs); text-transform: uppercase; letter-spacing: 0.12em;
	color: var(--za-green); background: none; border: 0; text-decoration: underline;
}

/* -------------------------------------------------------------------------- 9. WOO PAGINATION -------------------------------------------------------------------------- */
.woocommerce nav.woocommerce-pagination {
	margin-top: var(--za-space-xl);
}
.woocommerce nav.woocommerce-pagination ul {
	display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 0; padding: 0; border: 0; list-style: none;
}
.woocommerce nav.woocommerce-pagination ul li {
	float: none; margin: 0; border: 0; overflow: visible;
}
.woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span {
	display: inline-flex; align-items: center; justify-content: center; min-width: 2.5rem; height: 2.5rem;
	padding: 0 0.6rem; font-family: var(--za-font-body); font-size: var(--za-text-sm); color: var(--za-charcoal);
	text-decoration: none; border: 1px solid transparent;
	transition: color var(--za-transition), border-color var(--za-transition), background-color var(--za-transition);
}
.woocommerce nav.woocommerce-pagination ul li a:hover, .woocommerce nav.woocommerce-pagination ul li a:focus-visible {
	border-color: var(--za-hairline); color: var(--za-terracotta);
}
.woocommerce nav.woocommerce-pagination ul li span.current {
	background-color: var(--za-green); border-color: var(--za-green); color: var(--za-ivory);
}

/* -------------------------------------------------------------------------- 10. CART + CHECKOUT (reachable pages, styled to not break) -------------------------------------------------------------------------- */
.woocommerce table.shop_table {
	margin: 0 0 var(--za-space-lg); border: 1px solid var(--za-hairline-sand); border-collapse: collapse;
	border-radius: var(--za-radius);
}
.woocommerce table.shop_table th {
	padding: 0.75rem 1rem; font-family: var(--za-font-body); font-size: var(--za-text-xs); font-weight: 500;
	text-transform: uppercase; letter-spacing: 0.1em; color: var(--za-brass);
	border-bottom: 1px solid var(--za-hairline);
}
.woocommerce table.shop_table td {
	padding: 0.85rem 1rem; font-size: 0.9375rem; color: var(--za-charcoal);
	border-top: 1px solid var(--za-hairline-sand);
}
.woocommerce-cart table.cart img {
	width: 5rem; border: 1px solid rgba(173, 145, 106, 0.4);
}
.woocommerce-cart table.cart .product-remove a.remove {
	color: var(--za-terracotta); background: none;
}
.woocommerce .cart-collaterals .cart_totals, .woocommerce-page .cart-collaterals .cart_totals {
	float: none; width: 100%;
}
.woocommerce-cart .cart-collaterals .cart_totals table {
	border: 0;
}
.woocommerce form.checkout_coupon, .woocommerce form.login, .woocommerce form.register {
	margin-bottom: var(--za-space-md); padding: var(--za-space-lg); border: 1px solid var(--za-hairline-sand);
	border-radius: var(--za-radius);
}
.woocommerce #order_review, .woocommerce-checkout #payment {
	background: transparent; border-radius: var(--za-radius);
}
.woocommerce-checkout #payment ul.payment_methods {
	border-bottom: 1px solid var(--za-hairline-sand);
}
.woocommerce #payment .form-row.place-order {
	padding: 0;
}
.woocommerce .woocommerce-form__label-for-checkbox {
	font-size: 0.9375rem;
}
.woocommerce .select2-container .select2-selection--single {
	height: auto; padding: 0.6rem 1rem; background-color: var(--za-white); border: 1px solid var(--za-field-border);
	border-radius: var(--za-radius);
}

/* Borderless round avatars/thumbnails are not part of this identity */
.woocommerce img.avatar {
	border-radius: var(--za-radius);
}

/* -------------------------------------------------------------------------- 11. EMPTY CATALOG / NO PRODUCTS -------------------------------------------------------------------------- */
.woocommerce .woocommerce-info.woocommerce-no-products-found, .woocommerce ul.products li.product-category {
	text-align: left;
}
.woocommerce ul.products li.product .woocommerce-loop-category__title {
	font-family: var(--za-font-display); font-size: 1.15rem; font-weight: 500; color: var(--za-green);
}
.woocommerce ul.products li.product .woocommerce-loop-category__title .count {
	background: none; color: var(--za-charcoal-70);
}