/* Porto owns the columns, responsive tables, quantity updates and mobile CTA.
   This stylesheet is loaded only for the cart and classic checkout. */
body.woocommerce-cart,
body.woocommerce-checkout {
	--st-commerce-ink: #252b30;
	--st-commerce-muted: #52626b;
	--st-commerce-orange: #f8931d;
	--st-commerce-blue: #087a9f;
	--st-commerce-border: #dceaf0;
	--st-commerce-pale: #eaf8fe;
}

.woocommerce-cart .woocommerce-cart-form,
.woocommerce-cart .cart_totals,
.woocommerce-checkout form.checkout .woocommerce-billing-fields,
.woocommerce-checkout form.checkout .woocommerce-shipping-fields,
.woocommerce-checkout form.checkout .woocommerce-additional-fields,
.woocommerce-checkout #order_review {
	border: 1px solid var(--st-commerce-border);
	border-radius: 14px;
	background: #fff;
	padding: clamp(16px, 2.2vw, 28px);
	box-shadow: 0 5px 20px rgb(37 43 48 / 4%);
}

.woocommerce-cart .cart_totals { background: #f6fbfd; }
.woocommerce-checkout form.checkout .woocommerce-shipping-fields,
.woocommerce-checkout form.checkout .woocommerce-additional-fields { margin-top: 20px; }
.woocommerce-checkout form.checkout .woocommerce-shipping-fields:empty,
.woocommerce-checkout form.checkout .woocommerce-additional-fields:empty { display: none; }

.woocommerce-cart .cart_totals h2,
.woocommerce-checkout form.checkout h3 {
	color: var(--st-commerce-ink);
	font-size: clamp(19px, 2vw, 23px);
	font-weight: 700;
	letter-spacing: -0.02em;
	text-transform: none;
}

.woocommerce-cart .shop_table,
.woocommerce-checkout .woocommerce-checkout-review-order-table {
	border-color: var(--st-commerce-border);
	color: var(--st-commerce-ink);
}
.woocommerce-cart .shop_table th,
.woocommerce-checkout .woocommerce-checkout-review-order-table th {
	text-transform: none;
	letter-spacing: normal;
}
.woocommerce-cart .shop_table td,
.woocommerce-checkout .woocommerce-checkout-review-order-table td,
.woocommerce-checkout .woocommerce-checkout-review-order-table th {
	border-color: var(--st-commerce-border);
}
.woocommerce-cart .shop_table .product-name a { color: var(--st-commerce-ink); font-weight: 600; }
.woocommerce-cart .shop_table .product-thumbnail img { border-radius: 8px; object-fit: contain; }
.woocommerce-cart .cart_totals .order-total,
.woocommerce-checkout .woocommerce-checkout-review-order-table .order-total {
	font-size: 1.15em;
	color: var(--st-commerce-ink);
}

.woocommerce-checkout form.checkout .form-row label {
	color: var(--st-commerce-ink);
	font-weight: 600;
	text-transform: none;
}
.woocommerce-checkout form.checkout .input-text,
.woocommerce-cart .coupon .input-text,
.woocommerce-checkout form.checkout .select2-selection--single {
	border: 1px solid #b9cbd4;
	border-radius: 8px;
	background-color: #fff;
	color: var(--st-commerce-ink);
	min-height: 46px;
}
.woocommerce-checkout form.checkout .select2-selection__rendered { line-height: 44px; }
.woocommerce-checkout form.checkout .select2-selection__arrow { height: 44px; }
.woocommerce-checkout form.checkout textarea.input-text { min-height: 100px; }
.woocommerce-checkout form.checkout .woocommerce-invalid .input-text,
.woocommerce-checkout form.checkout .woocommerce-invalid .select2-selection--single { border-color: #b32d2e; }

.woocommerce-checkout form.checkout :is(input, textarea, select, button, a):focus-visible,
.woocommerce-cart .woocommerce :is(input, button, a):focus-visible,
.woocommerce-checkout .select2-container--focus .select2-selection {
	outline: 3px solid var(--st-commerce-blue);
	outline-offset: 3px;
}

.woocommerce-checkout #payment { background: transparent; border-radius: 10px; }
.woocommerce-checkout #payment ul.payment_methods {
	padding: 0;
	border-color: var(--st-commerce-border);
}
.woocommerce-checkout #payment ul.payment_methods > li {
	padding: 13px 0;
	border-bottom: 1px solid var(--st-commerce-border);
}
.woocommerce-checkout #payment ul.payment_methods > li:last-child { border-bottom: 0; }
.woocommerce-checkout #payment div.payment_box {
	background: var(--st-commerce-pale);
	color: var(--st-commerce-ink);
	border-radius: 8px;
	line-height: 1.6;
}
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: var(--st-commerce-pale); }
.woocommerce-checkout #payment .place-order { padding: 20px 0 0; }

.woocommerce-checkout .woocommerce-privacy-policy-text,
.woocommerce-checkout .st-checkout-agreement {
	color: var(--st-commerce-muted);
	font-size: 13px;
	line-height: 1.65;
	text-align: left;
}
.woocommerce-checkout .st-checkout-agreement { margin: 12px 0 16px; }
.woocommerce-checkout .st-checkout-agreement a,
.woocommerce-checkout .woocommerce-privacy-policy-text a {
	color: var(--st-commerce-blue);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
.woocommerce-cart .wc-proceed-to-checkout a.button,
.woocommerce-checkout #place_order {
	background: var(--st-commerce-orange);
	border: 1px solid var(--st-commerce-orange);
	border-radius: 9px;
	color: var(--st-commerce-ink);
	font-size: 16px;
	font-weight: 700;
	letter-spacing: normal;
	text-transform: none;
	min-height: 48px;
	padding: 14px 20px;
	line-height: 1.4;
	white-space: normal;
	width: 100%;
}
.woocommerce-cart .wc-proceed-to-checkout a.button:hover,
.woocommerce-checkout #place_order:hover { background: #fba63f; border-color: #fba63f; color: #252b30; }
.woocommerce-checkout #place_order:disabled { opacity: 0.6; cursor: not-allowed; }
.woocommerce-cart .coupon .button,
.woocommerce-cart button[name="update_cart"] {
	border-radius: 8px;
	min-height: 44px;
	text-transform: none;
	letter-spacing: normal;
}

@media (max-width: 575px) {
	.woocommerce-cart .woocommerce-cart-form,
	.woocommerce-cart .cart_totals,
	.woocommerce-checkout form.checkout .woocommerce-billing-fields,
	.woocommerce-checkout form.checkout .woocommerce-shipping-fields,
	.woocommerce-checkout form.checkout .woocommerce-additional-fields,
	.woocommerce-checkout #order_review { padding: 16px; border-radius: 10px; }
	.woocommerce-checkout form.checkout .input-text { font-size: 16px; }
	.woocommerce-checkout form.checkout .form-row-first,
	.woocommerce-checkout form.checkout .form-row-last { width: 100%; float: none; }
	.woocommerce-cart .coupon .input-text { max-width: 100%; }
}
