/*
 * Venn checkout: one font, one text colour ramp, one action colour.
 * Child theme file (betheme-child_bak/css/venn-checkout.css), enqueued on the
 * cart, checkout and order-received pages only, so BeTheme updates don't touch it.
 *
 * Why it looks the way it does:
 *  - Poppins everywhere, three sizes (13 / 15 / 20) and three weights (400/500/600).
 *  - Text is ink (#1a1a1a) or muted grey (#6b6b6b). Red is kept for the one
 *    thing we want pressed (Place order / Proceed to checkout) and the required *.
 *  - Inputs, selects, payment boxes: white, 1px #dcdcdc line, 8px radius.
 *    The Stripe payment box reads these same computed styles (from
 *    #billing_first_name, the form labels and .payment_box), so it follows.
 */
body.woocommerce-cart,
body.woocommerce-checkout {
	--vc-ink: #1a1a1a;
	--vc-muted: #6b6b6b;
	--vc-line: #dcdcdc;
	--vc-surface: #f6f6f6;
	--vc-action: #e0282e;       /* brand red, darkened for white-text contrast (4.6:1) */
	--vc-action-hover: #c21f25;
	--vc-radius: 8px;
	--vc-font: Poppins, system-ui, -apple-system, "Segoe UI", sans-serif;
}

/* Newsletter bar and its toggle don't belong on the way to paying. */
body.woocommerce-cart #mailchimp-top-bar,
body.woocommerce-checkout #mailchimp-top-bar { display: none !important; }

/* ---- type ---------------------------------------------------------------- */
body.woocommerce-cart .woocommerce,
body.woocommerce-checkout .woocommerce,
body.woocommerce-cart .woocommerce *:not(.fa):not([class^="icon-"]):not([class*=" icon-"]),
body.woocommerce-checkout .woocommerce *:not(.fa):not([class^="icon-"]):not([class*=" icon-"]) {
	font-family: var(--vc-font);
}
body.woocommerce-checkout .woocommerce,
body.woocommerce-cart .woocommerce { color: var(--vc-ink); font-size: 15px; line-height: 1.55; }

body.woocommerce-checkout .woocommerce h3,
body.woocommerce-checkout #order_review_heading,
body.woocommerce-cart .cart_totals h2 {
	font-size: 20px; font-weight: 600; color: var(--vc-ink);
	letter-spacing: 0; text-transform: none; text-align: left; margin: 0 0 16px;
}

body.woocommerce-checkout .woocommerce form .form-row label,
body.woocommerce-checkout .woocommerce-form__label-for-checkbox {
	font-size: 13px; font-weight: 500; color: var(--vc-ink); line-height: 1.5;
}
body.woocommerce-checkout .woocommerce form .form-row .required { color: var(--vc-action); text-decoration: none; }

body.woocommerce-checkout .woocommerce a:not(.button),
body.woocommerce-cart .woocommerce a:not(.button):not(.remove) {
	color: var(--vc-ink); text-decoration: underline; text-underline-offset: 2px;
}

/* ---- fields ---------------------------------------------------------------- */
body.woocommerce-checkout .woocommerce form .input-text,
body.woocommerce-checkout .woocommerce form select,
body.woocommerce-checkout .select2-container .select2-selection--single,
body.woocommerce-cart .woocommerce .input-text,
body.woocommerce-cart .coupon #coupon_code {
	font-size: 15px; font-weight: 400; color: var(--vc-ink);
	background: #fff; border: 1px solid var(--vc-line); border-radius: var(--vc-radius);
	box-shadow: none; min-height: 48px; padding: 11px 14px; line-height: 1.4;
	text-transform: none; letter-spacing: 0;
}
body.woocommerce-checkout .woocommerce form textarea.input-text { min-height: 110px; }
body.woocommerce-checkout .select2-container .select2-selection--single { height: 48px; display: flex; align-items: center; padding: 0 14px; }
body.woocommerce-checkout .select2-container .select2-selection__rendered { padding: 0; line-height: 46px; color: var(--vc-ink); }
body.woocommerce-checkout .select2-container .select2-selection__arrow { height: 46px; right: 10px; }
body.woocommerce-checkout .woocommerce form .input-text:focus,
body.woocommerce-checkout .woocommerce form select:focus,
body.woocommerce-checkout .select2-container--focus .select2-selection,
body.woocommerce-cart .woocommerce .input-text:focus {
	border-color: var(--vc-ink); outline: 2px solid rgba(26, 26, 26, .12); outline-offset: 0;
}
body.woocommerce-checkout .woocommerce form .input-text::placeholder,
body.woocommerce-cart .woocommerce .input-text::placeholder { color: #9a9a9a; text-transform: none; letter-spacing: 0; }
body.woocommerce-checkout .woocommerce form .form-row { margin-bottom: 14px; }

/* ---- order summary ---------------------------------------------------------- */
body.woocommerce-checkout #order_review,
body.woocommerce-checkout .woocommerce-checkout-review-order {
	background: var(--vc-surface); border-radius: 12px;
}
body.woocommerce-checkout table.shop_table,
body.woocommerce-cart table.shop_table { border: 0; border-collapse: collapse; font-size: 15px; color: var(--vc-ink); }
body.woocommerce-checkout table.shop_table th,
body.woocommerce-checkout table.shop_table td,
body.woocommerce-cart table.shop_table th,
body.woocommerce-cart table.shop_table td {
	border-top: 1px solid var(--vc-line); padding: 14px 12px; font-size: 15px; font-weight: 400;
	color: var(--vc-ink); background: transparent;
}
body.woocommerce-checkout table.shop_table thead th,
body.woocommerce-cart table.shop_table thead th {
	font-size: 13px; font-weight: 500; color: var(--vc-muted); letter-spacing: 0; text-transform: none; border-top: 0;
}
body.woocommerce-checkout table.shop_table .product-name { font-weight: 500; }
body.woocommerce-checkout table.shop_table .product-quantity { color: var(--vc-muted); font-weight: 400; background: none; }
body.woocommerce-checkout table.shop_table .order-total th,
body.woocommerce-checkout table.shop_table .order-total td,
body.woocommerce-cart .cart_totals .order-total th,
body.woocommerce-cart .cart_totals .order-total td { font-size: 18px; font-weight: 600; }
body.woocommerce-checkout table.shop_table .order-total .amount,
body.woocommerce-cart .woocommerce .amount { color: var(--vc-ink); }
body.woocommerce-cart table.shop_table .product-price .amount,
body.woocommerce-cart table.shop_table .product-subtotal .amount { font-weight: 500; }

/* ---- payment methods -------------------------------------------------------- */
body.woocommerce-checkout #payment,
body.woocommerce-checkout #payment ul.payment_methods { background: transparent; border: 0; padding: 0; }
body.woocommerce-checkout #payment ul.payment_methods > li {
	background: #fff; border: 1px solid var(--vc-line); border-radius: var(--vc-radius);
	margin: 0 0 10px; padding: 14px 16px; list-style: none;
}
body.woocommerce-checkout #payment ul.payment_methods > li:has(> input:checked) { border-color: var(--vc-ink); }
body.woocommerce-checkout #payment ul.payment_methods > li > label {
	font-size: 15px; font-weight: 500; color: var(--vc-ink);
	display: inline-flex; align-items: center; gap: 10px; flex-wrap: wrap;
}
body.woocommerce-checkout #payment ul.payment_methods > li > label img {
	max-height: 24px; width: auto; margin: 0; background: transparent; vertical-align: middle;
}
body.woocommerce-checkout #payment div.payment_box {
	background: #fff; color: var(--vc-ink); font-size: 13px; padding: 12px 0 0; margin: 8px 0 0; border-radius: 0;
}
body.woocommerce-checkout #payment div.payment_box::before { display: none; }
body.woocommerce-checkout #payment div.payment_box .form-row label { font-weight: 400; }

/* ---- legal, notices --------------------------------------------------------- */
body.woocommerce-checkout .woocommerce-privacy-policy-text,
body.woocommerce-checkout .woocommerce-privacy-policy-text p { font-size: 13px; color: var(--vc-muted); line-height: 1.55; }
body.woocommerce-checkout form.checkout .woocommerce-terms-and-conditions-wrapper label.woocommerce-form__label-for-checkbox {
	display: flex; gap: 10px; align-items: flex-start; font-weight: 400; font-size: 13px;
}
body.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper input[type="checkbox"] { margin-top: 3px; width: 16px; height: 16px; flex: 0 0 auto; }
body.woocommerce-checkout .woocommerce-terms-and-conditions {
	background: #fff; border: 1px solid var(--vc-line); border-radius: var(--vc-radius); font-size: 13px;
}
body.woocommerce-checkout .woocommerce-info,
body.woocommerce-checkout .woocommerce-message,
body.woocommerce-checkout .woocommerce-error,
body.woocommerce-cart .woocommerce-info,
body.woocommerce-cart .woocommerce-message,
body.woocommerce-cart .woocommerce-error {
	background: var(--vc-surface); color: var(--vc-ink); border: 0; border-left: 3px solid var(--vc-ink);
	border-radius: var(--vc-radius); font-size: 15px;
}
body.woocommerce-checkout .woocommerce-error,
body.woocommerce-cart .woocommerce-error { border-left-color: var(--vc-action); }

/* ---- buttons ---------------------------------------------------------------- */
body.woocommerce-checkout .woocommerce button.button,
body.woocommerce-checkout .woocommerce a.button,
body.woocommerce-checkout .woocommerce input.button,
body.woocommerce-cart .woocommerce button.button,
body.woocommerce-cart .woocommerce a.button,
body.woocommerce-cart .woocommerce input.button {
	font-family: var(--vc-font); font-size: 15px; font-weight: 500; letter-spacing: 0; text-transform: none;
	color: var(--vc-ink); background: #fff; border: 1px solid var(--vc-ink); border-radius: var(--vc-radius);
	min-height: 48px; padding: 0 22px; line-height: 46px; box-shadow: none; text-shadow: none;
	transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
body.woocommerce-checkout .woocommerce button.button:hover,
body.woocommerce-cart .woocommerce button.button:hover,
body.woocommerce-cart .woocommerce a.button:hover { background: var(--vc-ink); color: #fff; }
body.woocommerce-cart .woocommerce button.button:disabled,
body.woocommerce-cart .woocommerce button.button:disabled:hover { background: #fff; color: #9a9a9a; border-color: var(--vc-line); cursor: default; }

/* The one red button on each page. */
body.woocommerce-checkout #place_order,
body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
	display: block; width: 100%; min-height: 56px; line-height: 56px; padding: 0 24px;
	font-size: 16px; font-weight: 600; text-align: center; color: #fff;
	background: var(--vc-action); border: 0; border-radius: var(--vc-radius);
}
body.woocommerce-checkout #place_order:hover,
body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover { background: var(--vc-action-hover); color: #fff; }
body.woocommerce-checkout #place_order:focus-visible,
body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:focus-visible { outline: 3px solid rgba(224, 40, 46, .35); outline-offset: 2px; }

/* Cart: coupon row */
body.woocommerce-cart .woocommerce .coupon { display: flex; gap: 10px; align-items: stretch; }
body.woocommerce-cart .woocommerce .coupon #coupon_code { width: 200px; }
body.woocommerce-cart table.shop_table .product-remove a.remove { color: var(--vc-muted) !important; font-weight: 400; }
body.woocommerce-cart table.shop_table .product-remove a.remove:hover { color: var(--vc-action) !important; background: transparent; }