/*
 * Second Walk WooCommerce base. Loaded on shop, product, cart, checkout and
 * account pages only. Brings WooCommerce's default screens onto the design
 * system; the full shop, product, cart and checkout layouts come in later phases.
 */

/* ---------- Forms ---------- */

.woocommerce form .form-row {
	margin: 0 0 var(--sw-space-4);
	padding: 0;
}

.woocommerce form .form-row label {
	margin-bottom: 6px;
	font-size: var(--sw-text-sm);
	font-weight: 600;
	line-height: 1.4;
}

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

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
	min-height: var(--sw-control-h);
	padding: 0.625rem 0.75rem;
	border: 1px solid var(--sw-line-strong);
	border-radius: var(--sw-radius-sm);
	background-color: var(--sw-white);
	color: var(--sw-ink);
	font-size: var(--sw-text-md);
	line-height: 1.4;
}

.woocommerce form .form-row textarea {
	min-height: 120px;
}

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

.woocommerce form .form-row.woocommerce-validated input.input-text,
.woocommerce form .form-row.woocommerce-validated select {
	border-color: var(--sw-line-strong);
}

.woocommerce form .form-row.woocommerce-invalid input.input-text,
.woocommerce form .form-row.woocommerce-invalid select,
.woocommerce form .form-row.woocommerce-invalid label {
	border-color: var(--sw-error);
}

.woocommerce form .form-row.woocommerce-invalid label {
	color: var(--sw-error);
}

.woocommerce .checkout-inline-error-message,
.woocommerce form .form-row .woocommerce-input-wrapper .description {
	color: var(--sw-error);
	font-size: var(--sw-text-sm);
}

.woocommerce form .form-row .woocommerce-input-wrapper .description {
	color: var(--sw-muted);
}

/* Country and state selects (selectWoo). */
.select2-container--default .select2-selection--single {
	height: var(--sw-control-h);
	border: 1px solid var(--sw-line-strong);
	border-radius: var(--sw-radius-sm);
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
	padding-inline: 0.75rem 2rem;
	color: var(--sw-ink);
	line-height: calc(var(--sw-control-h) - 2px);
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
	height: calc(var(--sw-control-h) - 2px);
}

.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single {
	border-color: var(--sw-navy);
}

.select2-dropdown {
	border-color: var(--sw-line-strong);
	border-radius: var(--sw-radius-sm);
}

.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted[data-selected] {
	background-color: var(--sw-navy);
}

/* Quantity. Unique pairs are sold individually, so this mostly appears for other items. */
.woocommerce .quantity .qty {
	width: 4.5em;
	min-height: var(--sw-control-h);
	text-align: center;
}

/* ---------- Notices ---------- */

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	margin: 0 0 var(--sw-space-5);
	padding: var(--sw-space-4) var(--sw-space-4) var(--sw-space-4) 3.25rem;
	border-radius: var(--sw-radius-sm);
	font-size: var(--sw-text-sm);
	line-height: 1.5;
}

.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before {
	top: var(--sw-space-4);
	left: var(--sw-space-4);
}

.woocommerce-message .button,
.woocommerce-info .button {
	margin-inline-start: var(--sw-space-3);
}

.woocommerce-message .button,
.woocommerce-info .button {
	min-height: 40px !important;
	padding-block: 0.625rem !important;
}

/* ---------- Prices, sale, stock ---------- */

.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce ul.products li.product .price {
	color: var(--sw-ink);
	font-weight: 700;
}

.woocommerce div.product p.price del,
.woocommerce div.product span.price del,
.woocommerce ul.products li.product .price del {
	color: var(--sw-muted);
	font-weight: 400;
	opacity: 1;
}

.woocommerce div.product p.price ins,
.woocommerce div.product span.price ins,
.woocommerce ul.products li.product .price ins {
	color: var(--sw-sale);
	font-weight: 700;
	text-decoration: none;
}

.woocommerce span.onsale,
.woocommerce ul.products li.product .onsale {
	top: var(--sw-space-2);
	left: var(--sw-space-2);
	right: auto;
	min-width: 0;
	min-height: 0;
	margin: 0;
	padding: 0.25rem 0.5rem;
	border-radius: var(--sw-radius-xs);
	background-color: var(--sw-sale);
	color: var(--sw-white);
	font-size: var(--sw-text-xs);
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: var(--sw-tracking-label);
	text-transform: uppercase;
}

.woocommerce div.product .stock {
	color: var(--sw-ink);
	font-weight: 600;
}

/* Sold: a labelled badge, so the state never depends on colour alone. */
.woocommerce div.product .stock.out-of-stock {
	display: inline-flex;
	padding: 0.375rem 0.75rem;
	border-radius: var(--sw-radius-xs);
	background-color: var(--sw-sold);
	color: var(--sw-white);
	font-size: var(--sw-text-xs);
	letter-spacing: var(--sw-tracking-label);
	text-transform: uppercase;
}

/* ---------- Tables, cart, checkout ---------- */

.woocommerce table.shop_table {
	border: var(--sw-border);
	border-radius: var(--sw-radius-sm);
	border-collapse: separate;
}

.woocommerce table.shop_table {
	margin: 0 0 var(--sw-space-5);
}

.woocommerce table.shop_table th {
	font-weight: 600;
}

.woocommerce table.shop_table th,
.woocommerce table.shop_table td {
	padding: var(--sw-space-3) var(--sw-space-4);
	vertical-align: middle;
}

.woocommerce table.shop_table td,
.woocommerce table.shop_table th,
.woocommerce table.shop_table tbody th,
.woocommerce table.shop_table tfoot td,
.woocommerce table.shop_table tfoot th {
	border-top-color: var(--sw-line);
}

.woocommerce-cart table.cart img {
	width: 72px;
	border-radius: var(--sw-radius-sm);
	background-color: var(--sw-paper);
}

.woocommerce a.remove {
	color: var(--sw-muted) !important;
}

.woocommerce a.remove:hover {
	background-color: var(--sw-paper);
	color: var(--sw-error) !important;
}

.woocommerce-cart .cart-collaterals .cart_totals h2,
.woocommerce-checkout h3,
#order_review_heading {
	font-size: var(--sw-h3);
}

.woocommerce-checkout #payment {
	border-radius: var(--sw-radius-sm);
	background-color: var(--sw-paper);
}

.woocommerce-checkout #payment div.payment_box {
	background-color: var(--sw-white);
	color: var(--sw-ink);
}

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

.woocommerce-checkout #payment ul.payment_methods {
	border-bottom-color: var(--sw-line);
}

/* An empty notices container must not take up space (it would double grid gaps). */
.woocommerce-notices-wrapper:empty {
	display: none;
}

/* ---------- Classic cart ---------- */

.woocommerce-cart .woocommerce {
	display: grid;
	gap: var(--sw-space-6);
}

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

@media (min-width: 1024px) {
	.woocommerce-cart .woocommerce {
		grid-template-columns: minmax(0, 1fr) 380px;
		align-items: start;
	}

	.woocommerce-cart .woocommerce > .woocommerce-notices-wrapper,
	.woocommerce-cart .woocommerce > .cart-empty,
	.woocommerce-cart .woocommerce > .return-to-shop {
		grid-column: 1 / -1;
	}
}

.woocommerce-cart .cart-collaterals,
.woocommerce-cart .cart-collaterals .cart_totals {
	float: none;
	width: 100%;
}

.woocommerce-cart .cart-collaterals .cart_totals {
	padding: var(--sw-space-5);
	border: var(--sw-border);
	border-radius: var(--sw-radius-sm);
	background-color: var(--sw-paper);
}

.woocommerce-cart .cart-collaterals .cart_totals h2 {
	margin: 0 0 var(--sw-space-4);
}

.woocommerce-cart .cart-collaterals .cart_totals table.shop_table {
	margin-bottom: var(--sw-space-5);
}

.woocommerce-cart .cart-collaterals .cart_totals table.shop_table {
	background-color: var(--sw-white);
}

.woocommerce-cart .cart-collaterals .cross-sells {
	display: none;
}

.woocommerce .wc-proceed-to-checkout {
	padding-bottom: 0;
}

.woocommerce .wc-proceed-to-checkout a.checkout-button {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 52px;
	margin-bottom: 0;
	font-size: var(--sw-text-md);
}

.woocommerce table.cart td.actions .coupon {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sw-space-2);
}

.woocommerce table.cart td.actions .coupon #coupon_code,
.woocommerce table.cart td.actions .coupon .input-text {
	width: 180px;
	min-height: 44px;
	margin-inline-end: var(--sw-space-2);
	padding: 0 0.75rem;
	border: 1px solid var(--sw-line-strong);
	border-radius: var(--sw-radius-sm);
}

.woocommerce table.cart td.actions button[name="update_cart"] {
	background-color: var(--sw-white);
	color: var(--sw-navy);
}

.woocommerce table.cart td.actions button[name="update_cart"]:disabled {
	opacity: 0.45;
}

/* A unique pair has a fixed quantity of 1 (WooCommerce hides the input): say so. */
.woocommerce table.cart td.product-quantity:has(input[type="hidden"].qty)::after {
	content: "1";
}

.woocommerce table.cart .product-name a {
	color: var(--sw-ink);
	font-weight: 600;
	text-decoration: none;
}

/* ---------- Classic checkout ---------- */

.woocommerce .col2-set .col-1,
.woocommerce .col2-set .col-2,
.woocommerce-page .col2-set .col-1,
.woocommerce-page .col2-set .col-2 {
	float: none;
	width: 100%;
}

.woocommerce-checkout h3,
.woocommerce-checkout #order_review_heading {
	margin: 0 0 var(--sw-space-4);
}

.woocommerce-checkout .woocommerce-additional-fields {
	margin-top: var(--sw-space-5);
}

.woocommerce-checkout #payment ul.payment_methods,
.woocommerce-checkout #payment div.form-row {
	padding: var(--sw-space-4);
}

.woocommerce-checkout #order_review {
	padding: var(--sw-space-5);
	border: var(--sw-border);
	border-radius: var(--sw-radius-sm);
	background-color: var(--sw-paper);
}

.woocommerce-checkout #order_review table.shop_table {
	background-color: var(--sw-white);
}

.woocommerce-checkout #place_order {
	width: 100%;
	min-height: 52px;
	font-size: var(--sw-text-md);
}

.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info,
.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info {
	margin-bottom: var(--sw-space-4);
}

@media (min-width: 1024px) {
	.woocommerce-checkout form.checkout {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 420px;
		column-gap: var(--sw-space-7);
		align-items: start;
	}

	.woocommerce-checkout form.checkout > * {
		grid-column: 1;
	}

	.woocommerce-checkout form.checkout > .woocommerce-NoticeGroup {
		grid-column: 1 / -1;
	}

	.woocommerce-checkout form.checkout > #customer_details {
		grid-row: 1 / span 3;
	}

	.woocommerce-checkout form.checkout > #order_review_heading {
		grid-column: 2;
		grid-row: 1;
		margin-top: 0;
	}

	.woocommerce-checkout form.checkout > #order_review {
		position: sticky;
		top: var(--sw-space-4);
		grid-column: 2;
		grid-row: 2;
	}
}

/* ---------- Login and registration ---------- */

@media (min-width: 768px) {
	.woocommerce-account .u-columns.col2-set {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: var(--sw-space-6);
	}

	.woocommerce-account .u-columns.col2-set::before,
	.woocommerce-account .u-columns.col2-set::after {
		display: none;
	}
}

/* ---------- My account ---------- */

@media (min-width: 1024px) {
	.woocommerce-account .woocommerce {
		display: grid;
		grid-template-columns: 240px minmax(0, 1fr);
		gap: var(--sw-space-7);
		align-items: start;
	}

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

	.woocommerce-account .woocommerce > .woocommerce-notices-wrapper,
	.woocommerce-account .woocommerce > .u-columns,
	.woocommerce-account .woocommerce > h2 {
		grid-column: 1 / -1;
	}

	.woocommerce-account .woocommerce-MyAccount-navigation,
	.woocommerce-account .woocommerce-MyAccount-content {
		float: none;
		width: auto;
	}
}

.woocommerce-MyAccount-content > :first-child {
	margin-top: 0;
}

.woocommerce-MyAccount-navigation ul {
	margin: 0 0 var(--sw-space-6);
	padding: 0;
	border-top: var(--sw-border);
	list-style: none;
}

.woocommerce-MyAccount-navigation li a {
	display: block;
	padding: var(--sw-space-3) var(--sw-space-3);
	border-bottom: var(--sw-border);
	color: var(--sw-ink);
	font-weight: 600;
	text-decoration: none;
}

.woocommerce-MyAccount-navigation li.is-active a {
	background-color: var(--sw-paper);
	box-shadow: inset 3px 0 0 var(--sw-navy);
}

.woocommerce form.login,
.woocommerce form.register,
.woocommerce form.checkout_coupon {
	margin: 0 0 var(--sw-space-5);
	padding: var(--sw-space-5);
	border-color: var(--sw-line);
	border-radius: var(--sw-radius-sm);
}

/* ---------- Native reviews and stars ---------- */

.woocommerce .star-rating {
	color: var(--sw-navy);
}

.woocommerce .star-rating::before {
	color: var(--sw-line-strong);
	opacity: 1;
}

.woocommerce p.stars a {
	color: var(--sw-navy);
}

.woocommerce p.stars a:focus-visible {
	outline: 2px solid var(--sw-navy);
	outline-offset: 2px;
}

.woocommerce #reviews #comments ol.commentlist {
	padding: 0;
}

.woocommerce #reviews #comments ol.commentlist li {
	margin: 0;
	padding-block: var(--sw-space-5);
	border-top: var(--sw-border);
}

.woocommerce #reviews #comments ol.commentlist li .comment-text {
	margin: 0;
	padding: 0;
	border: 0;
}

.woocommerce #reviews #comments ol.commentlist li .meta {
	color: var(--sw-muted);
	font-size: var(--sw-text-sm);
}

.woocommerce #reviews #comments ol.commentlist li .meta strong {
	color: var(--sw-ink);
}

.woocommerce-review__verified {
	color: var(--sw-success);
	font-style: normal;
	font-weight: 600;
}

.woocommerce #review_form #respond textarea {
	min-height: 120px;
}