.woocommerce-cart .entry-content,
.woocommerce-checkout .entry-content {
	color: #1f2f3a;
}

.bg-checkout-hero {
	margin: 0 0 18px;
	padding: clamp(22px, 4vw, 42px);
	background: #12374a;
	color: #fff;
	border-radius: 6px;
	overflow: hidden;
}

.bg-checkout-hero__inner {
	max-width: 760px;
}

.bg-checkout-kicker {
	margin: 0 0 8px;
	color: #fba002;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 0;
	text-transform: uppercase;
}

.bg-checkout-hero h1 {
	margin: 0;
	color: #fff;
	font-family: Anton, Impact, sans-serif;
	font-size: clamp(34px, 5vw, 58px);
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0;
}

.bg-checkout-hero p:last-child {
	max-width: 680px;
	margin: 12px 0 0;
	color: rgba(255, 255, 255, 0.86);
	font-size: 16px;
	line-height: 1.55;
}

.bg-checkout-trust {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 10px;
	margin: 0 0 22px;
}

.bg-checkout-trust__item,
.bg-payment-note {
	display: flex;
	align-items: center;
	gap: 10px;
	min-height: 64px;
	padding: 14px 16px;
	background: #fff8ea;
	border: 1px solid #efd9ac;
	border-radius: 6px;
	color: #173342;
	font-size: 14px;
	font-weight: 800;
	line-height: 1.25;
}

.bg-checkout-trust__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 38px;
	width: 38px;
	height: 38px;
	background: #fba002;
	color: #173342;
	border-radius: 999px;
	font-family: "JetBrains Mono", monospace;
	font-size: 11px;
	font-weight: 800;
	line-height: 1;
	text-transform: uppercase;
}

.bg-checkout-help a {
	color: #0b5d7c;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.bg-payment-note {
	justify-content: space-between;
	margin: 0 0 22px;
	background: #eef6f5;
	border-color: #c5ded9;
}

.bg-payment-note__mark {
	flex: 0 0 auto;
	padding: 9px 12px;
	background: #173342;
	color: #fff;
	border-radius: 4px;
	font-family: "JetBrains Mono", monospace;
	font-size: 12px;
	font-weight: 800;
	text-transform: uppercase;
}

.bg-payment-note p {
	margin: 0;
	color: #173342;
	font-size: 14px;
	line-height: 1.4;
}

body.woocommerce-cart .cart-content-wrapper,
body.woocommerce-checkout form.checkout {
	margin-top: 0;
}

body.woocommerce-cart .cart_totals,
body.woocommerce-checkout .checkout-order-review {
	border-top: 4px solid #fba002;
	border-radius: 6px;
}

@media (max-width: 1024px) {
	.bg-checkout-trust {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 640px) {
	.bg-checkout-hero {
		padding: 22px;
	}

	.bg-checkout-trust {
		grid-template-columns: 1fr;
	}

	.bg-payment-note {
		align-items: flex-start;
		flex-direction: column;
	}
}

/* ---------- H6-CTA-REBRAND — cart/checkout primary CTAs ----------
   Woodmart theme options still paint these in the deprecated pre-rebrand
   brown #7C4F2A. Override to brand yellow #FA9F03 with navy #08203C text,
   matching the PDP add-to-basket button (radius 10px / weight 700 /
   hover #E08A00). !important is required to beat Woodmart's generated
   button colour rules. */
body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
body.woocommerce-cart .wc-proceed-to-checkout .button,
body.woocommerce-cart button[name="apply_coupon"],
body.woocommerce-cart button[name="update_cart"],
body.woocommerce-cart .return-to-shop a.button,
body.woocommerce-cart a.button.wc-backward,
body.woocommerce-checkout button[name="apply_coupon"],
body.woocommerce-checkout #place_order,
body.woocommerce-checkout button#place_order {
	background-color: #FA9F03 !important;
	border-color: #FA9F03 !important;
	color: #08203C !important;
	font-weight: 700;
	border-radius: 10px;
	box-shadow: none;
	transition: background-color 120ms ease, border-color 120ms ease;
}

body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover,
body.woocommerce-cart .wc-proceed-to-checkout .button:hover,
body.woocommerce-cart button[name="apply_coupon"]:hover,
body.woocommerce-cart button[name="update_cart"]:hover,
body.woocommerce-cart .return-to-shop a.button:hover,
body.woocommerce-cart a.button.wc-backward:hover,
body.woocommerce-checkout button[name="apply_coupon"]:hover,
body.woocommerce-checkout #place_order:hover,
body.woocommerce-checkout button#place_order:hover {
	background-color: #E08A00 !important;
	border-color: #E08A00 !important;
	color: #08203C !important;
}

/* ---------- L9 — Worldpay hosted card fields ----------
   The Access Worldpay iframes (card number / expiry / CVC) render
   borderless, so the payment panel looks like bare labels. Give the
   mount containers (and the card-holder name input) a visible outline
   and a navy focus state. */
body.woocommerce-checkout .wc-payment-form .wc-payment-input,
body.woocommerce-checkout .wc-payment-form input.wc-credit-card-form-card-holder-name {
	min-height: 46px;
	padding: 2px 10px;
	background: #fff;
	border: 1px solid #cbd5e1;
	border-radius: 8px;
	transition: border-color 120ms ease, box-shadow 120ms ease;
}

body.woocommerce-checkout .wc-payment-form .wc-payment-input:focus-within,
body.woocommerce-checkout .wc-payment-form input.wc-credit-card-form-card-holder-name:focus {
	border-color: #08203C;
	box-shadow: 0 0 0 2px rgba(8, 32, 60, 0.12);
	outline: none;
}

/* ---------- M14 — cart cross-sell CTAs ----------
   Variation dropdowns and buttons in the "You may be interested in"
   cards clipped their labels ("Choose ar", "Select op..."). Let them
   use the full card width instead of clipping. */
body.woocommerce-cart .cross-sells select,
body.woocommerce-cart .related-and-upsells select {
	width: 100%;
	max-width: 100%;
	min-width: 0;
}

/* ---------- W3.3 — Empty-cart popular-routes block ---------- */

.bg-empty-cart {
	max-width: 960px;
	margin: 2rem auto 1.5rem;
	padding: 1.5rem 1.25rem;
	background: #f6f7f9;
	border: 1px solid #e2e8f0;
	border-radius: 16px;
}

.bg-empty-cart__title {
	margin: 0 0 0.35rem;
	font-size: 1.35rem;
	font-weight: 700;
	color: #101828;
}

.bg-empty-cart__lead {
	margin: 0 0 1.25rem;
	color: #344054;
	font-size: 0.95rem;
}

.bg-empty-cart__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0.85rem;
	margin-bottom: 1.1rem;
}

.bg-empty-cart__tile {
	display: block;
	padding: 1rem 1.1rem;
	background: #ffffff;
	border: 1px solid #e2e8f0;
	border-radius: 12px;
	text-decoration: none;
	color: #101828;
	transition: border-color 0.15s ease, transform 0.15s ease;
}

.bg-empty-cart__tile:hover,
.bg-empty-cart__tile:focus-visible {
	border-color: #FA9F03;
	transform: translateY(-1px);
}

.bg-empty-cart__tile strong {
	display: block;
	font-weight: 700;
	font-size: 1rem;
	margin-bottom: 0.25rem;
	color: #FA9F03;
}

.bg-empty-cart__tile small {
	display: block;
	color: #667085;
	font-size: 0.85rem;
	line-height: 1.4;
}

.bg-empty-cart__phone {
	margin: 0;
	color: #344054;
	font-size: 0.95rem;
}

.bg-empty-cart__phone a {
	font-weight: 700;
	color: #FA9F03;
	text-decoration: none;
}

.bg-empty-cart__phone a:hover {
	text-decoration: underline;
}

@media (max-width: 700px) {
	.bg-empty-cart__grid {
		grid-template-columns: 1fr;
	}
}
