/*
 * Alder Objects — storefront layer.
 *
 * Loaded only when WooCommerce is active and after base.css, so these rules win
 * without reaching for !important.
 */

/* ===========================================================================
   Shop archive
   ======================================================================== */

.al-shop {
	padding-bottom: var(--al-section-sm);
}

/*
 * Belt and braces. WooCommerce's float-era layout stylesheet is dequeued in
 * inc/woocommerce.php; if a site re-adds it, or a page renders the shortcode
 * outside the theme's own wrappers, these keep the grid intact.
 */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
	float: none;
	width: auto;
	margin: 0;
	clear: none;
	text-align: center;
}

.woocommerce ul.products::before,
.woocommerce ul.products::after {
	content: none;
}

.al-shop__toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem 1.5rem;
	margin-bottom: clamp(1.5rem, 3vw, 2.25rem);
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--al-line);
}

/* WooCommerce prints its notices wrapper first even when there is nothing in
   it, so the count cannot rely on space-between to reach the left edge. */
.al-shop__toolbar > .woocommerce-notices-wrapper:empty {
	display: none;
}

.al-shop__toolbar .woocommerce-result-count {
	margin: 0;
	font-size: 0.6875rem;
	letter-spacing: var(--al-track);
	text-transform: uppercase;
	color: var(--al-muted);
}

.al-shop__toolbar .woocommerce-ordering {
	margin: 0 0 0 auto;
}

.al-shop__toolbar .woocommerce-ordering select {
	border: 1px solid var(--al-line);
	border-radius: var(--al-radius);
	background: transparent;
	padding: 0.6rem 2.25rem 0.6rem 0.9rem;
	font-size: 0.75rem;
	letter-spacing: 0.06em;
	appearance: none;
	background-image: linear-gradient(45deg, transparent 50%, var(--al-muted) 50%), linear-gradient(135deg, var(--al-muted) 50%, transparent 50%);
	background-position: calc(100% - 16px) 50%, calc(100% - 11px) 50%;
	background-size: 5px 5px, 5px 5px;
	background-repeat: no-repeat;
}

.al-shop__toolbar .woocommerce-ordering select:focus {
	outline: none;
	border-color: var(--al-ink);
}

/* Category description and subcategory strips read as one band. */
.term-description {
	max-width: 62ch;
	margin: 0 auto 2rem;
	color: var(--al-ink-soft);
}

/* ===========================================================================
   Notices
   ======================================================================== */

.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-noreviews {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem;
	margin: 0 0 1.75rem;
	padding: 1.15rem 1.4rem;
	list-style: none;
	border: 1px solid var(--al-line);
	border-left-width: 2px;
	border-radius: var(--al-radius);
	background: var(--al-surface);
	font-size: 0.9375rem;
}

.woocommerce-message {
	border-left-color: var(--al-accent);
}

.woocommerce-info {
	border-left-color: var(--al-muted);
}

.woocommerce-error {
	border-left-color: #b4553f;
}

.woocommerce-message .button,
.woocommerce-info .button,
.woocommerce-error .button {
	margin-left: auto;
	padding: 0.7em 1.5em;
	border: 1px solid var(--al-ink);
	border-radius: var(--al-radius);
	font-size: 0.6875rem;
	letter-spacing: var(--al-track);
	text-transform: uppercase;
	color: var(--al-ink);
	background: transparent;
}

.woocommerce-message .button:hover,
.woocommerce-info .button:hover,
.woocommerce-error .button:hover {
	background: var(--al-ink);
	color: var(--al-bg);
}

/* ===========================================================================
   Single product
   ======================================================================== */

.single-product .al-main {
	padding-bottom: var(--al-section-sm);
}

.single-product div.product {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
	gap: clamp(2rem, 5vw, 4.5rem);
	align-items: start;
	max-width: calc(var(--al-container) + 6rem);
	margin: 0 auto;
	padding: clamp(1.5rem, 3vw, 2.5rem) clamp(1.25rem, 4vw, 3rem) 0;
}

.single-product div.product .woocommerce-product-gallery {
	width: 100%;
	margin: 0;
	float: none;
}

.single-product div.product .woocommerce-product-gallery__image img {
	border-radius: var(--al-radius);
	background: var(--al-bg-soft);
}

/*
 * Two thumbnails to a row, each half the gallery column. Flexslider makes its
 * items shrink-to-fit, which leaves them at the size of the thumbnail file
 * rather than of the cell, so both the list item and the image are told to take
 * the full width.
 */
/*
 * The long selector is not decoration. WooCommerce ships
 * `.woocommerce div.product div.images .flex-control-thumbs li` at four
 * classes, which outranks anything shorter — that rule fixes each thumbnail at
 * a quarter of the gallery, and a quarter-width item in a two-column row leaves
 * the right half of the row empty. `.single-product.woocommerce` outranks it.
 */
.single-product.woocommerce div.product div.images .flex-control-thumbs {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.75rem;
	margin: 0.875rem 0 0;
	padding: 0;
	list-style: none;
}

.single-product.woocommerce div.product div.images .flex-control-thumbs li {
	width: 100%;
	height: auto;
	float: none;
	margin: 0;
	overflow: hidden;
}

.single-product.woocommerce div.product div.images .flex-control-thumbs img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	background: var(--al-bg-soft);
}

.single-product div.product .flex-control-thumbs img {
	border-radius: var(--al-radius);
	opacity: 0.55;
	transition: opacity var(--al-speed) ease;
}

.single-product div.product .flex-control-thumbs img.flex-active,
.single-product div.product .flex-control-thumbs img:hover {
	opacity: 1;
}

/*
 * Everything below the gallery and the summary is a direct child of the same
 * two-column grid, so each block has to be told to span it.
 */
.single-product div.product .woocommerce-tabs,
.single-product div.product .related.products,
.single-product div.product .upsells.products,
.single-product div.product .woocommerce-product-gallery ~ .clear,
.single-product div.product section.related,
.single-product div.product section.upsells {
	grid-column: 1 / -1;
}

.single-product div.product .summary {
	margin: 0;
	float: none;
	width: auto;
}

.single-product div.product .flex-control-thumbs img {
	width: 100%;
	height: auto;
}

.single-product div.product .summary > * + * {
	margin-top: 1.25rem;
}

.single-product .product_title {
	margin: 0;
	font-size: clamp(1.75rem, 3.2vw, 2.5rem);
}

.product_meta,
.product_meta a {
	font-size: 0.6875rem;
	letter-spacing: var(--al-track);
	text-transform: uppercase;
	color: var(--al-muted);
}

.product_meta > span {
	display: block;
	margin-bottom: 0.35rem;
}

body.single-product div.product p.price,
body.single-product div.product span.price,
.single-product .price {
	display: block;
	margin: 0;
	font-size: 1.125rem;
	font-family: var(--al-font-sans);
	color: var(--al-ink);
}

.woocommerce div.product p.price del,
.single-product .price del {
	color: var(--al-muted);
	margin-right: 0.4em;
	font-size: 0.875em;
}

.woocommerce div.product p.price ins,
.woocommerce ul.products li.product .price ins,
.single-product .price ins {
	color: var(--al-ink);
	text-decoration: none;
	font-weight: 400;
}

.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .price ins {
	color: var(--al-ink-soft);
	font-weight: 400;
}

.single-product .woocommerce-product-details__short-description {
	color: var(--al-ink-soft);
}

.single-product .woocommerce-product-details__short-description p {
	margin: 0;
}

form.cart {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	align-items: stretch;
}

.quantity {
	display: inline-flex;
	align-items: center;
	border: 1px solid var(--al-line);
	border-radius: var(--al-radius);
	overflow: hidden;
}

.quantity input[type="number"] {
	width: 4.5rem;
	height: 100%;
	padding: 0.95rem 0.5rem;
	border: 0;
	background: transparent;
	text-align: center;
	font-size: 0.9375rem;
	-moz-appearance: textfield;
}

.quantity input[type="number"]::-webkit-outer-spin-button,
.quantity input[type="number"]::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.quantity input:focus {
	outline: none;
}

form.cart .button,
.single_add_to_cart_button,
.button.alt {
	flex: 1 1 auto;
	padding: 1.05em 2.1em;
	border: 1px solid var(--al-ink);
	border-radius: var(--al-radius);
	background: var(--al-ink);
	color: var(--al-bg);
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: var(--al-track);
	text-transform: uppercase;
	transition: background-color var(--al-speed) ease, border-color var(--al-speed) ease;
}

form.cart .button:hover,
.single_add_to_cart_button:hover,
.button.alt:hover {
	background: var(--al-accent);
	border-color: var(--al-accent);
	color: #fff;
}

/* Trust bar */

.al-trust {
	margin: 0;
	padding-top: 1.5rem;
	border-top: 1px solid var(--al-line);
}

.al-trust li {
	display: flex;
	align-items: center;
	gap: 0.85rem;
	padding: 0.6rem 0;
	font-size: 0.875rem;
	color: var(--al-ink-soft);
}

.al-trust svg {
	color: var(--al-accent);
	flex: 0 0 auto;
}

/* Tabs */

.woocommerce-tabs {
	max-width: calc(var(--al-container) + 6rem);
	margin: 0 auto;
	padding: clamp(2.5rem, 5vw, 4rem) clamp(1.25rem, 4vw, 3rem) 0;
}

.woocommerce-tabs ul.tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 1.75rem;
	margin: 0 0 2rem;
	padding: 0 0 1rem;
	border-bottom: 1px solid var(--al-line);
	list-style: none;
}

.woocommerce-tabs ul.tabs::before,
.woocommerce-tabs ul.tabs::after {
	display: none;
}

.woocommerce-tabs ul.tabs li {
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	border-radius: 0;
}

.woocommerce-tabs ul.tabs li::before,
.woocommerce-tabs ul.tabs li::after {
	display: none;
}

.woocommerce-tabs ul.tabs li a {
	padding: 0;
	font-size: 0.6875rem;
	letter-spacing: var(--al-track);
	text-transform: uppercase;
	color: var(--al-muted);
	border-bottom: 1px solid transparent;
	padding-bottom: 0.5rem;
	transition: color var(--al-speed) ease, border-color var(--al-speed) ease;
}

.woocommerce-tabs ul.tabs li.active a,
.woocommerce-tabs ul.tabs li a:hover {
	color: var(--al-ink);
	border-color: var(--al-ink);
}

.woocommerce-Tabs-panel {
	max-width: 76ch;
	color: var(--al-ink-soft);
}

.woocommerce-Tabs-panel h2 {
	display: none;
}

.shop_attributes {
	border: 0;
}

.shop_attributes th,
.shop_attributes td {
	padding: 0.85rem 0;
	border: 0;
	border-bottom: 1px solid var(--al-line);
	text-align: left;
	font-style: normal;
	background: none;
}

.shop_attributes th {
	width: 34%;
	font-size: 0.6875rem;
	font-weight: 500;
	letter-spacing: var(--al-track);
	text-transform: uppercase;
	color: var(--al-muted);
}

.shop_attributes td {
	font-size: 0.9375rem;
}

.shop_attributes td p {
	margin: 0;
}

/* Related */

.related.products,
.upsells.products {
	max-width: calc(var(--al-container) + 6rem);
	margin: 0 auto;
	padding: clamp(3rem, 6vw, 5rem) clamp(1.25rem, 4vw, 3rem) 0;
}

.related.products > h2,
.upsells.products > h2 {
	font-size: clamp(1.375rem, 2.4vw, 1.875rem);
	margin-bottom: 1.75rem;
}

.related.products ul.products,
.upsells.products ul.products {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(1.25rem, 2.6vw, 2.25rem);
	margin: 0;
	padding: 0;
	list-style: none;
}

/* The related section and its list both carry `.products`; only the list should
  be a grid. */
.related.products,
.upsells.products {
	display: block;
}

/*
 * On the single-product page these three are children of the product grid,
 * which already supplies the container and the page padding. Left to their own
 * container they are inset a second time and then centred, so the tab row, the
 * tab copy and the related heading all sit 48px inside the gallery above them
 * instead of on its left edge. The vertical rhythm is kept; the rest is dropped.
 */
.single-product div.product .woocommerce-tabs {
	max-width: none;
	margin: 0;
	padding: clamp(2.5rem, 5vw, 4rem) 0 0;
}

.single-product div.product .related.products,
.single-product div.product .upsells.products {
	max-width: none;
	margin: 0;
	padding: clamp(3rem, 6vw, 5rem) 0 0;
}

/* ===========================================================================
   Cart, checkout, account
   ======================================================================== */

.woocommerce-cart .al-main,
.woocommerce-checkout .al-main,
.woocommerce-account .al-main {
	padding-bottom: var(--al-section-sm);
}

.woocommerce table.shop_table {
	border: 0;
	border-collapse: collapse;
	border-radius: 0;
	margin-bottom: 2rem;
}

.woocommerce table.shop_table th {
	padding: 0.9rem 0.75rem;
	border-bottom: 1px solid var(--al-line);
	font-size: 0.6875rem;
	font-weight: 500;
	letter-spacing: var(--al-track);
	text-transform: uppercase;
	color: var(--al-muted);
	text-align: left;
}

.woocommerce table.shop_table td {
	padding: 1.15rem 0.75rem;
	border-top: 1px solid var(--al-line);
	border-bottom: 0;
	vertical-align: middle;
}

.woocommerce table.shop_table td.product-name a {
	font-size: 0.9375rem;
}

.woocommerce table.shop_table td.product-thumbnail img {
	width: 76px;
	border-radius: var(--al-radius);
}

.woocommerce a.remove {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	border-radius: var(--al-radius-pill);
	color: var(--al-muted) !important;
	background: transparent !important;
	font-size: 1rem;
	line-height: 1;
}

.woocommerce a.remove:hover {
	background: var(--al-ink) !important;
	color: var(--al-bg) !important;
}

.woocommerce .coupon .input-text {
	border: 1px solid var(--al-line);
	border-radius: var(--al-radius);
	padding: 0.8rem 1rem;
	font-size: 0.875rem;
}

.cart_totals h2,
.woocommerce-checkout-review-order h3,
.woocommerce-billing-fields h3,
.woocommerce-additional-fields h3,
.woocommerce-order-details__title,
.woocommerce-column__title,
.woocommerce-Address-title h3 {
	font-size: 1.25rem;
	margin-bottom: 1.25rem;
}

.woocommerce .cart_totals,
.woocommerce-checkout #customer_details,
#order_review {
	border: 1px solid var(--al-line);
	border-radius: var(--al-radius);
	padding: clamp(1.5rem, 3vw, 2.25rem);
	background: var(--al-surface);
}

.woocommerce-checkout #customer_details {
	background: transparent;
	padding: 0;
	border: 0;
}

.woocommerce form .form-row {
	margin-bottom: 1.25rem;
	padding: 0;
}

.woocommerce form .form-row label {
	display: block;
	margin-bottom: 0.45rem;
	font-size: 0.6875rem;
	letter-spacing: var(--al-track);
	text-transform: uppercase;
	color: var(--al-muted);
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.select2-container .select2-selection--single {
	width: 100%;
	padding: 0.9rem 1rem;
	border: 1px solid var(--al-line);
	border-radius: var(--al-radius);
	background: var(--al-bg);
	font-size: 0.9375rem;
	height: auto;
	line-height: 1.5;
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
	outline: none;
	border-color: var(--al-ink);
}

.select2-container .select2-selection--single .select2-selection__rendered {
	padding: 0;
	line-height: 1.5;
}

.select2-container .select2-selection--single .select2-selection__arrow {
	top: 14px;
	right: 12px;
}

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

#order_review_heading {
	margin-top: 2.5rem;
}

.woocommerce-checkout-payment {
	background: transparent;
	border-radius: 0;
}

.woocommerce-checkout-payment ul.payment_methods {
	padding: 0;
	border: 0;
}

.woocommerce-checkout-payment ul.payment_methods li {
	padding: 0.85rem 0;
	border-bottom: 1px solid var(--al-line);
}

.woocommerce-terms-and-conditions-wrapper {
	margin: 1.5rem 0;
	font-size: 0.875rem;
}

#place_order {
	width: 100%;
	padding: 1.15em 2.1em;
	border: 1px solid var(--al-ink);
	border-radius: var(--al-radius);
	background: var(--al-ink);
	color: var(--al-bg);
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: var(--al-track);
	text-transform: uppercase;
}

#place_order:hover {
	background: var(--al-accent);
	border-color: var(--al-accent);
	color: #fff;
}

.woocommerce-MyAccount-navigation ul {
	display: flex;
	flex-wrap: wrap;
	gap: 1.5rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--al-line);
	margin-bottom: 2rem;
}

.woocommerce-MyAccount-navigation a {
	font-size: 0.6875rem;
	letter-spacing: var(--al-track);
	text-transform: uppercase;
	color: var(--al-muted);
}

.woocommerce-MyAccount-navigation .is-active a,
.woocommerce-MyAccount-navigation a:hover {
	color: var(--al-ink);
}

.woocommerce-MyAccount-content a {
	text-decoration: underline;
	text-underline-offset: 0.25em;
}

/* ===========================================================================
   Star ratings
   ======================================================================== */

.star-rating {
	font-family: star, serif;
	font-size: 0.75rem;
	letter-spacing: 0.2em;
	color: var(--al-accent);
}

.star-rating span::before,
.woocommerce-product-rating .star-rating span::before {
	color: var(--al-accent);
}

.woocommerce-product-rating {
	display: flex;
	align-items: center;
	gap: 0.75rem;
}

.woocommerce-product-rating .woocommerce-review-link {
	font-size: 0.6875rem;
	letter-spacing: var(--al-track);
	text-transform: uppercase;
	color: var(--al-muted);
}

/* ===========================================================================
   Responsive
   ======================================================================== */

/* ===========================================================================
   WooCommerce blocks — the cart and checkout WooCommerce installs by default
   ======================================================================== */

/*
 * The block cart and checkout arrive as full-width blocks, so the reading
 * measure that suits a text page would squeeze them. They get the container.
 */
body.al-cart .al-entry,
body.al-checkout .al-entry {
	max-width: none;
}

body.al-cart .al-page-head,
body.al-checkout .al-page-head {
	padding-bottom: 0;
}

.wc-block-cart,
.wc-block-checkout,
.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout {
	width: 100%;
}

/*
 * The empty-cart illustration is a background image on a pseudo-element sized in
 * `em`, so it scales with the heading it hangs off — 176px here. The theme wants
 * it to sit at the size of an icon, and the extra `body.woocommerce` is there
 * because WooCommerce Blocks prints its own copy of the rule later in the page.
 */
body .wc-block-cart__empty-cart__title.with-empty-cart-icon::before,
body .wp-block-woocommerce-empty-cart-block .with-empty-cart-icon::before {
	width: 68px;
	height: 68px;
	margin: 0 auto 1.5rem;
	background-size: 68px 68px;
	display: block;
}

.wc-block-cart__empty-cart__title,
.wc-block-cart__empty-cart__text {
	text-align: center;
}

/* Block product grids ("New in store" under an empty cart, Product Collection,
   Hand-picked Products) follow the theme's own card shape. */
.wc-block-grid__products,
.wc-block-product-template {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: clamp(1.25rem, 2.6vw, 2.25rem) clamp(0.75rem, 2vw, 1.75rem);
	margin: 0;
	padding: 0;
	list-style: none;
}

.wc-block-grid__product,
.wc-block-product {
	width: auto;
	margin: 0;
	text-align: center;
}

.wc-block-grid__product-image img,
.wc-block-product .wp-block-post-featured-image img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: var(--al-radius);
	background: var(--al-bg-soft);
}

.wc-block-grid__product-title,
.wc-block-product .wp-block-post-title {
	margin: 1rem 0 0.35rem;
	font-family: var(--al-font-sans);
	font-size: 0.8125rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	line-height: 1.5;
}

.wc-block-grid__product-title a,
.wc-block-product .wp-block-post-title a {
	text-decoration: none;
}

.wc-block-grid__product-price,
.wc-block-product .wc-block-components-product-price {
	margin: 0.4rem 0 0.9rem;
	font-size: 0.8125rem;
	color: var(--al-ink-soft);
}

/* Block buttons, inputs and selects. */
.wc-block-components-button:not(.is-link),
.wp-block-woocommerce-cart .wc-block-components-button:not(.is-link),
.wp-block-woocommerce-checkout .wc-block-components-button:not(.is-link) {
	background-color: var(--al-ink);
	color: var(--al-bg);
	border: 1px solid var(--al-ink);
	border-radius: var(--al-radius);
	font-family: var(--al-font-sans);
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: var(--al-track);
	text-transform: uppercase;
	padding: 1.05em 2.1em;
	line-height: 1;
}

.wc-block-components-button:not(.is-link):hover {
	background-color: var(--al-accent);
	border-color: var(--al-accent);
	color: #fff;
}

.wc-block-components-text-input input,
.wc-block-components-textarea,
.wc-blocks-components-select__select,
.wc-block-components-combobox .wc-block-components-combobox-control input.components-combobox-control__input {
	border: 1px solid var(--al-line);
	border-radius: var(--al-radius);
	background: var(--al-bg);
	font-family: var(--al-font-sans);
	font-size: 0.9375rem;
	color: var(--al-ink);
}

.wc-block-components-text-input input:focus,
.wc-block-components-textarea:focus,
.wc-blocks-components-select__select:focus {
	outline: none;
	border-color: var(--al-ink);
	box-shadow: none;
}

.wc-block-components-text-input label,
.wc-block-components-checkbox label,
.wc-block-components-radio-control__label {
	font-size: 0.9375rem;
	color: var(--al-ink-soft);
}

.wc-block-components-title,
.wc-block-components-totals-item__label,
.wc-block-components-order-summary-item__description {
	font-family: var(--al-font-sans);
	color: var(--al-ink-soft);
}

.wc-block-components-totals-item__value,
.wc-block-components-product-price {
	color: var(--al-ink);
}

.wc-block-components-sidebar,
.wc-block-components-order-summary,
.wc-block-cart-items,
.wc-block-components-totals-wrapper {
	border-color: var(--al-line);
}

@media (max-width: 980px) {
	.wc-block-grid__products,
	.wc-block-product-template {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	.wc-block-grid__products,
	.wc-block-product-template {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* ===========================================================================
   WooCommerce defaults this theme replaces
   ---------------------------------------------------------------------------
   These selectors carry the same weight as WooCommerce's own, and because the
   theme stylesheet is enqueued last they win on source order rather than on
   !important. Anything WooCommerce paints in its brand colours (purple buttons,
   green prices, purple stars) has to be restated here.
   ======================================================================== */

.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,
.woocommerce #respond input#submit.alt {
	background-color: var(--al-ink);
	color: var(--al-bg);
	border-radius: var(--al-radius);
	font-weight: 500;
	letter-spacing: var(--al-track);
	text-transform: uppercase;
	font-size: 0.75rem;
	padding: 1.05em 2.1em;
	line-height: 1;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce #respond input#submit.alt:hover {
	background-color: var(--al-accent);
	color: #fff;
}

.woocommerce a.added_to_cart {
	padding-top: 0;
	font-size: 0.6875rem;
	letter-spacing: var(--al-track);
	text-transform: uppercase;
	color: var(--al-muted);
}

.woocommerce .star-rating span::before,
.woocommerce .star-rating::before {
	color: var(--al-accent);
}

.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-error {
	background: var(--al-surface);
	color: var(--al-ink);
}

.woocommerce .woocommerce-message::before,
.woocommerce .woocommerce-info::before,
.woocommerce .woocommerce-error::before {
	color: var(--al-accent);
}

.woocommerce form.checkout_coupon,
.woocommerce form.login,
.woocommerce form.register {
	border: 1px solid var(--al-line);
	border-radius: var(--al-radius);
	padding: clamp(1.5rem, 3vw, 2.25rem);
	background: var(--al-surface);
}

.woocommerce .select2-container--default .select2-selection--single {
	border: 1px solid var(--al-line);
	border-radius: var(--al-radius);
	background: var(--al-bg);
	height: auto;
	padding: 0.35rem 0.6rem;
}

.woocommerce .select2-container--default .select2-selection--single .select2-selection__arrow {
	top: 12px;
}

@media (max-width: 980px) {
	.single-product div.product {
		grid-template-columns: minmax(0, 1fr);
	}

	.related.products .products,
	.upsells.products .products {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	.related.products .products,
	.upsells.products .products {
		grid-template-columns: minmax(0, 1fr);
	}

	.woocommerce table.shop_table td {
		padding: 0.85rem 0.4rem;
	}

	.woocommerce table.shop_table td.product-thumbnail {
		display: none;
	}
}