/*
 * Schon — WooCommerce styling.
 *
 * Loaded only when WooCommerce is active. Everything here dresses core Woo
 * markup in the Schön type scale and coral accent; the product card itself is
 * the shared `.mt-product1` component from schon.css.
 */

/* ==========================================================================
   Shop layout
   ========================================================================== */

.schon-shop {
	display: grid;
	grid-template-columns: 260px minmax(0, 1fr);
	gap: 40px;
	padding: 40px 0 70px;
	align-items: start;
}

.schon-shop.is-full {
	grid-template-columns: minmax(0, 1fr);
}

.schon-shop-main {
	min-width: 0;
}

.woocommerce-notices-wrapper:empty {
	display: none;
}

/* Toolbar above the grid */

.schon-shop-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 28px;
	padding-bottom: 18px;
	border-bottom: 1px solid var(--schon-line);
}

.woocommerce-result-count {
	margin: 0;
	color: var(--schon-muted-2);
	font-size: 13px;
	letter-spacing: 0.5px;
}

.woocommerce-ordering select,
.schon-shop-toolbar select {
	min-height: 40px;
	padding: 8px 34px 8px 14px;
	background-image: linear-gradient(45deg, transparent 50%, var(--schon-heading) 50%), linear-gradient(135deg, var(--schon-heading) 50%, transparent 50%);
	background-position: calc(100% - 18px) 17px, calc(100% - 13px) 17px;
	background-size: 5px 5px, 5px 5px;
	background-repeat: no-repeat;
	border: 1px solid var(--schon-line);
	color: var(--schon-heading);
	font-family: var(--schon-font-head);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
	appearance: none;
}

/* ==========================================================================
   Product grid
   ========================================================================== */

ul.products {
	display: grid;
	grid-template-columns: repeat(var(--schon-cols, 3), minmax(0, 1fr));
	gap: 40px 0;
	margin: 0 -11px;
	padding: 0;
	list-style: none;
}

/*
 * Column count comes from the `columns-N` class WooCommerce already writes from
 * loop_shop_columns / the related-products args, so every loop — shop, archive,
 * related, up-sells, cross-sells — is sized by the same rule.
 */
ul.products.columns-1 { --schon-cols: 1; }
ul.products.columns-2 { --schon-cols: 2; }
ul.products.columns-3 { --schon-cols: 3; }
ul.products.columns-4 { --schon-cols: 4; }
ul.products.columns-5 { --schon-cols: 5; }
ul.products.columns-6 { --schon-cols: 6; }

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

/*
 * The grid above places the cards; WooCommerce must not also size them.
 *
 * woocommerce-layout.css ships `.woocommerce ul.products.columns-3 li.product
 * { width: 30.75%; float: left }` and woocommerce-smallscreen.css repeats it
 * with an attribute selector at 48%. A percentage width on a grid item resolves
 * against the *track*, so those rules shrank every card to a third of its own
 * column — 123px inside a 400px track — on the shop, on category archives and
 * on the related/up-sell/cross-sell rows. The selectors below exist only to
 * outrank them, which is why they are more specific than they look.
 */
ul.products li.product,
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
.woocommerce ul.products[class*="columns-"] li.product,
.woocommerce-page ul.products[class*="columns-"] li.product,
.woocommerce ul.products[class*="columns-"] li.product:nth-child(2n),
.woocommerce-page ul.products[class*="columns-"] li.product:nth-child(2n) {
	width: auto;
	margin: 0;
	padding: 0;
	float: none;
	clear: none;
}

.woocommerce ul.products li.product .schon-card-media img {
	margin: 0;
	box-shadow: none;
}

/*
 * Card price. WooCommerce sizes it with `.woocommerce ul.products li.product
 * .price { font-size: .857em }`, which outranks the theme's `.mt-product1
 * .price` and rendered every card price at 12px instead of the design's 17px —
 * on the shop, the archives and the related row alike. Matching core's
 * selector and adding the card class is the least specific thing that wins.
 */
.woocommerce ul.products li.product .mt-product1 .price {
	color: var(--schon-black);
	font-family: var(--schon-font-body);
	font-size: 17px;
	font-weight: 600;
	line-height: 20px;
}

.woocommerce ul.products li.product .mt-product1 .price del {
	color: var(--schon-muted-2);
	font-size: 13px;
	font-weight: 400;
}

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

   Measured from the reference `product-detail.html`: a full-bleed #f6f6f6 band,
   a 55.5% gallery beside a 40% detail column with a 4.65% gutter, and the
   rhythm of hairline dividers that separates the action row, the description
   and the price.
   ========================================================================== */

.schon-single-product {
	padding: 0 0 25px;
}

.woocommerce div.product {
	display: block;
}

.schon-product-top {
	display: grid;
	position: relative;
	z-index: 0;
	grid-template-columns: minmax(0, 55.5fr) minmax(0, 40fr);
	gap: 4.65%;
	align-items: start;
}

/*
 * The grey band runs edge to edge behind the gallery and detail column only —
 * the tabs and related row below it sit on white. A pseudo-element rather than
 * a wrapper element, because schon_woo_wrapper_start() opens the container
 * before WooCommerce has decided what it is rendering, so there is no hook
 * between "inside the container" and "start of the product row".
 */
.schon-product-top::before {
	content: "";
	position: absolute;
	z-index: -1;
	top: 0;
	right: calc(50% - 50vw);
	bottom: 0;
	left: calc(50% - 50vw);
	background: var(--schon-surface);
}

/*
 * WooCommerce's layout.css floats the gallery and summary at `width: 48%` via
 * `.woocommerce div.product div.images` / `div.summary`. Inside the grid above
 * that leaves each column only half filled, so these overrides have to carry
 * enough specificity to beat it — hence the redundant `div.product`.
 */
.woocommerce div.product .schon-product-top > div.images,
.woocommerce div.product .schon-product-top > .woocommerce-product-gallery,
.woocommerce div.product .schon-product-top > div.summary,
.woocommerce div.product .schon-product-top > .entry-summary {
	width: 100%;
	margin: 0;
	float: none;
	clear: none;
}

/* --- Gallery --- */

.woocommerce div.product .woocommerce-product-gallery {
	padding: 40px 0 0;
}

.woocommerce div.product .woocommerce-product-gallery__image img {
	width: 100%;
}

.woocommerce div.product .woocommerce-product-gallery .flex-viewport,
.woocommerce div.product .woocommerce-product-gallery__wrapper {
	margin-bottom: 30px;
}

/*
 * Thumbnail strip. The reference centres a 510px rail of bordered white tiles
 * under the main image; each tile is a fixed square so a portrait pack shot and
 * a landscape lifestyle shot line up instead of stair-stepping.
 */
.woocommerce div.product .flex-control-thumbs {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 14px;
	max-width: 510px;
	margin: 0 auto;
	padding: 0;
	list-style: none;
}

/*
 * Fixed 90px tiles rather than a five-column track. The reference always shows
 * a full rail, but a real catalogue has products with two images and products
 * with eight — fixed tiles keep the thumbnail the same size in both cases
 * instead of stretching two images across the whole rail.
 *
 * The selector carries `div.images` only to outrank WooCommerce's own
 * `...div.images .flex-control-thumbs li { width: 25%; float: left }`, which
 * would otherwise resolve that 25% against the flex line.
 */
.woocommerce div.product div.images .flex-control-thumbs li,
.woocommerce div.product .flex-control-thumbs li {
	flex: 0 0 90px;
	width: 90px;
	margin: 0;
	float: none;
}

.woocommerce div.product div.images .flex-control-thumbs img,
.woocommerce div.product .flex-control-thumbs img {
	display: block;
	width: 100%;
	height: 90px;
	padding: 6px;
	background: var(--schon-white);
	border: 1px solid #ededed;
	object-fit: contain;
	opacity: 0.55;
	cursor: pointer;
	transition: opacity 0.3s var(--schon-ease), border-color 0.3s var(--schon-ease);
}

.woocommerce div.product div.images .flex-control-thumbs img.flex-active,
.woocommerce div.product div.images .flex-control-thumbs img:hover,
.woocommerce div.product .flex-control-thumbs img.flex-active,
.woocommerce div.product .flex-control-thumbs img:hover {
	border-color: var(--schon-line-2);
	opacity: 1;
}

/* Engagement counters above the gallery. */

.schon-gallery-meta {
	display: flex;
	gap: 17px;
	margin: 0 0 -14px;
	padding: 13px 0 0;
	color: var(--schon-muted-4);
	font-family: var(--schon-font-head);
	font-size: 16px;
	line-height: 20px;
}

.schon-gallery-meta a {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: var(--schon-muted-4);
}

.schon-gallery-meta a:hover,
.schon-gallery-meta a:focus {
	color: var(--schon-accent-2);
}

/* --- Detail column --- */

.woocommerce div.product .schon-product-top > div.summary,
.woocommerce div.product .schon-product-top > .entry-summary {
	padding: 50px 0;
}

.schon-product-breadcrumbs {
	display: flex;
	flex-wrap: wrap;
	margin: 0 0 8px;
	padding: 0;
	color: var(--schon-muted-3);
	font-size: 15px;
	line-height: 17px;
	list-style: none;
}

.schon-product-breadcrumbs li + li::before {
	margin: 0 8px 0 2px;
	content: "\203A";
}

.schon-product-breadcrumbs a {
	color: var(--schon-muted-3);
}

.schon-product-breadcrumbs a:hover,
.schon-product-breadcrumbs a:focus {
	color: var(--schon-accent-2);
}

.woocommerce div.product .product_title {
	margin: 0 0 15px;
	padding: 0;
	color: var(--schon-black);
	font-family: var(--schon-font-body);
	font-size: 44px;
	font-weight: 300;
	letter-spacing: 5px;
	line-height: 46px;
	text-transform: uppercase;
	word-spacing: -4px;
}

.woocommerce div.product .woocommerce-product-rating {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 30px;
	padding: 3px 0 0;
	line-height: 16px;
}

.woocommerce div.product .woocommerce-product-rating .woocommerce-review-link {
	color: var(--schon-muted-4);
	font-family: var(--schon-font-head);
	font-size: 14px;
	line-height: 16px;
}

/* Share / compare / wishlist. */

.schon-product-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 28px;
	margin: 0 0 23px;
	padding: 2px 0 34px;
	border-bottom: 1px solid #e1e1e1;
	color: var(--schon-muted-4);
	font-family: var(--schon-font-head);
	font-size: 13px;
	line-height: 16px;
	list-style: none;
	text-transform: uppercase;
}

.schon-product-actions a {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	color: var(--schon-muted-4);
}

.schon-product-actions a:hover,
.schon-product-actions a:focus {
	color: var(--schon-accent-2);
}

.woocommerce div.product .woocommerce-product-details__short-description {
	margin: 0 0 22px;
	padding: 0 0 19px;
	border-bottom: 1px solid #e1e1e1;
	color: var(--schon-muted-4);
	font-size: 16px;
	line-height: 21px;
}

.woocommerce div.product .woocommerce-product-details__short-description p:last-child {
	margin-bottom: 0;
}

/*
 * Scoped to the summary, not to `div.product`. The related-products row lives
 * inside `div.product` too, so an unscoped rule here also restyled every card
 * price in that row.
 */
.woocommerce div.product .summary p.price,
.woocommerce div.product .summary span.price,
.woocommerce div.product .entry-summary p.price,
.woocommerce div.product .entry-summary span.price {
	margin: 0 0 35px;
	color: var(--schon-black);
	font-family: var(--schon-font-head);
	font-size: 30px;
	font-weight: 400;
	letter-spacing: -1px;
	line-height: 32px;
}

.woocommerce div.product .summary p.price del,
.woocommerce div.product .entry-summary p.price del {
	margin: 0;
	padding: 0 0 0 9px;
	color: #b8b8b8;
	font-size: 18px;
	letter-spacing: 1px;
	line-height: 20px;
	opacity: 1;
}

.woocommerce div.product .summary p.price ins,
.woocommerce div.product .entry-summary p.price ins {
	text-decoration: none;
}

.woocommerce div.product form.cart {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin-bottom: 0;
}

/* Quantity row: an uppercase label beside the pill stepper. */

.schon-qty-row {
	display: flex;
	align-items: center;
	gap: 32px;
}

.schon-qty-label {
	color: var(--schon-muted-3);
	font-family: var(--schon-font-head);
	font-size: 14px;
	line-height: 16px;
	text-transform: uppercase;
}

.woocommerce div.product form.cart .variations {
	width: 100%;
	margin-bottom: 8px;
}

.woocommerce div.product form.cart .variations td {
	padding: 6px 0;
}

.woocommerce div.product form.cart .variations label {
	margin: 0;
	font-family: var(--schon-font-head);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.woocommerce .quantity {
	display: inline-flex;
	align-items: stretch;
	background: var(--schon-white);
	border: 1px solid var(--schon-line);
	border-radius: var(--schon-radius-pill);
	overflow: hidden;
}

.woocommerce .quantity .schon-qty-btn {
	width: 34px;
	background: none;
	border: 0;
	color: var(--schon-muted-3);
	font-size: 16px;
	line-height: 1;
	cursor: pointer;
}

.woocommerce .quantity .schon-qty-btn:hover {
	color: var(--schon-accent);
}

.woocommerce .quantity input.qty {
	width: 46px;
	min-height: 40px;
	padding: 0;
	background: none;
	border: 0;
	color: var(--schon-muted-3);
	font-family: var(--schon-font-head);
	font-size: 18px;
	font-weight: 700;
	line-height: 20px;
	text-align: center;
	appearance: textfield;
}

/*
 * On the product page the stepper is the reference's borderless white pill:
 * 72x42, no visible +/- controls, sitting on the #f6f6f6 band.
 */
.woocommerce div.product form.cart .quantity {
	border: 0;
}

.woocommerce div.product form.cart .quantity input.qty {
	width: 72px;
	min-height: 42px;
}

.woocommerce .quantity input.qty::-webkit-outer-spin-button,
.woocommerce .quantity input.qty::-webkit-inner-spin-button {
	margin: 0;
	appearance: none;
}

/* Buttons */

.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;
	gap: 8px;
	min-height: 42px;
	padding: 11px 26px;
	background: var(--schon-ink);
	border: 1px solid var(--schon-ink);
	border-radius: var(--schon-radius-pill);
	color: var(--schon-white);
	font-family: var(--schon-font-head);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0;
	line-height: 20px;
	text-transform: uppercase;
	transition: background 0.35s var(--schon-ease), border-color 0.35s var(--schon-ease), color 0.35s var(--schon-ease);
}

/*
 * The product page's own add-to-cart is the reference's coral pill: a fixed
 * 173px so it lines up with the quantity field beside it, going black on hover
 * rather than the usual coral-on-dark.
 */
.woocommerce div.product form.cart .single_add_to_cart_button {
	min-width: 173px;
	padding: 12px 10px 10px;
	background: var(--schon-accent-2);
	border-color: var(--schon-accent-2);
}

.woocommerce div.product form.cart .single_add_to_cart_button:hover,
.woocommerce div.product form.cart .single_add_to_cart_button:focus {
	background: var(--schon-black);
	border-color: var(--schon-black);
	color: var(--schon-white);
}

.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 {
	background: var(--schon-accent);
	border-color: var(--schon-accent);
	color: var(--schon-white);
}

.woocommerce a.button.disabled,
.woocommerce button.button:disabled,
.woocommerce button.button.disabled {
	background: var(--schon-line-2);
	border-color: var(--schon-line-2);
	color: var(--schon-white);
	opacity: 1;
	cursor: not-allowed;
}

.woocommerce .button.wc-backward,
.woocommerce a.button.wc-forward {
	background: transparent;
	color: var(--schon-ink);
}

/* Meta and sharing */

.woocommerce div.product .product_meta {
	padding-top: 18px;
	border-top: 1px solid var(--schon-line);
	color: var(--schon-muted-2);
	font-size: 13px;
}

.woocommerce div.product .product_meta > span {
	display: block;
	margin-bottom: 6px;
}

.woocommerce div.product .product_meta .sku_wrapper,
.woocommerce div.product .product_meta .posted_in,
.woocommerce div.product .product_meta .tagged_as {
	color: var(--schon-body);
}

/*
 * Tabs. The reference centres them under the fold on a white ground, so the
 * tab strip sits outside the grey band — hence the padding rather than a
 * margin, which would let the band bleed through.
 */

.woocommerce div.product .woocommerce-tabs {
	padding: 74px 0 0;
	color: #aaaaaa;
	font-size: 16px;
	font-weight: 300;
	line-height: 21px;
}

.woocommerce div.product .woocommerce-tabs ul.tabs {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0 54px;
	margin: 0 0 50px;
	padding: 0;
	border-bottom: 1px solid #c8c8c8;
}

.woocommerce div.product .woocommerce-tabs ul.tabs::before {
	content: none;
}

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

.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after {
	content: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	display: block;
	margin: 0 0 -1px;
	padding: 0 0 12px;
	border-bottom: 1px solid transparent;
	color: #9b9b9b;
	font-family: var(--schon-font-head);
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0;
	line-height: 20px;
	text-transform: uppercase;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a,
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover,
.woocommerce div.product .woocommerce-tabs ul.tabs li a:focus {
	border-bottom-color: var(--schon-black);
	color: var(--schon-black);
}

.woocommerce div.product .woocommerce-tabs .panel {
	margin: 0;
	padding: 0 0 85px;
	color: #aaaaaa;
	font-size: 16px;
	font-weight: 300;
	line-height: 21px;
}

.woocommerce div.product .woocommerce-tabs .panel p {
	margin: 0 0 20px;
}

.woocommerce div.product .woocommerce-tabs .panel h2 {
	margin-bottom: 14px;
	color: var(--schon-ink);
	font-family: var(--schon-font-head);
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 1px;
	line-height: 24px;
}

.woocommerce table.shop_attributes th {
	width: 200px;
	padding: 10px 0;
	color: var(--schon-ink);
	font-family: var(--schon-font-head);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1px;
	text-align: left;
	text-transform: uppercase;
}

.woocommerce table.shop_attributes td {
	padding: 10px 0;
	border-bottom: 1px solid var(--schon-line);
	font-style: normal;
}

/* Reviews */

.woocommerce #reviews #comments ol.commentlist li .comment-text {
	margin-left: 76px;
	padding: 20px;
	border: 1px solid var(--schon-line);
	border-radius: 0;
}

.woocommerce #reviews #comments ol.commentlist li img.avatar {
	width: 56px;
	padding: 0;
	border: 0;
	border-radius: 50%;
}

/* Star rating (core font-based widget) */

.woocommerce .star-rating,
.woocommerce p.stars a {
	color: var(--schon-star);
}

/* Related / upsells */

.woocommerce .related > h2,
.woocommerce .upsells > h2,
.woocommerce .cross-sells > h2 {
	margin: 0 0 13px;
	color: var(--schon-ink-2);
	font-family: var(--schon-font-head);
	font-size: 26px;
	font-weight: 700;
	letter-spacing: 0;
	line-height: 30px;
	text-transform: uppercase;
}

.woocommerce .related,
.woocommerce .upsells {
	padding: 0 0 130px;
}

.woocommerce .related ul.products,
.woocommerce .upsells ul.products {
	gap: 30px 0;
}

/* ==========================================================================
   Cart
   ========================================================================== */

.schon-woo-page {
	padding: 44px 0 76px;
}

.woocommerce table.shop_table {
	margin: 0 0 30px;
	border: 1px solid var(--schon-line);
	border-radius: 0;
	border-collapse: collapse;
}

.woocommerce table.shop_table th {
	padding: 16px 14px;
	background: var(--schon-surface);
	border-bottom: 1px solid var(--schon-line);
	color: var(--schon-ink);
	font-family: var(--schon-font-head);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.woocommerce table.shop_table td {
	padding: 18px 14px;
	border-top: 1px solid var(--schon-line);
	color: var(--schon-body);
	font-size: 14px;
	vertical-align: middle;
}

.woocommerce table.shop_table .product-name a {
	color: var(--schon-ink);
	font-family: var(--schon-font-body);
	font-size: 16px;
	font-weight: 600;
}

.woocommerce table.shop_table .product-name a:hover {
	color: var(--schon-accent);
}

.woocommerce table.shop_table img {
	width: 74px;
}

.woocommerce a.remove {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	background: var(--schon-surface);
	border-radius: 0;
	color: var(--schon-body) !important;
	font-size: 18px;
	line-height: 1;
}

.woocommerce a.remove:hover {
	background: var(--schon-accent);
	color: var(--schon-white) !important;
}

.woocommerce .cart-collaterals,
.woocommerce-page .cart-collaterals {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 380px;
	gap: 40px;
	align-items: start;
}

.woocommerce .cart-collaterals .cross-sells,
.woocommerce .cart-collaterals .cart_totals {
	width: auto;
	float: none;
}

.woocommerce .cart_totals h2,
.woocommerce-checkout #order_review_heading,
.woocommerce-billing-fields h3,
.woocommerce-shipping-fields h3,
.woocommerce-additional-fields h3 {
	margin: 0 0 18px;
	color: var(--schon-ink);
	font-family: var(--schon-font-head);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 1px;
	line-height: 22px;
	text-transform: uppercase;
}

.woocommerce .cart_totals table {
	border: 1px solid var(--schon-line);
}

.woocommerce .cart_totals .order-total .amount {
	color: var(--schon-accent);
	font-size: 20px;
}

.woocommerce .coupon {
	display: flex;
	gap: 10px;
}

.woocommerce .actions .button {
	margin-left: auto;
}

/* ==========================================================================
   Checkout, account
   ========================================================================== */

.woocommerce form .form-row {
	margin-bottom: 16px;
	padding: 0;
}

.woocommerce form .form-row label {
	margin-bottom: 6px;
	color: var(--schon-heading);
	font-size: 13px;
	font-weight: 600;
}

.woocommerce form .form-row .required {
	color: var(--schon-accent);
	text-decoration: none;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.select2-container .select2-selection--single {
	min-height: 44px;
	padding: 10px 16px;
	border: 1px solid var(--schon-line);
	border-radius: 0;
	color: var(--schon-heading);
	font-family: var(--schon-font-body);
	font-size: 14px;
	line-height: 22px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
	padding: 0;
	line-height: 24px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
	top: 10px;
	right: 10px;
}

.woocommerce-checkout #payment {
	background: var(--schon-surface);
	border-radius: 0;
}

.woocommerce-checkout #payment ul.payment_methods {
	padding: 18px;
	border-bottom: 1px solid var(--schon-line-2);
}

.woocommerce-checkout #payment div.payment_box {
	background: var(--schon-white);
	border-radius: 0;
	color: var(--schon-body);
	font-size: 13px;
}

.woocommerce-checkout #payment div.payment_box::before {
	border-bottom-color: var(--schon-white);
}

.woocommerce-checkout #payment div.form-row.place-order {
	padding: 18px;
}

.woocommerce-checkout #payment #place_order {
	width: 100%;
}

.schon-checkout-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
	gap: 44px;
	align-items: start;
}

/* Account */

.woocommerce-account .woocommerce-MyAccount-navigation {
	width: 24%;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
	margin: 0;
	padding: 0;
	list-style: none;
	border: 1px solid var(--schon-line);
}

.woocommerce-account .woocommerce-MyAccount-navigation li {
	margin: 0;
	border-bottom: 1px solid var(--schon-line);
}

.woocommerce-account .woocommerce-MyAccount-navigation li:last-child {
	border-bottom: 0;
}

.woocommerce-account .woocommerce-MyAccount-navigation li a {
	display: block;
	padding: 13px 18px;
	color: var(--schon-body);
	font-family: var(--schon-font-head);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
	background: var(--schon-accent);
	color: var(--schon-white);
}

.woocommerce-account .woocommerce-MyAccount-content {
	width: 72%;
}

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

.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-noreviews,
p.no-comments {
	margin: 0 0 24px;
	padding: 16px 20px 16px 46px;
	background: var(--schon-surface);
	border: 0;
	border-top: 2px solid var(--schon-accent);
	border-radius: 0;
	color: var(--schon-heading);
	font-size: 14px;
	line-height: 22px;
	list-style: none;
}

.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before {
	top: 18px;
	left: 18px;
	color: var(--schon-accent);
}

.woocommerce-error {
	border-top-color: #d63638;
}

.woocommerce-error::before {
	color: #d63638;
}

.woocommerce-message .button,
.woocommerce-info .button,
.woocommerce-error .button {
	min-height: 34px;
	padding: 6px 16px;
	font-size: 10px;
}

/* Onsale flash is replaced by the card caption; hide the core badge. */

.woocommerce span.onsale {
	display: none;
}

/* ==========================================================================
   WooCommerce Blocks — Cart and Checkout
   --------------------------------------------------------------------------
   WooCommerce ships block versions of the cart and checkout, and new stores
   get them by default. They render entirely different markup from the classic
   shortcodes above, so the design has to be applied twice. Both are styled so
   the theme looks the same whichever a store uses.
   ========================================================================== */

.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout {
	margin: 0;
}

/* Section titles */

.wp-block-woocommerce-cart .wc-block-cart__totals-title,
.wp-block-woocommerce-cart .wc-block-components-title,
.wp-block-woocommerce-checkout .wc-block-components-title,
.wp-block-woocommerce-checkout .wc-block-components-checkout-step__title,
.wc-block-components-title,
.wc-block-cart__totals-title,
.wc-block-components-checkout-step__title,
.wp-block-woocommerce-cart h2 {
	color: var(--schon-ink);
	font-family: var(--schon-font-head);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 1px;
	line-height: 22px;
	text-transform: uppercase;
}

.wc-block-components-checkout-step__description {
	color: var(--schon-body);
	font-size: 14px;
}

/* Line-item table */

/*
 * cart.css scopes its type rules as
 * `table.wc-block-cart-items .wc-block-cart-items__row .wc-block-components-product-name`,
 * so these have to be scoped at least as tightly to win.
 */
.wp-block-woocommerce-cart table.wc-block-cart-items .wc-block-cart-items__header,
.wp-block-woocommerce-cart table.wc-block-cart-items .wc-block-cart-items__header th {
	border-bottom: 1px solid var(--schon-line);
	color: var(--schon-ink);
	font-family: var(--schon-font-head);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.wc-block-cart-items__row,
.wc-block-components-order-summary-item {
	border-bottom: 1px solid var(--schon-line);
}

.wp-block-woocommerce-cart table.wc-block-cart-items .wc-block-cart-items__row .wc-block-components-product-name,
.wp-block-woocommerce-checkout .wc-block-components-order-summary-item .wc-block-components-product-name,
.wc-block-components-product-name {
	color: var(--schon-title);
	font-family: var(--schon-font-body);
	font-size: 16px;
	font-weight: 600;
	line-height: 22px;
}

.wp-block-woocommerce-cart table.wc-block-cart-items .wc-block-cart-items__row .wc-block-components-product-name:hover,
.wc-block-components-product-name:hover,
.wc-block-components-product-name:focus {
	color: var(--schon-accent);
}

.wc-block-components-product-price__value,
.wc-block-cart-item__total-price-and-sale-badge-wrapper .wc-block-components-product-price {
	color: var(--schon-black);
	font-family: var(--schon-font-body);
	font-size: 16px;
	font-weight: 600;
}

.wc-block-components-product-metadata,
.wc-block-components-product-metadata__description {
	color: var(--schon-muted-2);
	font-size: 13px;
	line-height: 19px;
}

/* Quantity stepper — match the classic one */

.wc-block-components-quantity-selector {
	border: 1px solid var(--schon-line);
	border-radius: 0;
}

.wc-block-components-quantity-selector::after {
	display: none;
}

.wc-block-components-quantity-selector__input {
	color: var(--schon-ink);
	font-family: var(--schon-font-head);
	font-size: 13px;
	font-weight: 700;
}

.wc-block-components-quantity-selector__button {
	color: var(--schon-heading);
	font-size: 16px;
}

.wc-block-components-quantity-selector__button:hover {
	color: var(--schon-accent);
}

/* Totals */

.wc-block-components-totals-item__label {
	color: var(--schon-body);
	font-size: 14px;
}

.wc-block-components-totals-item__value {
	color: var(--schon-heading);
	font-size: 14px;
	font-weight: 600;
}

.wc-block-components-totals-footer-item {
	border-top: 1px solid var(--schon-line);
}

.wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
	color: var(--schon-ink);
	font-family: var(--schon-font-head);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
.wc-block-components-totals-footer-item .wc-block-formatted-money-amount {
	color: var(--schon-accent);
	font-family: var(--schon-font-body);
	font-size: 22px;
	font-weight: 600;
}

.wc-block-components-totals-wrapper {
	border-top-color: var(--schon-line);
}

/* Buttons — the blocks button component, in every place it appears */

.wc-block-components-button:not(.is-link),
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding: 11px 26px;
	background-color: var(--schon-ink);
	border: 1px solid var(--schon-ink);
	border-radius: var(--schon-radius-pill);
	color: var(--schon-white);
	font-family: var(--schon-font-head);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0;
	line-height: 20px;
	text-transform: uppercase;
	transition: background-color 0.35s var(--schon-ease), border-color 0.35s var(--schon-ease);
}

.wc-block-components-button:not(.is-link):hover,
.wc-block-components-button:not(.is-link):focus,
.wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover {
	background-color: var(--schon-accent);
	border-color: var(--schon-accent);
	color: var(--schon-white);
}

.wc-block-components-button__text {
	color: inherit;
	font: inherit;
	letter-spacing: inherit;
}

.wc-block-components-button.is-link {
	color: var(--schon-accent);
	font-family: var(--schon-font-body);
}

/* Collapsible panels (coupon, order summary) */

.wc-block-components-panel__button {
	color: var(--schon-ink-2);
	font-family: var(--schon-font-head);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.wc-block-components-panel__button:hover {
	color: var(--schon-accent);
}

/* Form fields */

.wc-block-components-text-input input[type="text"],
.wc-block-components-text-input input[type="email"],
.wc-block-components-text-input input[type="tel"],
.wc-block-components-text-input input[type="number"],
.wc-block-components-textarea,
.wc-blocks-components-select__select {
	min-height: 46px;
	padding: 16px 16px 4px;
	background: var(--schon-white);
	border: 1px solid var(--schon-line);
	border-radius: 0;
	color: var(--schon-heading);
	font-family: var(--schon-font-body);
	font-size: 14px;
}

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

.wc-block-components-text-input label,
.wc-blocks-components-select__label {
	color: var(--schon-muted-2);
	font-family: var(--schon-font-body);
	font-size: 14px;
}

/* Shipping and payment option rows */

.wc-block-components-radio-control__option,
.wc-block-components-radio-control-accordion-option {
	border-color: var(--schon-line);
}

.wc-block-components-radio-control__label {
	color: var(--schon-heading);
	font-size: 14px;
	font-weight: 600;
}

.wc-block-components-radio-control__secondary-label,
.wc-block-components-radio-control__description {
	color: var(--schon-muted-2);
	font-size: 13px;
}

/* Notices */

.wc-block-components-notice-banner {
	border-radius: 0;
	border-width: 0;
	border-top: 2px solid var(--schon-accent);
	background: var(--schon-surface);
	color: var(--schon-heading);
	font-size: 14px;
}

.wc-block-components-notice-banner.is-error {
	border-top-color: #d63638;
}

.wc-block-components-notice-banner.is-success {
	border-top-color: #1a8917;
}

/* Sidebar column */

.wc-block-cart__sidebar .wc-block-components-sidebar,
.wc-block-checkout__sidebar {
	background: var(--schon-surface);
}

.wc-block-cart__sidebar .wc-block-components-sidebar > .wc-block-components-totals-wrapper:first-child {
	border-top: 0;
}

/* Quick view */

.schon-quickview-modal {
	position: fixed;
	inset: 0;
	z-index: 220;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	background: rgba(20, 20, 20, 0.55);
	opacity: 0;
	transition: opacity 0.3s var(--schon-ease);
}

.schon-quickview-modal[hidden] {
	display: none;
}

.schon-quickview-modal.is-open {
	opacity: 1;
}

.schon-quickview-dialog {
	position: relative;
	width: min(940px, 100%);
	max-height: 86vh;
	overflow-y: auto;
	padding: 34px;
	background: var(--schon-white);
}

.schon-quickview-close {
	position: absolute;
	top: 14px;
	right: 14px;
	padding: 8px;
	background: none;
	border: 0;
	color: var(--schon-heading);
	cursor: pointer;
}

.schon-quickview-close:hover {
	color: var(--schon-accent);
}

.schon-quickview-body {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 34px;
	align-items: start;
}

.schon-quickview-media img {
	width: 100%;
}

.schon-quickview-title {
	margin: 0 0 10px;
	color: var(--schon-ink);
	font-family: var(--schon-font-body);
	font-size: 24px;
	font-weight: 600;
	letter-spacing: 0;
	line-height: 32px;
	text-transform: capitalize;
}

.schon-quickview-price {
	display: block;
	margin-bottom: 14px;
	color: var(--schon-black);
	font-size: 23px;
	font-weight: 600;
}

.schon-quickview-excerpt {
	margin-bottom: 20px;
	color: var(--schon-body);
	font-size: 14px;
	line-height: 23px;
}

.schon-quickview-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: 0;
}

.schon-quickview-loading {
	padding: 40px;
	color: var(--schon-muted-2);
	text-align: center;
}