/**
 * Stage G: Cart, Checkout & My Account Minimal Luxury Styles
 */

body.woocommerce-cart .site-main,
body.woocommerce-checkout .site-main,
body.woocommerce-account .site-main {
	padding-top: var(--space-macro-desktop);
	padding-bottom: var(--space-macro-desktop);
}

.woocommerce-notices-wrapper {
	margin-bottom: 3rem;
}

.woocommerce-error, .woocommerce-info, .woocommerce-message {
	background: var(--wp--preset--color--sand);
	color: var(--wp--preset--color--obsidian);
	padding: 1.5rem 2rem;
	margin-bottom: 1.5rem;
	border-left: 3px solid var(--wp--preset--color--obsidian);
	list-style: none;
}
.woocommerce-error {
	border-left-color: var(--wp--preset--color--cinnabar);
}

.woocommerce-cart-form {
	overflow-x: auto;
}

.woocommerce-cart-form__contents {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 3rem;
	min-width: 600px;
}

.woocommerce-cart-form__contents th {
	font-family: var(--font-sans);
	font-size: var(--wp--preset--font-size--ui-meta);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	border-bottom: 1px solid var(--wp--preset--color--obsidian);
	padding: 1rem 0;
	text-align: left;
}

.woocommerce-cart-form__contents td {
	padding: 2rem 0;
	border-bottom: 1px solid var(--wp--preset--color--sand);
	vertical-align: middle;
}

.cart_item .product-thumbnail img {
	width: 80px;
	aspect-ratio: 3/4;
	object-fit: cover;
	background: var(--wp--preset--color--sand);
}

.cart-collaterals {
	display: flex;
	justify-content: flex-end;
	margin-top: 3rem;
}

.cart_totals {
	width: 100%;
	max-width: 450px;
	background: var(--wp--preset--color--sand);
	padding: 3rem;
}

.cart_totals h2 {
	font-family: var(--wp--preset--font-family--cormorant-garamond);
	font-size: 1.75rem;
	margin-bottom: 1.5rem;
	border-bottom: 1px solid var(--wp--preset--color--champagne);
	padding-bottom: 1rem;
}

.cart_totals table.shop_table {
	width: 100%;
	margin-bottom: 2rem;
}

.cart_totals table.shop_table th,
.cart_totals table.shop_table td {
	padding: 0.75rem 0;
	border-bottom: 1px solid var(--wp--preset--color--champagne);
}

.cart_totals .checkout-button {
	display: block;
	width: 100%;
	background: var(--wp--preset--color--obsidian);
	color: var(--wp--preset--color--pure-white);
	text-align: center;
	padding: 1rem 2.5rem;
	text-transform: uppercase;
	font-size: var(--wp--preset--font-size--ui-meta);
	letter-spacing: 0.04em;
	transition: background-color var(--duration-fast);
}
.cart_totals .checkout-button:hover {
	background: var(--wp--preset--color--charcoal);
}

.luxury-cross-sells {
	margin-top: 5rem;
}
.luxury-cross-sells h2 {
	font-family: var(--wp--preset--font-family--cormorant-garamond);
	font-size: 1.75rem;
	margin-bottom: 2rem;
}
.luxury-cross-sells-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 24px;
}
@media (max-width: 1024px) {
	.luxury-cross-sells-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 16px;
	}
}

form.checkout.woocommerce-checkout {
	display: grid;
	grid-template-columns: minmax(0, 11fr) minmax(320px, 9fr);
	gap: clamp(32px, 5vw, 72px);
	align-items: start;
}

#customer_details {
	grid-column: 1;
	grid-row: 1 / span 2;
}

#order_review_heading {
	grid-column: 2;
	grid-row: 1;
}

#order_review {
	grid-column: 2;
	grid-row: 2;
}

.woocommerce-billing-fields h3,
.woocommerce-shipping-fields h3,
#order_review_heading {
	font-family: var(--wp--preset--font-family--cormorant-garamond);
	font-size: 1.75rem;
	margin-bottom: 1.5rem;
	border-bottom: 1px solid var(--wp--preset--color--sand);
	padding-bottom: 1rem;
}

.form-row {
	margin-bottom: 1.5rem;
}

.form-row label {
	display: block;
	font-family: var(--wp--preset--font-family--inter);
	font-size: var(--wp--preset--font-size--ui-meta);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin-bottom: 0.5rem;
}

.form-row .input-text,
.form-row select {
	width: 100%;
	padding: 0.75rem 1rem;
	background: transparent;
	border: 1px solid var(--wp--preset--color--champagne);
	outline: none;
}

#order_review {
	background: var(--wp--preset--color--sand);
	padding: 3rem;
}

#order_review table.shop_table {
	width: 100%;
	margin-bottom: 2rem;
}

#order_review table.shop_table th,
#order_review table.shop_table td {
	padding: 1rem 0;
	border-bottom: 1px solid var(--wp--preset--color--champagne);
}

#payment {
	background: transparent !important;
}

#payment ul.payment_methods {
	list-style: none;
	padding: 0;
	margin-bottom: 2rem;
}

#payment ul.payment_methods li {
	margin-bottom: 1rem;
}

#payment div.form-row.place-order {
	padding: 0 !important;
}

#place_order {
	display: block;
	width: 100%;
	background: var(--wp--preset--color--obsidian);
	color: var(--wp--preset--color--pure-white);
	border: none;
	text-align: center;
	padding: 1rem 2.5rem;
	text-transform: uppercase;
	font-size: var(--wp--preset--font-size--ui-meta);
	letter-spacing: 0.04em;
	cursor: pointer;
	transition: background-color var(--duration-fast);
}
#place_order:hover {
	background: var(--wp--preset--color--charcoal);
}

.woocommerce-account .woocommerce-MyAccount-navigation {
	float: left;
	width: 25%;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
	list-style: none;
	padding: 0;
}

.woocommerce-account .woocommerce-MyAccount-navigation li {
	margin-bottom: 1rem;
}

.woocommerce-account .woocommerce-MyAccount-navigation a {
	font-family: var(--wp--preset--font-family--inter);
	font-size: var(--wp--preset--font-size--ui-meta);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--charcoal);
	transition: color var(--duration-fast);
}

.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation a:hover {
	color: var(--wp--preset--color--obsidian);
	font-weight: 500;
}

.woocommerce-account .woocommerce-MyAccount-content {
	float: right;
	width: 70%;
}

@media (max-width: 1024px) {
	form.checkout.woocommerce-checkout {
		display: block;
	}
	#customer_details,
	#order_review_heading,
	#order_review {
		grid-column: auto;
		grid-row: auto;
	}
	#order_review {
		margin-top: 3rem;
	}
	.woocommerce-account .woocommerce-MyAccount-navigation,
	.woocommerce-account .woocommerce-MyAccount-content {
		float: none;
		width: 100%;
	}
	.woocommerce-account .woocommerce-MyAccount-navigation {
		margin-bottom: 3rem;
	}
}
