/*
 * ECC Cart and Checkout
 *
 * Restyles the cart, the checkout and the order received page to match the
 * account pages. Everything is scoped to body.ecc-cc, which is only added on
 * those three pages.
 *
 * Elementor and WooCommerce write their own colours with very specific
 * selectors, so the rules that compete with them use !important.
 */

body.ecc-cc {
	--ecc-cc-green: var(--e-global-color-primary, #046c63);
	--ecc-cc-green-dark: #03524b;
	--ecc-cc-green-tint: #e6f2f0;
	--ecc-cc-ink: #3c3947;
	--ecc-cc-muted: #6d7178;
	--ecc-cc-card: #f5f6f7;
	--ecc-cc-line: #e4e7ea;
	--ecc-cc-field: #d5dade;
	--ecc-cc-red: #9a2828;
	--ecc-cc-red-tint: #fbeeee;
	--ecc-cc-head: "Work Sans", Helvetica, Arial, sans-serif;
	--ecc-cc-text: "Inter", Helvetica, Arial, sans-serif;
	--ecc-cc-radius: 16px;
	--ecc-cc-icon-cart: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22black%22 stroke-width=%221.7%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M3 4.5h2.2l2.3 10.2a1.5 1.5 0 0 0 1.5 1.2h8.3a1.5 1.5 0 0 0 1.5-1.2L20 8.5H6.3%22/%3E%3Ccircle cx=%229.5%22 cy=%2219.5%22 r=%221.3%22/%3E%3Ccircle cx=%2217%22 cy=%2219.5%22 r=%221.3%22/%3E%3C/svg%3E");
	--ecc-cc-icon-tick: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22m5.5 12.5 4.2 4.2 8.8-9.2%22/%3E%3C/svg%3E");
}

/* ------------------------------------------------------------------
 * Page heading
 * ---------------------------------------------------------------- */

body.ecc-cc [data-elementor-type="wp-page"] .elementor-widget-heading h1.elementor-heading-title,
body.ecc-cc main .page-header h1.entry-title {
	margin: 0;
	color: var(--ecc-cc-ink) !important;
	font-family: var(--ecc-cc-head) !important;
	font-size: 34px !important;
	font-weight: 600 !important;
	line-height: 1.2 !important;
	letter-spacing: -0.6px;
}

/* The checkout uses the theme's page layout, which is narrower than the
   cart and the account pages. Bring it out to the same width. */
body.ecc-cc:not([class*="elementor-page-"]) main.site-main {
	box-sizing: border-box;
	width: 100%;
	max-width: 1340px;
	padding-right: 30px;
	padding-left: 30px;
}

body.ecc-cc main .page-header {
	max-width: none;
	margin: 0 0 28px;
	padding: 48px 0 0;
}

body.ecc-cc main .page-header h1.entry-title {
	max-width: none;
	padding: 0;
}

body.ecc-cc main .page-content {
	padding-bottom: 80px;
}

/* ------------------------------------------------------------------
 * Notices (cart and order received)
 * ---------------------------------------------------------------- */

body.ecc-cc .woocommerce .woocommerce-info,
body.ecc-cc .woocommerce .woocommerce-message,
body.ecc-cc .woocommerce .woocommerce-error {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px 18px;
	margin: 0 0 16px !important;
	padding: 14px 20px !important;
	border: 0 !important;
	border-left: 3px solid var(--ecc-cc-green) !important;
	border-radius: 12px !important;
	outline: 0;
	background: var(--ecc-cc-card) !important;
	color: var(--ecc-cc-ink) !important;
	font-family: var(--ecc-cc-text) !important;
	font-size: 15px !important;
	line-height: 1.5 !important;
	list-style: none;
}

body.ecc-cc .woocommerce .woocommerce-error {
	border-left-color: var(--ecc-cc-red) !important;
}

body.ecc-cc .woocommerce .woocommerce-info::before,
body.ecc-cc .woocommerce .woocommerce-message::before,
body.ecc-cc .woocommerce .woocommerce-error::before,
body.ecc-cc .woocommerce .woocommerce-info::after,
body.ecc-cc .woocommerce .woocommerce-message::after,
body.ecc-cc .woocommerce .woocommerce-error::after {
	display: none !important;
}

body.ecc-cc .woocommerce .woocommerce-info .button,
body.ecc-cc .woocommerce .woocommerce-message .button {
	float: none !important;
	order: 2;
	margin: 0 !important;
	padding: 8px 18px !important;
	border: 1.5px solid var(--ecc-cc-green) !important;
	border-radius: 999px !important;
	background: transparent !important;
	color: var(--ecc-cc-green) !important;
	font-family: var(--ecc-cc-text) !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	line-height: 1.4 !important;
	text-decoration: none !important;
}

body.ecc-cc .woocommerce .woocommerce-info .button:hover,
body.ecc-cc .woocommerce .woocommerce-message .button:hover {
	background: var(--ecc-cc-green) !important;
	color: #fff !important;
}

body.ecc-cc .woocommerce .woocommerce-notices-wrapper:not(:empty) {
	margin-bottom: 28px;
}

/* ------------------------------------------------------------------
 * Cart: layout
 * ---------------------------------------------------------------- */

body.ecc-cc .elementor-widget-woocommerce-cart .woocommerce {
	color: var(--ecc-cc-ink);
	font-family: var(--ecc-cc-text);
	font-size: 16px;
	line-height: 1.55;
}

body.ecc-cc .elementor-widget-woocommerce-cart {
	--order-summary-color: var(--ecc-cc-ink) !important;
	--totals-color: var(--ecc-cc-ink) !important;
	--sections-title-color: var(--ecc-cc-ink) !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart .e-cart__container {
	column-gap: 44px !important;
	row-gap: 32px !important;
	align-items: start;
}

/* The widget draws a bordered box around each part. Drop the boxes. */
body.ecc-cc .elementor-widget-woocommerce-cart .e-cart-section {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
}

/* ------------------------------------------------------------------
 * Cart: items table
 * ---------------------------------------------------------------- */

body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart {
	width: 100%;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-collapse: collapse !important;
	border-radius: 0 !important;
	background: transparent !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart th,
body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart td {
	border: 0 !important;
	background: transparent !important;
	color: var(--ecc-cc-ink) !important;
	font-family: var(--ecc-cc-text) !important;
	font-size: 16px !important;
	line-height: 1.5 !important;
	text-align: left;
	vertical-align: middle !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart thead th {
	padding: 0 12px 12px !important;
	border-bottom: 1px solid var(--ecc-cc-line) !important;
	color: var(--ecc-cc-muted) !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	letter-spacing: 0.7px;
	text-transform: uppercase;
}

body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart tbody td {
	padding: 18px 12px !important;
	border-bottom: 1px solid var(--ecc-cc-line) !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart th:first-child,
body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart td:first-child {
	padding-left: 0 !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart th:last-child,
body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart td:last-child {
	padding-right: 0 !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart th.product-subtotal,
body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart td.product-subtotal {
	text-align: right !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart td.product-subtotal {
	font-weight: 600 !important;
	white-space: nowrap;
}

body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart td.product-price {
	color: var(--ecc-cc-muted) !important;
	white-space: nowrap;
}

body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart td.product-price del {
	margin-right: 6px;
	opacity: 0.7;
}

body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart td.product-price ins {
	color: var(--ecc-cc-ink);
	text-decoration: none;
}

/* Product picture */
body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart td.product-thumbnail {
	width: 88px;
}

body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart td.product-thumbnail img {
	display: block;
	width: 64px !important;
	max-width: none;
	height: 64px !important;
	border-radius: 10px;
	background: var(--ecc-cc-card);
	object-fit: cover;
}

/* Product name */
body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart td.product-name a {
	color: var(--ecc-cc-green) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart td.product-name a:hover {
	text-decoration: underline !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart td.product-name dl,
body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart td.product-name .backorder_notification {
	margin: 4px 0 0;
	color: var(--ecc-cc-muted);
	font-size: 14px;
}

/* Remove button */
body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart td.product-remove {
	width: 44px;
}

body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart td.product-remove a.remove {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px !important;
	height: 30px !important;
	border-radius: 50%;
	background: var(--ecc-cc-card) !important;
	color: var(--ecc-cc-muted) !important;
	font-family: var(--ecc-cc-text) !important;
	font-size: 20px !important;
	font-weight: 400 !important;
	line-height: 1 !important;
	text-decoration: none !important;
	transition: background-color 0.15s ease, color 0.15s ease;
}

body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart td.product-remove a.remove:hover {
	background: var(--ecc-cc-red-tint) !important;
	color: var(--ecc-cc-red) !important;
}

/* Quantity */
body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart .quantity .qty {
	width: 76px !important;
	height: 44px !important;
	min-height: 44px !important;
	max-height: none !important;
	padding: 0 8px !important;
	border: 1px solid var(--ecc-cc-field) !important;
	border-radius: 8px !important;
	background: #fff !important;
	color: var(--ecc-cc-ink) !important;
	font-family: var(--ecc-cc-text) !important;
	font-size: 16px !important;
	text-align: center;
}

body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart .quantity .qty:focus,
body.ecc-cc .elementor-widget-woocommerce-cart .coupon #coupon_code:focus {
	border-color: var(--ecc-cc-green) !important;
	outline: 0;
	box-shadow: 0 0 0 3px rgba(4, 108, 99, 0.14);
}

/* The row that holds the Update Cart button. */
body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart td.actions {
	padding: 18px 0 0 !important;
	border-bottom: 0 !important;
}

/* ------------------------------------------------------------------
 * Buttons on the cart
 * ---------------------------------------------------------------- */

body.ecc-cc .elementor-widget-woocommerce-cart .woocommerce .shop_table .button,
body.ecc-cc .elementor-widget-woocommerce-cart .woocommerce .coupon .button,
body.ecc-cc .elementor-widget-woocommerce-cart .woocommerce .cart_totals .shipping-calculator-form .button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 10px 24px !important;
	border: 1.5px solid var(--ecc-cc-green) !important;
	border-radius: 999px !important;
	background: transparent !important;
	color: var(--ecc-cc-green) !important;
	font-family: var(--ecc-cc-text) !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	line-height: 1.4 !important;
	text-transform: none !important;
	white-space: nowrap;
	transition: background-color 0.15s ease, color 0.15s ease;
}

body.ecc-cc .elementor-widget-woocommerce-cart .woocommerce .shop_table .button:hover,
body.ecc-cc .elementor-widget-woocommerce-cart .woocommerce .coupon .button:hover,
body.ecc-cc .elementor-widget-woocommerce-cart .woocommerce .cart_totals .shipping-calculator-form .button:hover {
	background: var(--ecc-cc-green) !important;
	color: #fff !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart .woocommerce .wc-proceed-to-checkout .checkout-button,
body.ecc-cc .elementor-widget-woocommerce-cart .woocommerce .return-to-shop .button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 54px;
	margin: 0 !important;
	padding: 14px 30px !important;
	border: 0 !important;
	border-radius: 999px !important;
	background: var(--ecc-cc-green) !important;
	color: #fff !important;
	font-family: var(--ecc-cc-text) !important;
	font-size: 16px !important;
	font-weight: 600 !important;
	line-height: 1.4 !important;
	text-transform: none !important;
	transition: background-color 0.15s ease;
}

body.ecc-cc .elementor-widget-woocommerce-cart .woocommerce .wc-proceed-to-checkout .checkout-button {
	display: flex;
	width: 100%;
}

body.ecc-cc .elementor-widget-woocommerce-cart .woocommerce .wc-proceed-to-checkout .checkout-button:hover,
body.ecc-cc .elementor-widget-woocommerce-cart .woocommerce .return-to-shop .button:hover {
	background: var(--ecc-cc-green-dark) !important;
	color: #fff !important;
}

/* ------------------------------------------------------------------
 * Cart: coupon
 * ---------------------------------------------------------------- */

body.ecc-cc .elementor-widget-woocommerce-cart .coupon.e-cart-section {
	margin-top: 28px !important;
	padding: 16px !important;
	border-radius: var(--ecc-cc-radius) !important;
	background: var(--ecc-cc-card) !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart .coupon .coupon-col {
	display: flex;
	align-items: stretch;
	gap: 10px;
	margin: 0 !important;
	padding: 0 !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart .coupon .coupon-col-start {
	flex: 1 1 auto;
	min-width: 0;
	padding: 0 !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart .coupon .coupon-col-end {
	flex: 0 0 auto;
	width: auto !important;
	padding: 0 !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart .coupon #coupon_code {
	width: 100% !important;
	height: 48px !important;
	padding: 0 16px !important;
	border: 1px solid var(--ecc-cc-field) !important;
	border-radius: 999px !important;
	background: #fff !important;
	color: var(--ecc-cc-ink) !important;
	font-family: var(--ecc-cc-text) !important;
	font-size: 16px !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart .coupon .button {
	width: auto !important;
	background: #fff !important;
}

/* ------------------------------------------------------------------
 * Cart: totals card
 * ---------------------------------------------------------------- */

body.ecc-cc .elementor-widget-woocommerce-cart .e-cart-totals.e-cart-section {
	padding: 28px !important;
	border-radius: var(--ecc-cc-radius) !important;
	background: var(--ecc-cc-card) !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals h2 {
	margin: 0 0 12px !important;
	color: var(--ecc-cc-ink) !important;
	font-family: var(--ecc-cc-head) !important;
	font-size: 22px !important;
	font-weight: 600 !important;
	line-height: 1.3 !important;
	letter-spacing: -0.2px;
	text-transform: none !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals table.shop_table {
	width: 100%;
	margin: 0 0 22px !important;
	padding: 0 !important;
	border: 0 !important;
	border-collapse: collapse !important;
	background: transparent !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals table.shop_table th,
body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals table.shop_table td {
	padding: 14px 0 !important;
	border: 0 !important;
	border-bottom: 1px solid var(--ecc-cc-line) !important;
	background: transparent !important;
	color: var(--ecc-cc-ink) !important;
	font-family: var(--ecc-cc-text) !important;
	font-size: 16px !important;
	font-weight: 400 !important;
	line-height: 1.5 !important;
	vertical-align: top !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals table.shop_table th {
	width: 38%;
	padding-right: 16px !important;
	color: var(--ecc-cc-muted) !important;
	text-align: left !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals table.shop_table td {
	text-align: right !important;
}

/* The widget hides the row headings and prints each label before its value. */
body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals table.shop_table td::before {
	float: left;
	color: var(--ecc-cc-muted) !important;
	font-family: var(--ecc-cc-text) !important;
	font-size: 16px !important;
	font-weight: 400 !important;
	letter-spacing: 0;
	text-align: left;
}

body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals table.shop_table tr.woocommerce-shipping-totals td {
	text-align: left !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals table.shop_table tr.woocommerce-shipping-totals td::before {
	float: none;
	display: block;
	width: 100%;
	margin: 0 0 6px !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals tr.cart-subtotal td {
	font-weight: 600 !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals tr.cart-discount td {
	color: var(--ecc-cc-green) !important;
	font-weight: 600 !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals a {
	color: var(--ecc-cc-green) !important;
	font-weight: 600;
	text-decoration: none;
}

body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals a.woocommerce-remove-coupon {
	display: block;
	font-size: 13px;
	font-weight: 500;
}

/* Delivery */
body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals ul#shipping_method {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none;
}

body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals ul#shipping_method li {
	margin: 0 0 4px !important;
	padding: 0 !important;
	text-indent: 0 !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals ul#shipping_method label {
	color: var(--ecc-cc-ink) !important;
	font-family: var(--ecc-cc-text) !important;
	font-size: 16px !important;
	font-weight: 400 !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals ul#shipping_method .amount {
	font-weight: 600 !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals ul#shipping_method input[type="radio"] {
	margin: 0 6px 0 0;
	accent-color: var(--ecc-cc-green);
}

body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals .woocommerce-shipping-destination,
body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals .woocommerce-shipping-destination strong {
	margin: 4px 0 0 !important;
	color: var(--ecc-cc-muted) !important;
	font-family: var(--ecc-cc-text) !important;
	font-size: 14px !important;
	font-weight: 400 !important;
	line-height: 1.45 !important;
}

/* Total */
body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals tr.order-total th,
body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals tr.order-total td {
	padding-top: 18px !important;
	border-bottom: 0 !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals table.shop_table tr.order-total td::before {
	padding-top: 4px;
	color: var(--ecc-cc-ink) !important;
	font-family: var(--ecc-cc-head) !important;
	font-size: 18px !important;
	font-weight: 600 !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals tr.order-total td strong,
body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals tr.order-total td strong .amount {
	color: var(--ecc-cc-ink) !important;
	font-family: var(--ecc-cc-head) !important;
	font-size: 24px !important;
	font-weight: 600 !important;
	line-height: 1.2 !important;
	letter-spacing: -0.3px;
}

body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals tr.order-total small.includes_tax,
body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals tr.order-total small.includes_tax .amount {
	display: block;
	margin-top: 2px;
	color: var(--ecc-cc-muted) !important;
	font-family: var(--ecc-cc-text) !important;
	font-size: 13px !important;
	font-weight: 400 !important;
}

body.ecc-cc .elementor-widget-woocommerce-cart .cart_totals tr.order-total small.includes_tax .amount {
	display: inline;
	margin: 0;
}

body.ecc-cc .elementor-widget-woocommerce-cart .wc-proceed-to-checkout {
	margin: 0 !important;
	padding: 0 !important;
}

/* ------------------------------------------------------------------
 * Cart: empty
 * ---------------------------------------------------------------- */

body.ecc-cc .elementor-widget-woocommerce-cart .woocommerce:has(> .wc-empty-cart-message) {
	padding: 56px 24px;
	border-radius: var(--ecc-cc-radius);
	background: var(--ecc-cc-card);
	text-align: center;
}

body.ecc-cc .elementor-widget-woocommerce-cart .wc-empty-cart-message .cart-empty.woocommerce-info {
	display: block;
	margin: 0 0 22px !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	color: var(--ecc-cc-ink) !important;
	font-family: var(--ecc-cc-head) !important;
	font-size: 22px !important;
	font-weight: 600 !important;
	line-height: 1.3 !important;
	letter-spacing: -0.2px;
	text-align: center;
}

body.ecc-cc .elementor-widget-woocommerce-cart .wc-empty-cart-message .cart-empty.woocommerce-info::before {
	content: "" !important;
	display: block !important;
	position: static !important;
	width: 56px;
	height: 56px;
	margin: 0 auto 18px;
	border-radius: 50%;
	background: #fff var(--ecc-cc-icon-cart) center / 26px 26px no-repeat;
	opacity: 0.85;
}

body.ecc-cc .elementor-widget-woocommerce-cart .return-to-shop {
	margin: 0 !important;
}

/* ------------------------------------------------------------------
 * Cart on phones: each part becomes its own card
 * ---------------------------------------------------------------- */

@media (max-width: 768px) {
	body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart,
	body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart tbody {
		display: block;
	}

	body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart thead {
		display: none;
	}

	body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item {
		display: grid !important;
		grid-template-columns: 64px minmax(0, 1fr) auto;
		grid-template-areas:
			"thumb name remove"
			"thumb price price"
			"qty qty subtotal";
		column-gap: 14px;
		row-gap: 2px;
		margin: 0 0 12px !important;
		padding: 16px !important;
		border: 0 !important;
		border-radius: var(--ecc-cc-radius);
		background: var(--ecc-cc-card) !important;
	}

	body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td {
		display: block !important;
		width: auto !important;
		padding: 0 !important;
		border: 0 !important;
		background: transparent !important;
		text-align: left !important;
	}

	body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td::before {
		display: none !important;
	}

	body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td.product-thumbnail {
		grid-area: thumb;
	}

	body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td.product-thumbnail img {
		background: #fff;
	}

	body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td.product-name {
		grid-area: name;
		align-self: end;
	}

	body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td.product-price {
		grid-area: price;
		align-self: start;
		font-size: 15px !important;
	}

	body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td.product-remove {
		grid-area: remove;
	}

	body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td.product-remove a.remove {
		background: #fff !important;
	}

	body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td.product-quantity {
		grid-area: qty;
		margin-top: 14px;
	}

	body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart tr.cart_item td.product-subtotal {
		grid-area: subtotal;
		align-self: center;
		margin-top: 14px;
		font-size: 18px !important;
		text-align: right !important;
	}

	/* Stays hidden while the cart updates itself, as set in the Elementor widget. */
	body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart tr:has(> td.actions) {
		display: var(--update-cart-automatically-display, block) !important;
		padding: 0 !important;
	}

	body.ecc-cc .elementor-widget-woocommerce-cart table.shop_table.cart td.actions {
		display: block;
		padding: 4px 0 0 !important;
	}

	body.ecc-cc .elementor-widget-woocommerce-cart .coupon.e-cart-section {
		margin-top: 12px !important;
	}

	body.ecc-cc .elementor-widget-woocommerce-cart .coupon .coupon-col {
		flex-wrap: wrap;
	}

	body.ecc-cc .elementor-widget-woocommerce-cart .coupon .coupon-col-start {
		flex: 1 1 180px;
	}

	body.ecc-cc .elementor-widget-woocommerce-cart .coupon .coupon-col-end {
		flex: 1 1 auto;
	}

	body.ecc-cc .elementor-widget-woocommerce-cart .coupon .button {
		width: 100% !important;
	}

	body.ecc-cc .elementor-widget-woocommerce-cart .e-cart-totals.e-cart-section {
		padding: 22px !important;
	}

	body.ecc-cc [data-elementor-type="wp-page"] .elementor-widget-heading h1.elementor-heading-title,
	body.ecc-cc main .page-header h1.entry-title {
		font-size: 28px !important;
	}

	body.ecc-cc:not([class*="elementor-page-"]) main.site-main {
		padding-right: 20px;
		padding-left: 20px;
	}

	body.ecc-cc main .page-header {
		margin-bottom: 20px;
		padding-top: 28px;
	}
}

/* ------------------------------------------------------------------
 * Checkout: base
 * ---------------------------------------------------------------- */

body.ecc-cc .wc-block-checkout,
body.ecc-cc .wp-block-woocommerce-checkout {
	--wc-separator-color: var(--ecc-cc-line);
	color: var(--ecc-cc-ink);
	font-family: var(--ecc-cc-text);
	font-size: 16px;
	line-height: 1.55;
}

body.ecc-cc .wc-block-checkout a {
	color: var(--ecc-cc-green);
	font-weight: 600;
	text-decoration: none;
}

body.ecc-cc .wc-block-checkout a:hover {
	text-decoration: underline;
}

/* Section headings */
body.ecc-cc .wc-block-checkout .wc-block-components-checkout-step {
	margin-bottom: 36px;
}

body.ecc-cc .wc-block-checkout .wc-block-components-checkout-step__heading {
	align-items: baseline;
	margin: 0 0 14px;
}

body.ecc-cc .wc-block-checkout .wc-block-components-checkout-step__title,
body.ecc-cc .wc-block-checkout .wc-block-components-title {
	margin: 0;
	color: var(--ecc-cc-ink) !important;
	font-family: var(--ecc-cc-head) !important;
	font-size: 22px !important;
	font-weight: 600 !important;
	line-height: 1.3 !important;
	letter-spacing: -0.2px !important;
	text-transform: none !important;
}

body.ecc-cc .wc-block-checkout .wc-block-components-checkout-step__heading-content,
body.ecc-cc .wc-block-checkout .wc-block-components-checkout-step__description {
	color: var(--ecc-cc-muted);
	font-size: 15px;
}

body.ecc-cc .wc-block-checkout .wc-block-checkout__guest-checkout-notice {
	margin: 10px 0 0;
	color: var(--ecc-cc-muted);
	font-size: 14px;
}

/* ------------------------------------------------------------------
 * Checkout: fields
 * ---------------------------------------------------------------- */

body.ecc-cc .wc-block-checkout .wc-block-components-text-input input[type="text"],
body.ecc-cc .wc-block-checkout .wc-block-components-text-input input[type="email"],
body.ecc-cc .wc-block-checkout .wc-block-components-text-input input[type="tel"],
body.ecc-cc .wc-block-checkout .wc-block-components-text-input input[type="number"],
body.ecc-cc .wc-block-checkout .wc-block-components-text-input input[type="password"],
body.ecc-cc .wc-block-checkout .wc-block-components-text-input input[type="url"],
body.ecc-cc .wc-block-checkout .wc-blocks-components-select .wc-blocks-components-select__select,
body.ecc-cc .wc-block-checkout .wc-block-components-textarea {
	border: 1px solid var(--ecc-cc-field) !important;
	border-radius: 10px !important;
	background-color: #fff !important;
	color: var(--ecc-cc-ink) !important;
	font-family: var(--ecc-cc-text) !important;
	font-size: 16px !important;
	box-shadow: none !important;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

body.ecc-cc .wc-block-checkout .wc-blocks-components-select .wc-blocks-components-select__container {
	border-radius: 10px !important;
	background: #fff !important;
}

body.ecc-cc .wc-block-checkout .wc-block-components-text-input input:focus,
body.ecc-cc .wc-block-checkout .wc-blocks-components-select .wc-blocks-components-select__select:focus,
body.ecc-cc .wc-block-checkout .wc-block-components-textarea:focus {
	border-color: var(--ecc-cc-green) !important;
	outline: 0 !important;
	box-shadow: 0 0 0 3px rgba(4, 108, 99, 0.14) !important;
}

body.ecc-cc .wc-block-checkout .wc-block-components-text-input label,
body.ecc-cc .wc-block-checkout .wc-blocks-components-select .wc-blocks-components-select__label {
	color: var(--ecc-cc-muted) !important;
	font-family: var(--ecc-cc-text) !important;
}

body.ecc-cc .wc-block-checkout .wc-block-components-textarea {
	padding: 14px 16px;
	line-height: 1.5;
}

/* A field with a mistake in it */
body.ecc-cc .wc-block-checkout .wc-block-components-text-input.has-error input,
body.ecc-cc .wc-block-checkout .wc-blocks-components-select.has-error .wc-blocks-components-select__select {
	border-color: var(--ecc-cc-red) !important;
}

body.ecc-cc .wc-block-checkout .wc-block-components-text-input.has-error label,
body.ecc-cc .wc-block-checkout .wc-block-components-validation-error {
	color: var(--ecc-cc-red) !important;
}

body.ecc-cc .wc-block-checkout .wc-block-components-validation-error {
	font-size: 14px;
}

body.ecc-cc .wc-block-checkout .wc-block-components-address-form__address_2-toggle {
	color: var(--ecc-cc-green);
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
}

/* Tick boxes */
body.ecc-cc .wc-block-checkout .wc-block-components-checkbox label {
	align-items: flex-start;
	color: var(--ecc-cc-ink);
	font-family: var(--ecc-cc-text);
	font-size: 15px;
	line-height: 1.5;
}

body.ecc-cc .wc-block-checkout .wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"] {
	border: 1px solid var(--ecc-cc-field) !important;
	border-radius: 6px !important;
	background-color: #fff !important;
}

body.ecc-cc .wc-block-checkout .wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"]:checked {
	border-color: var(--ecc-cc-green) !important;
	background-color: var(--ecc-cc-green) !important;
}

body.ecc-cc .wc-block-checkout .wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"]:focus {
	outline: 0 !important;
	box-shadow: 0 0 0 3px rgba(4, 108, 99, 0.18) !important;
}

body.ecc-cc .wc-block-checkout .wc-block-components-checkbox .wc-block-components-checkbox__mark {
	fill: #fff !important;
}

/* Saved address shown to a signed in customer */
body.ecc-cc .wc-block-checkout .wc-block-components-address-card {
	padding: 18px 20px;
	border: 0 !important;
	border-radius: 12px;
	background: var(--ecc-cc-card);
	color: var(--ecc-cc-ink);
	font-size: 16px;
}

body.ecc-cc .wc-block-checkout .wc-block-components-address-card address {
	font-style: normal;
	line-height: 1.5;
}

body.ecc-cc .wc-block-checkout .wc-block-components-address-card__address-section--primary {
	font-weight: 600;
}

body.ecc-cc .wc-block-checkout .wc-block-components-address-card__address-section--secondary {
	color: var(--ecc-cc-muted);
}

body.ecc-cc .wc-block-checkout .wc-block-components-address-card__edit {
	color: var(--ecc-cc-green) !important;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none !important;
	cursor: pointer;
}

body.ecc-cc .wc-block-checkout .wc-block-components-address-card__edit:hover {
	text-decoration: underline !important;
}

/* ------------------------------------------------------------------
 * Checkout: delivery and payment choices
 * ---------------------------------------------------------------- */

body.ecc-cc .wc-block-checkout .wc-block-components-radio-control--highlight-checked::after {
	border-color: var(--ecc-cc-field);
	border-radius: 12px;
}

body.ecc-cc .wc-block-checkout .wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control-accordion-option--checked-option-highlighted,
body.ecc-cc .wc-block-checkout .wc-block-components-radio-control--highlight-checked label.wc-block-components-radio-control__option--checked-option-highlighted {
	position: relative;
	z-index: 1;
	border-radius: 12px;
	background: var(--ecc-cc-card);
	box-shadow: inset 0 0 0 1.5px var(--ecc-cc-green);
}

body.ecc-cc .wc-block-checkout .wc-block-checkout__payment-method .wc-block-components-radio-control-accordion-option:first-child::after {
	border-top-left-radius: 12px;
	border-top-right-radius: 12px;
}

body.ecc-cc .wc-block-checkout .wc-block-checkout__payment-method .wc-block-components-radio-control-accordion-option:last-child::after {
	border-bottom-right-radius: 12px;
	border-bottom-left-radius: 12px;
}

body.ecc-cc .wc-block-checkout .wc-block-components-radio-control__label,
body.ecc-cc .wc-block-checkout .wc-block-components-radio-control__secondary-label {
	color: var(--ecc-cc-ink);
	font-family: var(--ecc-cc-text);
	font-size: 16px;
	font-weight: 600;
}

body.ecc-cc .wc-block-checkout .wc-block-components-radio-control__description,
body.ecc-cc .wc-block-checkout .wc-block-components-radio-control__secondary-description,
body.ecc-cc .wc-block-checkout .wc-block-components-radio-control-accordion-content {
	color: var(--ecc-cc-muted);
	font-family: var(--ecc-cc-text);
	font-size: 15px;
	line-height: 1.5;
}

body.ecc-cc .wc-block-checkout .wc-block-components-radio-control .wc-block-components-radio-control__input {
	border-color: var(--ecc-cc-field);
}

body.ecc-cc .wc-block-checkout .wc-block-components-radio-control .wc-block-components-radio-control__input:checked {
	border-color: var(--ecc-cc-green);
}

body.ecc-cc .wc-block-checkout .wc-block-components-radio-control .wc-block-components-radio-control__input:checked::before {
	background: var(--ecc-cc-green);
}

body.ecc-cc .wc-block-checkout .wc-block-components-radio-control .wc-block-components-radio-control__input:focus {
	outline: 0;
	box-shadow: 0 0 0 3px rgba(4, 108, 99, 0.18);
}

/* Apple Pay, Google Pay and similar buttons above the form */
body.ecc-cc .wc-block-checkout .wc-block-components-express-payment .wc-block-components-express-payment__content {
	border-color: var(--ecc-cc-field);
	border-radius: 12px;
}

body.ecc-cc .wc-block-checkout .wc-block-components-express-payment .wc-block-components-express-payment__title-container::before,
body.ecc-cc .wc-block-checkout .wc-block-components-express-payment .wc-block-components-express-payment__title-container::after {
	border-color: var(--ecc-cc-field);
}

body.ecc-cc .wc-block-checkout .wc-block-components-express-payment .wc-block-components-express-payment__title-container::before {
	border-top-left-radius: 12px;
}

body.ecc-cc .wc-block-checkout .wc-block-components-express-payment .wc-block-components-express-payment__title-container::after {
	border-top-right-radius: 12px;
}

body.ecc-cc .wc-block-checkout .wc-block-components-express-payment .wc-block-components-express-payment__title {
	font-size: 15px !important;
	font-weight: 600 !important;
	letter-spacing: 0 !important;
}

body.ecc-cc .wc-block-checkout .wc-block-components-express-payment-continue-rule {
	color: var(--ecc-cc-muted);
	font-size: 14px;
}

/* ------------------------------------------------------------------
 * Checkout: terms and the Place Order button
 * ---------------------------------------------------------------- */

body.ecc-cc .wc-block-checkout .wc-block-checkout__terms {
	color: var(--ecc-cc-muted);
	font-size: 14px;
	line-height: 1.5;
}

body.ecc-cc .wc-block-checkout .wc-block-checkout__terms .wc-block-components-checkbox__label {
	color: var(--ecc-cc-muted);
	font-size: 14px;
}

body.ecc-cc .wc-block-checkout .wc-block-checkout__terms.wc-block-checkout__terms--with-separator {
	border-top-color: var(--ecc-cc-line);
}

body.ecc-cc.woocommerce-checkout .wc-block-checkout .wc-block-checkout__actions_row .wc-block-components-checkout-place-order-button {
	min-height: 56px;
	padding: 14px 30px;
	border: 0;
	border-radius: 999px;
	background-color: var(--ecc-cc-green);
	color: #fff;
	font-family: var(--ecc-cc-text);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.4;
	box-shadow: none;
	transition: background-color 0.15s ease;
}

body.ecc-cc.woocommerce-checkout .wc-block-checkout .wc-block-checkout__actions_row .wc-block-components-checkout-place-order-button:hover,
body.ecc-cc.woocommerce-checkout .wc-block-checkout .wc-block-checkout__actions_row .wc-block-components-checkout-place-order-button:focus {
	background-color: var(--ecc-cc-green-dark);
	color: #fff;
}

body.ecc-cc .wc-block-checkout .wc-block-components-checkout-return-to-cart-button {
	color: var(--ecc-cc-green);
	font-weight: 600;
}

/* ------------------------------------------------------------------
 * Checkout: order summary card
 * ---------------------------------------------------------------- */

body.ecc-cc .wc-block-checkout .wp-block-woocommerce-checkout-order-summary-block {
	padding: 12px;
	border: 0 !important;
	border-radius: var(--ecc-cc-radius) !important;
	background: var(--ecc-cc-card);
}

body.ecc-cc .wc-block-checkout .wc-block-components-checkout-order-summary__title {
	margin-top: 8px;
	padding-right: 16px;
	padding-left: 16px;
	border-top: 0;
	border-bottom: 0;
}

/* On phones the summary sits in its own box above the Place Order button. */
body.ecc-cc .wc-block-checkout .wp-block-woocommerce-checkout-order-summary-block .checkout-order-summary-block-fill {
	border: 0;
	border-radius: 0;
}

body.ecc-cc .wc-block-checkout .wp-block-woocommerce-checkout-order-summary-block.checkout-order-summary-block-fill-wrapper {
	margin-bottom: 24px;
	padding-bottom: 12px;
}

body.ecc-cc .wc-block-checkout .wp-block-woocommerce-checkout-order-summary-block.checkout-order-summary-block-fill-wrapper .wc-block-components-title {
	margin: 8px 16px 8px;
}

body.ecc-cc .wc-block-checkout .wc-block-components-checkout-order-summary__content.is-open {
	border-bottom: 0;
}

/* Tablets: a little more room for the summary so part names do not split.
   WooCommerce switches to one column when the checkout is under 700px wide. */
@container (min-width: 700px) and (max-width: 1040px) {
	body.ecc-cc .wc-block-checkout .wc-block-components-sidebar-layout .wc-block-components-main {
		width: 56%;
		padding-right: 3%;
	}

	body.ecc-cc .wc-block-checkout .wc-block-components-sidebar-layout .wc-block-components-sidebar {
		width: 44%;
		padding-left: 0;
	}
}

body.ecc-cc .wc-block-checkout .wc-block-components-order-summary .wc-block-components-order-summary-item__description {
	padding-left: 18px;
	word-break: normal;
	overflow-wrap: break-word;
}

body.ecc-cc .wc-block-checkout .wc-block-components-checkout-order-summary__title-text {
	margin: 0;
	color: var(--ecc-cc-ink);
	font-family: var(--ecc-cc-head);
	font-size: 22px !important;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: -0.2px;
}

body.ecc-cc .wc-block-checkout .wc-block-components-totals-wrapper {
	border-top-color: var(--ecc-cc-line);
}

body.ecc-cc .wc-block-checkout .wc-block-components-order-summary-item__image > img {
	border: 1px solid var(--ecc-cc-line);
	border-radius: 10px;
	background: #fff;
}

body.ecc-cc .wc-block-checkout .wc-block-components-order-summary-item__quantity {
	border: 2px solid var(--ecc-cc-card) !important;
	background: var(--ecc-cc-green) !important;
	color: #fff !important;
	font-family: var(--ecc-cc-text);
	font-weight: 600;
	box-shadow: none !important;
}

body.ecc-cc .wc-block-checkout .wc-block-components-order-summary-item .wc-block-components-product-name {
	margin: 0;
	color: var(--ecc-cc-ink) !important;
	font-family: var(--ecc-cc-text) !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	line-height: 1.4 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
}

body.ecc-cc .wc-block-checkout .wc-block-components-order-summary-item__individual-prices,
body.ecc-cc .wc-block-checkout .wc-block-components-order-summary-item .wc-block-components-product-metadata {
	color: var(--ecc-cc-muted);
	font-size: 14px;
}

body.ecc-cc .wc-block-checkout .wc-block-components-order-summary-item__total-price {
	color: var(--ecc-cc-ink);
	font-size: 15px;
	font-weight: 600;
}

body.ecc-cc .wc-block-checkout .wc-block-components-sale-badge,
body.ecc-cc .wc-block-checkout .wc-block-components-product-badge {
	border: 0;
	border-radius: 999px;
	background: var(--ecc-cc-green-tint);
	color: var(--ecc-cc-green);
	font-family: var(--ecc-cc-text);
	font-size: 12px;
	font-weight: 600;
	text-transform: none;
}

body.ecc-cc .wc-block-checkout .wc-block-components-totals-item {
	color: var(--ecc-cc-ink);
	font-family: var(--ecc-cc-text);
	font-size: 16px;
}

body.ecc-cc .wc-block-checkout .wc-block-components-totals-item__label {
	color: var(--ecc-cc-muted);
}

body.ecc-cc .wc-block-checkout .wc-block-components-totals-item__value {
	font-weight: 600;
}

body.ecc-cc .wc-block-checkout .wc-block-components-totals-item__description {
	color: var(--ecc-cc-muted);
	font-size: 13px;
}

body.ecc-cc .wc-block-checkout .wc-block-components-totals-discount .wc-block-components-totals-item__value {
	color: var(--ecc-cc-green);
}

body.ecc-cc .wc-block-checkout .wc-block-components-chip {
	border: 0;
	border-radius: 999px;
	background: #fff;
	color: var(--ecc-cc-ink);
	font-size: 13px;
}

body.ecc-cc .wc-block-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
	color: var(--ecc-cc-ink);
	font-family: var(--ecc-cc-head);
	font-size: 18px;
	font-weight: 600;
}

body.ecc-cc .wc-block-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
	color: var(--ecc-cc-ink);
	font-family: var(--ecc-cc-head);
	font-size: 24px;
	font-weight: 600;
	letter-spacing: -0.3px;
}

body.ecc-cc .wc-block-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-footer-item-tax {
	color: var(--ecc-cc-muted);
	font-family: var(--ecc-cc-text);
	font-size: 13px;
}

/* Coupon */
body.ecc-cc .wc-block-checkout .wc-block-components-totals-coupon .wc-block-components-panel__button {
	color: var(--ecc-cc-green);
	font-family: var(--ecc-cc-text);
	font-size: 15px;
	font-weight: 600;
}

body.ecc-cc.woocommerce-checkout .wc-block-checkout .wc-block-components-totals-coupon__button {
	min-height: 48px;
	padding: 10px 22px;
	border: 1.5px solid var(--ecc-cc-green);
	border-radius: 999px;
	background-color: #fff;
	color: var(--ecc-cc-green);
	fill: var(--ecc-cc-green);
	font-family: var(--ecc-cc-text);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.4;
	transition: background-color 0.15s ease, color 0.15s ease;
}

body.ecc-cc.woocommerce-checkout .wc-block-checkout .wc-block-components-totals-coupon__button:hover:not(:disabled) {
	background-color: var(--ecc-cc-green);
	color: #fff;
}

/* ------------------------------------------------------------------
 * Checkout: messages
 * ---------------------------------------------------------------- */

body.ecc-cc .wc-block-components-notice-banner {
	padding: 14px 18px !important;
	border: 0 !important;
	border-left: 3px solid var(--ecc-cc-green) !important;
	border-radius: 12px !important;
	background: var(--ecc-cc-card) !important;
	color: var(--ecc-cc-ink) !important;
	font-family: var(--ecc-cc-text) !important;
	font-size: 15px !important;
	line-height: 1.5;
}

body.ecc-cc .wc-block-components-notice-banner.is-error {
	border-left-color: var(--ecc-cc-red) !important;
	background: var(--ecc-cc-red-tint) !important;
}

body.ecc-cc .wc-block-components-notice-banner.is-error > svg {
	background-color: var(--ecc-cc-red);
}

body.ecc-cc .wc-block-components-notice-banner.is-success > svg,
body.ecc-cc .wc-block-components-notice-banner.is-info > svg {
	background-color: var(--ecc-cc-green);
}

/* ------------------------------------------------------------------
 * Order received
 * ---------------------------------------------------------------- */

body.ecc-cc .woocommerce-order {
	color: var(--ecc-cc-ink);
	font-family: var(--ecc-cc-text);
	font-size: 16px;
	line-height: 1.55;
}

/* Thank you message */
body.ecc-cc .woocommerce-order .woocommerce-thankyou-order-received,
body.ecc-cc .woocommerce-order .woocommerce-thankyou-order-failed {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 0 0 20px !important;
	padding: 18px 22px !important;
	border: 0 !important;
	border-radius: var(--ecc-cc-radius) !important;
	background: var(--ecc-cc-green-tint) !important;
	color: var(--ecc-cc-ink) !important;
	font-family: var(--ecc-cc-head) !important;
	font-size: 18px !important;
	font-weight: 600 !important;
	line-height: 1.4 !important;
}

body.ecc-cc .woocommerce-order .woocommerce-thankyou-order-received::before {
	content: "" !important;
	display: block !important;
	position: static !important;
	flex: 0 0 34px;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--ecc-cc-green);
	-webkit-mask: none;
	mask: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22white%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22m6.5 12.5 3.6 3.6 7.4-7.8%22/%3E%3C/svg%3E");
	background-position: center;
	background-size: 22px 22px;
	background-repeat: no-repeat;
}

body.ecc-cc .woocommerce-order .woocommerce-thankyou-order-failed {
	background: var(--ecc-cc-red-tint) !important;
}

/* Order number, date, total and so on */
body.ecc-cc .woocommerce-order ul.woocommerce-order-overview {
	display: flex;
	flex-wrap: wrap;
	gap: 18px 44px;
	margin: 0 0 40px !important;
	padding: 22px 24px !important;
	border: 0 !important;
	border-radius: var(--ecc-cc-radius);
	background: var(--ecc-cc-card);
	list-style: none;
}

body.ecc-cc .woocommerce-order ul.woocommerce-order-overview::before,
body.ecc-cc .woocommerce-order ul.woocommerce-order-overview::after {
	content: none !important;
}

body.ecc-cc .woocommerce-order ul.woocommerce-order-overview li {
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	color: var(--ecc-cc-muted) !important;
	font-family: var(--ecc-cc-text) !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	letter-spacing: 0.7px;
	line-height: 1.4 !important;
	text-transform: uppercase;
}

body.ecc-cc .woocommerce-order ul.woocommerce-order-overview li strong {
	display: block;
	margin-top: 4px;
	color: var(--ecc-cc-ink) !important;
	font-family: var(--ecc-cc-text) !important;
	font-size: 16px !important;
	font-weight: 600 !important;
	letter-spacing: 0;
	line-height: 1.4 !important;
	text-transform: none;
	overflow-wrap: anywhere;
}

/* Text some payment methods add, for example bank details */
body.ecc-cc .woocommerce-order > p:not(.woocommerce-notice),
body.ecc-cc .woocommerce-order .woocommerce-bacs-bank-details {
	margin: 0 0 28px;
	color: var(--ecc-cc-ink);
	font-size: 16px;
}

body.ecc-cc .woocommerce-order ul.wc-bacs-bank-details {
	display: flex;
	flex-wrap: wrap;
	gap: 14px 40px;
	margin: 0 0 28px !important;
	padding: 18px 24px !important;
	border-radius: var(--ecc-cc-radius);
	background: var(--ecc-cc-card);
	list-style: none;
}

body.ecc-cc .woocommerce-order ul.wc-bacs-bank-details li {
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	color: var(--ecc-cc-muted);
	font-size: 13px;
}

body.ecc-cc .woocommerce-order ul.wc-bacs-bank-details li strong {
	display: block;
	color: var(--ecc-cc-ink);
	font-size: 16px;
}

/* Headings */
body.ecc-cc .woocommerce-order h2,
body.ecc-cc .woocommerce-order h3 {
	margin: 0 0 14px !important;
	color: var(--ecc-cc-ink) !important;
	font-family: var(--ecc-cc-head) !important;
	font-size: 22px !important;
	font-weight: 600 !important;
	line-height: 1.3 !important;
	letter-spacing: -0.2px !important;
	text-transform: none !important;
}

/* Order details table */
body.ecc-cc .woocommerce-order .woocommerce-order-details {
	margin: 0 0 40px !important;
	padding: 0 !important;
	border: 0 !important;
}

body.ecc-cc .woocommerce-order table.shop_table {
	width: 100%;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	border-collapse: separate !important;
	border-spacing: 0 !important;
	background: transparent !important;
}

body.ecc-cc .woocommerce-order table.shop_table th,
body.ecc-cc .woocommerce-order table.shop_table td {
	padding: 16px !important;
	border: 0 !important;
	border-bottom: 1px solid var(--ecc-cc-line) !important;
	background: transparent !important;
	color: var(--ecc-cc-ink) !important;
	font-family: var(--ecc-cc-text) !important;
	font-size: 16px !important;
	font-weight: 400 !important;
	line-height: 1.5 !important;
	text-align: left;
	vertical-align: middle;
}

body.ecc-cc .woocommerce-order table.shop_table thead th {
	padding-top: 0 !important;
	padding-bottom: 12px !important;
	color: var(--ecc-cc-muted) !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	letter-spacing: 0.7px;
	text-transform: uppercase;
}

body.ecc-cc .woocommerce-order table.shop_table tr > :first-child {
	padding-left: 0 !important;
}

body.ecc-cc .woocommerce-order table.shop_table tr > :last-child {
	padding-right: 0 !important;
	text-align: right;
}

body.ecc-cc .woocommerce-order table.shop_table td.product-name a {
	color: var(--ecc-cc-green) !important;
	font-weight: 600;
	text-decoration: none !important;
}

body.ecc-cc .woocommerce-order table.shop_table td.product-name a:hover {
	text-decoration: underline !important;
}

body.ecc-cc .woocommerce-order table.shop_table td.product-name .product-quantity {
	color: var(--ecc-cc-muted);
	font-weight: 400;
}

body.ecc-cc .woocommerce-order table.shop_table tfoot th {
	color: var(--ecc-cc-muted) !important;
}

body.ecc-cc .woocommerce-order table.shop_table tfoot tr:last-child > * {
	border-bottom: 0 !important;
}

/* The order total stands out. WooCommerce does not always list it last. */
body.ecc-cc .woocommerce-order table.shop_table tfoot tr:has(small.includes_tax) > *,
body.ecc-cc .woocommerce-order table.shop_table tfoot:not(:has(small.includes_tax)) tr:last-child > * {
	color: var(--ecc-cc-ink) !important;
	font-weight: 600 !important;
}

body.ecc-cc .woocommerce-order table.shop_table small {
	color: var(--ecc-cc-muted);
	font-size: 13px;
	font-weight: 400;
}

body.ecc-cc .woocommerce-order .order-again .button,
body.ecc-cc .woocommerce-order .woocommerce-order-details .button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-top: 20px;
	padding: 12px 26px !important;
	border: 1.5px solid var(--ecc-cc-green) !important;
	border-radius: 999px !important;
	background: var(--ecc-cc-green) !important;
	color: #fff !important;
	font-family: var(--ecc-cc-text) !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	line-height: 1.4 !important;
	text-decoration: none !important;
}

body.ecc-cc .woocommerce-order .order-again .button:hover,
body.ecc-cc .woocommerce-order .woocommerce-order-details .button:hover {
	border-color: var(--ecc-cc-green-dark) !important;
	background: var(--ecc-cc-green-dark) !important;
}

/* Billing and delivery address cards */
body.ecc-cc .woocommerce-order .woocommerce-customer-details {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
}

body.ecc-cc .woocommerce-order .woocommerce-customer-details .woocommerce-columns--addresses {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
	width: 100%;
	margin: 0 !important;
}

body.ecc-cc .woocommerce-order .woocommerce-customer-details .woocommerce-columns--addresses::before,
body.ecc-cc .woocommerce-order .woocommerce-customer-details .woocommerce-columns--addresses::after {
	content: none !important;
}

body.ecc-cc .woocommerce-order .woocommerce-customer-details .woocommerce-column,
body.ecc-cc .woocommerce-order .woocommerce-customer-details > address,
body.ecc-cc .woocommerce-order .woocommerce-customer-details:not(:has(.woocommerce-columns--addresses)) {
	float: none !important;
	width: auto !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 24px !important;
	border: 0 !important;
	border-radius: var(--ecc-cc-radius);
	background: var(--ecc-cc-card);
}

body.ecc-cc .woocommerce-order .woocommerce-customer-details .woocommerce-column__title {
	margin: 0 0 10px !important;
	font-size: 18px !important;
}

body.ecc-cc .woocommerce-order .woocommerce-customer-details address {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	color: var(--ecc-cc-ink) !important;
	font-family: var(--ecc-cc-text) !important;
	font-size: 16px !important;
	font-style: normal !important;
	line-height: 1.55 !important;
	box-shadow: none !important;
}

body.ecc-cc .woocommerce-order .woocommerce-customer-details address p {
	margin: 6px 0 0 !important;
	padding: 0 !important;
	color: var(--ecc-cc-ink) !important;
	font-size: 16px !important;
}

body.ecc-cc .woocommerce-order .woocommerce-customer-details address p::before {
	display: none !important;
}

@media (max-width: 768px) {
	body.ecc-cc .woocommerce-order ul.woocommerce-order-overview {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 16px 20px;
		padding: 20px !important;
	}

	body.ecc-cc .woocommerce-order ul.woocommerce-order-overview li.woocommerce-order-overview__email {
		grid-column: 1 / -1;
	}

	body.ecc-cc .woocommerce-order .woocommerce-customer-details .woocommerce-columns--addresses {
		grid-template-columns: minmax(0, 1fr);
		gap: 12px;
	}

	body.ecc-cc .woocommerce-order table.shop_table th,
	body.ecc-cc .woocommerce-order table.shop_table td {
		padding: 14px 8px !important;
	}

	body.ecc-cc .woocommerce-order .woocommerce-thankyou-order-received {
		font-size: 17px !important;
	}

	body.ecc-cc .woocommerce-order table.shop_table small.includes_tax {
		display: block;
	}
}