body#at-theme {
/*
 * Shop archive — category, brand, search results, shop root.
 * Two-column layout: filter sidebar + product grid.
 */

.at-archive {
	padding-block: var(--at-space-6) var(--at-space-8);
}

.at-archive__header {
	margin-bottom: var(--at-space-6);
}
.at-archive__header .at-eyebrow {
	margin-bottom: var(--at-space-3);
}
.at-archive__title {
	font-family: var(--at-font-display);
	font-size: clamp(2rem, 5vw, 3rem);
	color: var(--at-headline);
	text-transform: uppercase;
	letter-spacing: var(--at-tracking-tight);
	line-height: 1.05;
	margin: 0 0 var(--at-space-3);
}
.at-archive__header .term-description,
.at-archive__header .woocommerce-products-header__title + p {
	color: var(--at-body);
	max-width: 60ch;
}

.at-archive__layout {
	display: grid;
	grid-template-columns: 240px 1fr;
	gap: var(--at-space-6);
	align-items: start;
}

/* Sidebar */
.at-archive__sidebar { position: relative; }
.at-archive__filters-toggle {
	display: none;
	background: var(--at-surface);
	border: 1px solid var(--at-divider);
	color: var(--at-body);
	padding: var(--at-space-3) var(--at-space-4);
	border-radius: var(--at-radius-xs);
	cursor: pointer;
	width: 100%;
	text-align: left;
}
.at-archive__filters-toggle:hover { color: var(--at-highlight); border-color: var(--at-highlight); }

.at-archive__sidebar-inner > * {
	margin-bottom: var(--at-space-5);
}

/* Widget skin */
.at-widget {
	background-color: transparent;
}
.at-widget__title {
	font-family: var(--at-font-mono);
	font-size: var(--at-fs-eyebrow);
	color: var(--at-headline);
	text-transform: uppercase;
	letter-spacing: var(--at-tracking-eyebrow);
	margin: 0 0 var(--at-space-3);
}

/* WC default widget lists */
.at-archive__sidebar-inner ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.at-archive__sidebar-inner li {
	font-family: var(--at-font-body);
	font-size: var(--at-fs-body-sm);
	margin-bottom: var(--at-space-2);
}
.at-archive__sidebar-inner li a {
	color: var(--at-body);
}
.at-archive__sidebar-inner li a:hover,
.at-archive__sidebar-inner li.is-current > a,
.at-archive__sidebar-inner li.current-cat > a {
	color: var(--at-highlight);
}

.at-cat-list__count {
	color: var(--at-muted);
	font-family: var(--at-font-mono);
	font-size: var(--at-fs-eyebrow);
	margin-left: var(--at-space-1);
}

/* WC price filter (native widget) */
.at-archive__sidebar-inner .price_slider_wrapper .ui-slider {
	background: var(--at-divider);
	border: none;
	border-radius: var(--at-radius-xs);
	height: 4px;
}
.at-archive__sidebar-inner .price_slider_wrapper .ui-slider .ui-slider-range {
	background: var(--at-highlight);
}
.at-archive__sidebar-inner .price_slider_wrapper .ui-slider .ui-slider-handle {
	background: var(--at-highlight);
	border: none;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	top: -5px;
}
.at-archive__sidebar-inner .price_slider_amount {
	font-family: var(--at-font-mono);
	font-size: var(--at-fs-body-sm);
	color: var(--at-body);
}
.at-archive__sidebar-inner .price_slider_amount .button {
	background: transparent;
	border: 1px solid var(--at-divider);
	color: var(--at-body);
	padding: var(--at-space-1) var(--at-space-4);
	border-radius: var(--at-radius-xs);
	text-transform: uppercase;
	letter-spacing: 0.05em;
}
.at-archive__sidebar-inner .price_slider_amount .button:hover {
	border-color: var(--at-highlight);
	color: var(--at-highlight);
}

/* WC product search widget — match loop button pattern:
 * default → grey text/border, white on hover/focus. */
.at-archive__sidebar-inner .woocommerce-product-search {
	display: flex;
	gap: var(--at-space-2);
}
.at-archive__sidebar-inner .woocommerce-product-search input[type="search"],
.at-archive__sidebar-inner .woocommerce-product-search .search-field {
	flex: 1;
	min-width: 0;
	border: 1px solid var(--at-body);
	border-radius: var(--at-radius-xs);
	color: var(--at-body);
	height: 40px;
}
.at-archive__sidebar-inner .woocommerce-product-search input[type="search"]:hover,
.at-archive__sidebar-inner .woocommerce-product-search .search-field:hover,
.at-archive__sidebar-inner .woocommerce-product-search input[type="search"]:focus,
.at-archive__sidebar-inner .woocommerce-product-search .search-field:focus {
	border-color: var(--at-highlight);
	color: var(--at-highlight);
}
.at-archive__sidebar-inner .woocommerce-product-search input::placeholder {
	color: var(--at-body);
}
.at-archive__sidebar-inner .woocommerce-product-search button[type="submit"] {
	padding: 0 var(--at-space-4);
	border: 1px solid var(--at-body);
	border-radius: var(--at-radius-xs);
	background-color: var(--at-canvas);
	color: var(--at-body);
	font-family: var(--at-font-body);
	font-size: var(--at-fs-body-sm);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.025em;
	cursor: pointer;
	transition: background-color var(--at-trans-fast), color var(--at-trans-fast), border-color var(--at-trans-fast);
}
.at-archive__sidebar-inner .woocommerce-product-search button[type="submit"]:hover {
	background-color: var(--at-highlight);
	border-color: var(--at-highlight);
	color: var(--at-canvas);
}

/* Alien-tools ajax filter widget — harmonize all filter "boxes" so the
 * multiselect toggle, price input, and dropdown panel match the wrapped
 * <select> styled by at-select.js (.at-select__trigger). Labels switch to
 * the mono eyebrow style for consistency with the rest of the sidebar. */
.alien-tools-filters-widget .alien-tools-filter__label {
	font-family: var(--at-font-mono);
	font-size: var(--at-fs-eyebrow);
	font-weight: 500;
	color: var(--at-muted);
	text-transform: uppercase;
	letter-spacing: var(--at-tracking-eyebrow);
	margin-bottom: var(--at-space-2);
}
.alien-tools-filters-widget .alien-tools-filter__multiselect-toggle,
.alien-tools-filters-widget .alien-tools-filter__price input,
.alien-tools-filters-widget select {
	height: 44px;
	padding: 0 var(--at-space-3);
	background-color: var(--at-surface);
	color: var(--at-headline);
	border: 1px solid var(--at-divider);
	border-radius: 0;
	font-family: var(--at-font-body);
	font-size: var(--at-fs-body-sm);
	line-height: 1;
}
.alien-tools-filters-widget .alien-tools-filter__multiselect-panel {
	background-color: var(--at-surface);
	border: 1px solid var(--at-divider);
	border-radius: 0;
}
/* Empty-state "Any" label inside the multiselect toggle — plugin defaults
 * to --at-muted; match the native <select> trigger which uses headline. */
.alien-tools-filters-widget .alien-tools-filter__multiselect-summary--empty {
	color: var(--at-headline);
}

/* Result count + ordering */
.woocommerce-result-count {
	font-family: var(--at-font-mono);
	font-size: var(--at-fs-eyebrow);
	color: var(--at-muted);
	text-transform: uppercase;
	letter-spacing: var(--at-tracking-eyebrow);
	margin-bottom: var(--at-space-4);
}
.woocommerce-ordering {
	margin-bottom: var(--at-space-4);
}
.woocommerce-ordering select {
	background-color: var(--at-surface);
	color: var(--at-body);
	border: 1px solid var(--at-divider);
	border-radius: var(--at-radius-xs);
	padding: var(--at-space-2) var(--at-space-4);
	font-family: var(--at-font-body);
	font-size: var(--at-fs-body-sm);
}

/* Product grid — prefixed with to beat WC's `.woocommerce ul.products`
 * (0,2,1) and its ::before/::after `display: table; clear: both` reset.
 *
 * Grid uses subgrid for vertical alignment: 7 rows per card —
 *   1: image, 2: cat eyebrow, 3: title, 4: price,
 *   5: short description, 6: stock state, 7: add-to-cart button.
 *
 * The LoopProduct-link <a> wraps slots 1-6; display:contents flattens it so
 * those slots are direct grid items of the card's single 7-row subgrid (the
 * add-to-cart <a> is row 7). One subgrid level — no nested subgrid.
 */
.at-products-grid {
	margin: 0;
	padding: 0;
}
ul.products,
.woocommerce ul.products,
.woocommerce-page ul.products {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	/* The 7-row card structure as a REPEATING pattern. grid-template-rows can't
	 * express this (it can't repeat over an unknown number of product rows), but
	 * grid-auto-rows takes a multi-value list that cycles for every implicit
	 * row — so every band of 7 rows gets the same tracks and the cards' slots
	 * align across all rows, under auto-fill columns.
	 *
	 * Fixed rows: 1 image, 2 eyebrow, 4 price, 7 button. Content-variable rows
	 * (auto): 3 title, 5 short description, 6 stock. Pinning row 1 is what tamed
	 * the stretch — the image's aspect-ratio in an `auto` row drove the runaway
	 * height; with a fixed image row the remaining `auto` rows size to content. */
	grid-auto-rows: 270px 20px auto 40px auto auto 60px;
	gap: var(--at-space-4);
	clear: none;
}
ul.products::before,
ul.products::after,
.woocommerce ul.products::before,
.woocommerce ul.products::after,
.woocommerce-page ul.products::before,
.woocommerce-page ul.products::after {
	content: none;
	display: none;
}
ul.products li.product {
	display: grid;
	grid-template-rows: subgrid;
	grid-row: span 7;
	/* Gap between the card's 7 slot rows. Overrides the parent grid's larger
	 * inherited row-gap; the parent gap still separates whole card rows. */
	row-gap: 10px;
	background-color: var(--at-canvas);
	border: 1px solid transparent;
	border-radius: var(--at-radius-xs);
	transition: border-color var(--at-trans-default);
	overflow: hidden;
	position: relative;
	width: auto;
	float: none;
	margin: 0;
	padding: 0;
}
ul.products li.product:hover {
	border-color: var(--at-highlight);
}
/* WC wraps slots 1-6 (image, eyebrow, title, price, short description, stock)
 * in <a class="woocommerce-LoopProduct-link">. display:contents FLATTENS that
 * link so its six children become direct grid items of the card: they fill
 * subgrid rows 1-6 and the add-to-cart <a> sibling falls into row 7.
 *
 * One subgrid level only. Nesting a second subgrid on the link (its own
 * grid-template-rows: subgrid spanning 6) broke the parent grid's auto-row
 * sizing through the double indirection and stretched the cards. The wishlist
 * heart (position:absolute) and the screen-reader text (clipped in base.css)
 * are already out of flow, so the card has exactly 7 in-flow grid items. */
ul.products li.product > a.woocommerce-LoopProduct-link {
	display: contents;
	color: inherit;
}

/* Each subgrid slot anchors its content at the top of its row.
 * Without this, `align-self: stretch` (the default) stretches every item to
 * fill its cell, which makes shorter content look "lost" in tall rows. */
ul.products li.product > *,
ul.products li.product .woocommerce-LoopProduct-link > * {
	align-self: start;
}

/* Loop card image (slot 1) — square frame that scales with the column.
 * object-fit: contain letterboxes non-square thumbnails symmetrically inside
 * the square; padding gives a small dark inset around the image. */
ul.products li.product img,
ul.products li.product .woocommerce-loop-product__link img,
ul.products li.product img.wp-post-image {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1;
	object-fit: contain;
	background-color: var(--at-canvas);
	padding: var(--at-space-3);
}

/* Eyebrow (slot 2) — injected by at_theme_loop_eyebrow */
ul.products li.product .at-loop-cat {
	margin: 0 var(--at-space-4);
	padding: var(--at-space-3) 0 0;
	font-size: 0.55rem;
	font-weight: normal;
	color: var(--at-muted);
}

/* Title (slot 3) */
ul.products li.product h2,
ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--at-font-mono);
	font-size: var(--at-fs-body);
	font-weight: 500;
	color: var(--at-headline);
	letter-spacing: -0.02em;
	line-height: 1.35;
	padding: 0 var(--at-space-4);
	margin: 0;
	text-transform: none;
}
ul.products li.product:hover .woocommerce-loop-product__title {
	color: var(--at-highlight);
}

/* Price (slot 4) — white sale price + muted gray strike. */
ul.products li.product .price {
	margin: 0;
	padding: var(--at-space-2) var(--at-space-4);
	border-left: 1px solid var(--at-divider);
	font-family: var(--at-font-body);
	font-size: var(--at-fs-body);
	color: var(--at-headline);
}
ul.products li.product .price ins {
	text-decoration: none;
	background: transparent;
	color: var(--at-highlight);
	font-weight: 600;
}
ul.products li.product .price del,
ul.products li.product .price del *,
ul.products li.product .price del .amount {
	color: var(--at-muted);
	background: transparent;
	font-weight: 400;
	margin-right: var(--at-space-1);
	opacity: 1;
	text-decoration: line-through;
}

/* Short description (slot 5) — injected by at_theme_loop_short_desc */
ul.products li.product .at-loop-desc {
	margin: 0;
	padding: 0 var(--at-space-4);
	font-family: var(--at-font-body);
	font-size: var(--at-fs-body);
	color: var(--at-muted);
	line-height: 1.5;
}

/* Stock state (slot 6) — injected by at_theme_loop_stock */
ul.products li.product .at-loop-stock {
	margin: 0;
	padding: var(--at-space-3) var(--at-space-4) 0;
	font-family: var(--at-font-mono);
	font-size: var(--at-fs-micro);
	text-transform: uppercase;
	letter-spacing: var(--at-tracking-eyebrow);
}
ul.products li.product .at-loop-stock--instock { color: var(--at-stock-ok); }
ul.products li.product .at-loop-stock--outofstock { color: var(--at-stock-out); }
ul.products li.product .at-loop-stock--onbackorder { color: var(--at-stock-low); }

/* Add-to-cart button (slot 7) — centered, full width inside the card.
 * Brand pattern: black/white-border/white default → white/black on hover. */
ul.products li.product .button,
ul.products li.product .add_to_cart_button {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 var(--at-space-4) var(--at-space-4);
	padding: var(--at-space-3) var(--at-space-4);
	border: 1px solid var(--at-body);
	border-radius: var(--at-radius-xs);
	background-color: var(--at-canvas);
	background-image: none;
	color: var(--at-body);
	font-family: var(--at-font-body);
	font-size: var(--at-fs-body-sm);
	font-weight: 700;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 0.025em;
	transition: background-color var(--at-trans-fast), color var(--at-trans-fast);
}
ul.products li.product .button:hover,
ul.products li.product .add_to_cart_button:hover {
	background-color: var(--at-highlight);
	color: var(--at-canvas);
}

ul.products li.product .added_to_cart {
	display: none;
}

/* Pagination */
.woocommerce-pagination {
	margin-top: var(--at-space-7);
	text-align: center;
}
.woocommerce-pagination ul {
	display: inline-flex;
	gap: var(--at-space-2);
	padding: 0;
	margin: 0;
	list-style: none;
	border: 0;
}
.woocommerce-pagination ul li {
	border: 0;
}
.woocommerce-pagination .page-numbers {
	display: inline-block;
	padding: var(--at-space-2) var(--at-space-3);
	border: 1px solid var(--at-divider);
	border-radius: var(--at-radius-xs);
	background-color: transparent;
	color: var(--at-muted);
	font-family: var(--at-font-mono);
	font-size: var(--at-fs-body-sm);
	letter-spacing: 0.05em;
	text-transform: uppercase;
	transition: all var(--at-trans-fast);
	line-height: 1;
}
.woocommerce-pagination .page-numbers:hover,
.woocommerce-pagination .page-numbers.current {
	color: var(--at-highlight);
	border-color: var(--at-highlight);
}
.woocommerce-pagination .page-numbers.dots {
	border: 0;
	color: var(--at-muted);
}

/* No-products notice */
.woocommerce-no-products-found,
.woocommerce-info {
	background: var(--at-surface);
	border: 1px solid var(--at-divider);
	border-radius: var(--at-radius-xs);
	padding: var(--at-space-5);
	color: var(--at-body);
	margin: 0 0 var(--at-space-5);
}

/* Mobile slide-in sidebar */
@media (max-width: 980px) {
	.at-archive__layout {
		grid-template-columns: 1fr;
	}
	.at-archive__filters-toggle {
		display: inline-block;
		width: auto;
	}
	.at-archive__sidebar-inner {
		display: none;
		margin-top: var(--at-space-4);
		padding: var(--at-space-5);
		background-color: var(--at-surface);
		border: 1px solid var(--at-divider);
		border-radius: var(--at-radius-xs);
	}
	.at-archive__sidebar.is-open .at-archive__sidebar-inner {
		display: block;
	}
}

@media (max-width: 600px) {
	ul.products {
		grid-template-columns: repeat(2, 1fr);
	}
}

	/* === 2026-06-15 archive type pass (Travis): softer white, tighter scale,
	   no left rules, expandable (row-level) descriptions, tighter card rhythm === */
	ul.products li.product { row-gap: var(--at-space-2); }                              /* 8px (was 10) */
	ul.products,
	.woocommerce ul.products,
	.woocommerce-page ul.products { grid-auto-rows: 270px 20px auto auto auto auto 60px; } /* price row -> auto: no dead space */

	ul.products li.product .at-loop-cat { font-size: var(--at-fs-micro); }
	ul.products li.product h2,
	ul.products li.product .woocommerce-loop-product__title { font-size: 0.9375rem; }
	ul.products li.product .price { font-size: 0.9375rem; border-left: 0; padding-block: var(--at-space-1); }
	ul.products li.product .price ins { color: var(--at-headline); }

	ul.products li.product .gp-css-stock-block { border-left: 0; padding-left: var(--at-space-4); }

	ul.products li.product .at-loop-desc { font-size: var(--at-fs-body-sm); color: var(--at-body); }
	ul.products li.product .at-loop-desc__text {
		display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
	}
	ul.products li.product .at-loop-desc__text.is-expanded { -webkit-line-clamp: unset; overflow: visible; }
	ul.products li.product .at-loop-desc__toggle {
		display: inline-block;
		margin-top: var(--at-space-2);
		font-family: var(--at-font-mono);
		font-size: var(--at-fs-eyebrow);
		letter-spacing: var(--at-tracking-eyebrow);
		text-transform: uppercase;
		color: var(--at-dim-888);
		cursor: pointer;
	}
	ul.products li.product .at-loop-desc__toggle:hover { color: var(--at-highlight); }

}
