/* ABC Checkout Boss — Frontend Checkout Styles */

/* ── CSS Variables (defaults — overridden by inline style per form) ── */
.abc-checkout-boss-wrapper {
	--abc-primary: #6d4aff;
	--abc-secondary: #4c2fe0;
	--abc-bg: #f5f6fa;
	--abc-radius: 8px;
	--abc-spacing: 24px;
	--abc-font-family: inherit;
	--abc-font-size: 15px;
	--abc-font-weight: 400;
	--abc-line-height: 1.6;
	--abc-heading-size: 20px;
	--abc-heading-weight: 700;
	--abc-label-color: #444444;
	--abc-label-size: 14px;
	--abc-input-height: 48px;
	--abc-input-bg: #ffffff;
	--abc-input-border: 1px solid #e0e0e0;
	--abc-input-focus: #6d4aff;
	--abc-input-radius: 6px;
	--abc-btn-bg: #6d4aff;
	--abc-btn-color: #ffffff;
	--abc-btn-hover: #4c2fe0;
	--abc-btn-width: 100%;
	--abc-btn-height: 54px;
	--abc-btn-radius: 6px;
	--abc-product-bg: #ffffff;
	--abc-product-selected: #6d4aff;
	--abc-badge-bg: #ff6b35;
	--abc-badge-color: #ffffff;
	--abc-img-radius: 6px;
	--abc-payment-bg: #ffffff;
	--abc-payment-border: 1px solid #e0e0e0;
	--abc-payment-active: #6d4aff;
	--abc-summary-bg: #ffffff;
	--abc-price-color: #6d4aff;
	--abc-summary-spacing: 16px;

	/* Layout — !important so WP admin/theme ID-selector rules cannot override these */
	margin: 0 auto;
	padding: var(--abc-spacing) !important;
	background: var(--abc-bg) !important;
	font-family: var(--abc-font-family) !important;
	font-size: var(--abc-font-size) !important;
	font-weight: var(--abc-font-weight) !important;
	line-height: var(--abc-line-height) !important;
	color: #1a1a2e !important;
	box-sizing: border-box;
}

.abc-checkout-boss-wrapper *,
.abc-checkout-boss-wrapper *::before,
.abc-checkout-boss-wrapper *::after {
	box-sizing: border-box;
}

/* ── Isolation reset — block theme/plugin CSS that bleeds into the wrapper ── */

/* Headings: themes set margin, padding, letter-spacing, text-transform, etc. */
.abc-checkout-boss-wrapper h1,
.abc-checkout-boss-wrapper h2,
.abc-checkout-boss-wrapper h3,
.abc-checkout-boss-wrapper h4,
.abc-checkout-boss-wrapper h5,
.abc-checkout-boss-wrapper h6 {
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
	background: none !important;
	box-shadow: none !important;
	text-shadow: none !important;
	font-family: var(--abc-font-family) !important;
	letter-spacing: normal !important;
	text-transform: none !important;
	line-height: 1.3 !important;
}

/* Paragraphs: many themes add large bottom margins. */
.abc-checkout-boss-wrapper p {
	margin: 0 0 8px;
	padding: 0;
	line-height: var(--abc-line-height);
}
.abc-checkout-boss-wrapper p:last-child { margin-bottom: 0; }

/* Links: themes override colour, hover effect, box-shadow. */
.abc-checkout-boss-wrapper a {
	color: var(--abc-primary);
	text-decoration: none;
	box-shadow: none;
	background: none;
}
.abc-checkout-boss-wrapper a:hover,
.abc-checkout-boss-wrapper a:focus {
	color: var(--abc-secondary);
	text-decoration: underline;
	box-shadow: none;
	outline: none;
}

/* Lists: WooCommerce payment methods are ul>li; themes add list-style/padding/bullets. */
.abc-checkout-boss-wrapper ul,
.abc-checkout-boss-wrapper ol {
	margin: 0;
	padding: 0;
	list-style: none;
}
.abc-checkout-boss-wrapper li {
	margin: 0;
	padding: 0;
	list-style: none;
	background: none;
}
.abc-checkout-boss-wrapper li::before,
.abc-checkout-boss-wrapper li::after {
	display: none !important;
	content: none !important;
}

/* Labels: themes often set display:block, margin-bottom, font-weight:bold. */
.abc-checkout-boss-wrapper label {
	display: inline;
	margin: 0;
	padding: 0;
	font-weight: inherit;
}

/* Fieldsets and forms: themes add padding/border; WC adds .col2-set float layout. */
.abc-checkout-boss-wrapper fieldset { border: none; margin: 0; padding: 0; min-width: 0; }
.abc-checkout-boss-wrapper form     { margin: 0; padding: 0; border: none; }

/* Images: prevent theme border / max-width overrides. */
.abc-checkout-boss-wrapper img { max-width: 100%; height: auto; border: none; vertical-align: middle; }

/* Tables: prevent theme default table styling from leaking in. */
.abc-checkout-boss-wrapper table { border-collapse: collapse; border-spacing: 0; }
.abc-checkout-boss-wrapper th,
.abc-checkout-boss-wrapper td { padding: 0; border: none; background: none; text-align: left; vertical-align: top; }

/* WooCommerce form-row / col2-set injected by the payment.php template. */
.abc-checkout-boss-wrapper .form-row        { margin: 0 !important; padding: 0 !important; }
.abc-checkout-boss-wrapper .col2-set        { width: 100% !important; float: none !important; clear: both !important; }
.abc-checkout-boss-wrapper .woocommerce-billing-fields,
.abc-checkout-boss-wrapper .woocommerce-shipping-fields { margin: 0 !important; padding: 0 !important; }

/* ── Reset page-builder (Elementor / Divi / etc.) inherited button overrides ── */
/* !important is required here — Elementor and most themes use !important on button styles. */
.abc-checkout-boss-wrapper button {
	background: transparent !important;
	border: none !important;
	border-radius: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	color: inherit !important;
	font-family: inherit !important;
	font-size: inherit !important;
	font-weight: inherit !important;
	line-height: inherit !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	box-shadow: none !important;
	text-shadow: none !important;
	outline: none !important;
	cursor: pointer !important;
	-webkit-appearance: none !important;
	appearance: none !important;
}

/* ── Columns ── */
.abc-checkout-columns {
	display: grid;
	gap: var(--abc-spacing);
}

.abc-checkout-columns.abc-two-col {
	grid-template-columns: 1fr 360px;
	align-items: start;
}

.abc-col-summary {
	position: sticky;
	top: 20px;
}

.abc-checkout-columns.abc-one-col {
	grid-template-columns: 1fr;
}

/* Slot for JS-repositioned summary on mobile — hidden until JS fills it. */
.abc-mobile-summary-slot { display: none; }

@media (max-width: 768px) {
	/* gap:0 — once the columns stack to one, .abc-col-main and .abc-col-summary
	   become two vertically-stacked grid rows and the grid's row-gap would add
	   on top of the margin-bottom every .abc-section already carries, doubling
	   the space between the last item of one column and the first of the next
	   (e.g. Order Summary → Payment Method) versus plain section-to-section
	   spacing within a column. Each section's own margin-bottom is enough. */
	.abc-checkout-columns.abc-two-col { grid-template-columns: 1fr; gap: 0; }
	/* Grid already stacks to one column — JS moves .abc-order-summary into the mobile slot above */
	.abc-col-summary { position: static; }
}

/* ── Mobile overflow protection ─────────────────────────────────────────
   Grid/flex children default to min-width:auto, so ONE over-wide element
   (a gateway banner image inside .payment_box, a long unbreakable string,
   an injected table) silently forces the whole checkout wider than the
   phone screen — every section then overflows the viewport equally. */
.abc-checkout-columns > * { min-width: 0; }

.abc-checkout-boss-wrapper .abc-section {
	min-width: 0;
	max-width: 100%;
	overflow-wrap: break-word;
	box-sizing: border-box;
}

/* Anything a payment gateway or theme injects must never exceed its box. */
.abc-checkout-boss-wrapper img { max-width: 100%; }

.abc-checkout-boss-wrapper .payment_box img,
.abc-checkout-boss-wrapper .payment_methods img {
	max-width: 100% !important;
	height: auto;
}

.abc-checkout-boss-wrapper .payment_methods li { min-width: 0; }

.abc-checkout-boss-wrapper .payment_box {
	max-width: 100%;
	overflow-x: auto; /* wide gateway iframes/tables scroll inside their own box */
}

/* Final guard: the checkout can never cause page-level horizontal scroll.
   overflow-x: clip (unlike hidden) does not create a scroll container, so
   the sticky order summary keeps working; older browsers ignore it safely. */
.abc-checkout-boss-wrapper { overflow-x: clip; }

/* ── Section ── */
.abc-section {
	background: #fff !important;
	border-radius: var(--abc-radius) !important;
	padding: var(--abc-spacing) !important;
	margin-bottom: var(--abc-spacing) !important;
	border: var(--abc-input-border) !important;
	box-shadow: none !important;
}

.abc-checkout-boss-wrapper .abc-section-title {
	font-size: var(--abc-heading-size) !important;
	font-weight: var(--abc-heading-weight) !important;
	margin: 0 0 20px !important;
	padding: 0 !important;
	color: #1a1a2e !important;
	letter-spacing: normal !important;
	text-transform: none !important;
	line-height: 1.3 !important;
	border: none !important;
	background: none !important;
}

/* ── Fields Grid ── */
.abc-fields-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}

@media (max-width: 480px) { .abc-fields-grid { grid-template-columns: 1fr; } }

.abc-field-wrap { display: flex; flex-direction: column; gap: 6px; }
.abc-field-full { grid-column: 1 / -1; }
.abc-field-half { grid-column: span 1; }

.abc-field-wrap label {
	display: block !important;
	font-size: var(--abc-label-size) !important;
	font-weight: 500 !important;
	color: var(--abc-label-color) !important;
	margin: 0 !important;
	padding: 0 !important;
	line-height: 1.4 !important;
	text-transform: none !important;
	letter-spacing: normal !important;
}

.abc-required { color: #dc2626; margin-left: 2px; }

/* ── Inputs ── */
.abc-checkout-boss-wrapper .abc-input,
.abc-checkout-boss-wrapper input[type="text"],
.abc-checkout-boss-wrapper input[type="email"],
.abc-checkout-boss-wrapper input[type="tel"],
.abc-checkout-boss-wrapper input[type="number"],
.abc-checkout-boss-wrapper input[type="url"],
.abc-checkout-boss-wrapper input[type="date"],
.abc-checkout-boss-wrapper input[type="password"],
.abc-checkout-boss-wrapper textarea,
.abc-checkout-boss-wrapper select {
	width: 100% !important;
	max-width: 100% !important;
	height: var(--abc-input-height) !important;
	padding: 0 14px !important;
	background: var(--abc-input-bg) !important;
	border: var(--abc-input-border) !important;
	border-radius: var(--abc-input-radius) !important;
	font-size: var(--abc-font-size) !important;
	font-family: var(--abc-font-family) !important;
	color: #1a1a2e !important;
	transition: border-color .2s, box-shadow .2s;
	-webkit-appearance: none !important;
	appearance: none !important;
	outline: none !important;
	box-shadow: none !important;
	margin: 0 !important;
}

.abc-checkout-boss-wrapper textarea {
	height: auto !important;
	min-height: 80px !important;
	padding: 12px 14px !important;
	resize: vertical;
}

.abc-checkout-boss-wrapper .abc-input:focus,
.abc-checkout-boss-wrapper input:focus,
.abc-checkout-boss-wrapper textarea:focus,
.abc-checkout-boss-wrapper select:focus {
	border-color: var(--abc-input-focus) !important;
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--abc-input-focus) 18%, transparent) !important;
	outline: none !important;
}

.abc-checkout-boss-wrapper .abc-select,
.abc-checkout-boss-wrapper select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%236b7280' d='M1 1l5 5 5-5'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right 12px center !important;
	background-color: var(--abc-input-bg) !important;
	padding-right: 36px !important;
	cursor: pointer !important;
}

/* ── Buttons ── */
.abc-checkout-boss-wrapper .abc-btn {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	padding: 0 24px !important;
	border: none !important;
	border-radius: var(--abc-btn-radius) !important;
	font-size: var(--abc-font-size) !important;
	font-family: var(--abc-font-family) !important;
	font-weight: 600 !important;
	cursor: pointer !important;
	transition: background .2s, transform .1s;
	text-decoration: none !important;
	line-height: 1 !important;
	box-shadow: none !important;
	text-shadow: none !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	-webkit-appearance: none !important;
	appearance: none !important;
	outline: none !important;
}

.abc-checkout-boss-wrapper .abc-btn:active { transform: scale(.98); }

.abc-checkout-boss-wrapper .abc-btn-primary {
	background: var(--abc-btn-bg) !important;
	color: var(--abc-btn-color) !important;
}

.abc-checkout-boss-wrapper .abc-btn-primary:hover { background: var(--abc-btn-hover) !important; color: var(--abc-btn-color) !important; text-decoration: none !important; }

.abc-checkout-boss-wrapper .abc-btn-secondary {
	background: #f3f4f6 !important;
	color: #374151 !important;
	border: 1px solid #e5e7eb !important;
}

.abc-checkout-boss-wrapper .abc-btn-secondary:hover { background: #e5e7eb !important; }

.abc-checkout-boss-wrapper .abc-btn-prev {
	background: none !important;
	color: #6b7280 !important;
	border: 1px solid #e5e7eb !important;
	border-radius: var(--abc-btn-radius) !important;
	padding: 12px 24px !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	cursor: pointer !important;
	transition: all .2s;
}

.abc-checkout-boss-wrapper .abc-btn-prev:hover { border-color: var(--abc-primary) !important; color: var(--abc-primary) !important; }

.abc-checkout-boss-wrapper .abc-btn-next.abc-btn-primary {
	padding: 12px 28px !important;
	font-size: 15px !important;
}

/* ── Place Order Button ── */
.abc-checkout-boss-wrapper .abc-place-order { margin-top: 20px; }

.abc-checkout-boss-wrapper .abc-place-order-btn {
	width: var(--abc-btn-width) !important;
	height: var(--abc-btn-height) !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	position: relative;
	letter-spacing: .3px !important;
}

.abc-checkout-boss-wrapper .abc-place-order-btn:disabled { opacity: .7; cursor: not-allowed; }

.abc-checkout-boss-wrapper .abc-btn-total-badge {
	display: inline-block;
	margin-left: 10px;
	padding-left: 10px;
	border-left: 1px solid rgba(255,255,255,.35);
	font-size: 15px;
	font-weight: 800;
	letter-spacing: .2px;
	vertical-align: middle;
}

.abc-btn-spinner {
	width: 20px;
	height: 20px;
	border: 2px solid rgba(255,255,255,.3);
	border-top-color: #fff;
	border-radius: 50%;
	animation: abc-spin 0.8s linear infinite;
}

@keyframes abc-spin { to { transform: rotate(360deg); } }

/* ── Step Indicators ── */
.abc-step-indicators {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0;
	margin-bottom: var(--abc-spacing);
}

.abc-step-indicator {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	position: relative;
	flex: 1;
}

.abc-step-indicator::after {
	content: '';
	position: absolute;
	top: 15px;
	left: 60%;
	right: -40%;
	height: 2px;
	background: #e5e7eb;
	z-index: 0;
}

.abc-step-indicator:last-child::after { display: none; }

.abc-step-num {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: #e5e7eb;
	color: #9ca3af;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	font-weight: 700;
	position: relative;
	z-index: 1;
	transition: all .3s;
}

.abc-step-label {
	font-size: 12px;
	color: #9ca3af;
	font-weight: 500;
	text-align: center;
}

.abc-step-indicator.active .abc-step-num { background: var(--abc-primary); color: #fff; }
.abc-step-indicator.active .abc-step-label { color: var(--abc-primary); font-weight: 600; }
.abc-step-indicator.completed .abc-step-num { background: #10b981; color: #fff; }
.abc-step-indicator.completed::after { background: #10b981; }

/* ── Multi Step ── */
.abc-step { display: none; }
.abc-step.abc-step-active { display: block; }

.abc-step-title {
	font-size: 18px;
	font-weight: 700;
	margin: 0 0 20px;
	color: #1a1a2e;
}

.abc-step-nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 20px;
	gap: 12px;
}

/* ── Multi-Step Mini Summary (steps 2+) ── */
.abc-multi-mini-summary {
	background: #fff;
	border: var(--abc-input-border);
	border-radius: var(--abc-radius);
	padding: var(--abc-spacing);
	margin-bottom: var(--abc-spacing);
	box-shadow: 0 1px 6px rgba(0,0,0,.06);
}
.abc-ms-heading {
	font-size: 15px;
	font-weight: 700;
	color: #1a1a2e;
	margin: 0 0 14px;
	padding-bottom: 12px;
	border-bottom: 2px solid var(--abc-primary, #6d4aff);
}
.abc-mini-summary-placeholder { color: #9ca3af; font-size: 13px; }
.abc-ms-row {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 0;
	border-bottom: 1px solid #f3f4f6;
}
.abc-ms-row:last-child { border-bottom: none; }
.abc-ms-thumb {
	width: 52px;
	height: 52px;
	border-radius: 8px;
	object-fit: cover;
	flex-shrink: 0;
	border: 1px solid #e5e7eb;
}
.abc-ms-info { flex: 1; min-width: 0; }
.abc-ms-name {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: #1a1a2e;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.abc-ms-qty-label { display: block; font-size: 12px; color: #6b7280; margin-top: 3px; }
.abc-ms-line-total {
	font-size: 14px;
	font-weight: 700;
	color: var(--abc-price-color, #6d4aff);
	white-space: nowrap;
}
.abc-ms-total-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-top: 12px;
	margin-top: 8px;
	border-top: 2px solid var(--abc-primary, #6d4aff);
	font-size: 15px;
	font-weight: 700;
	color: #1a1a2e;
}
.abc-ms-total-val { font-size: 17px; color: var(--abc-price-color, #6d4aff); }

/* ── Products Section ── */
.abc-product-section {
	background: #fff !important;
	border-radius: var(--abc-radius) !important;
	padding: var(--abc-spacing) !important;
	margin-bottom: var(--abc-spacing) !important;
	border: var(--abc-input-border) !important;
	box-shadow: none !important;
}

.abc-products-grid { display: grid; gap: 12px; padding-top: 16px; }
.abc-products-per-row-1 { grid-template-columns: repeat(1, 1fr); }
.abc-products-per-row-2 { grid-template-columns: repeat(2, 1fr); }
.abc-products-per-row-3 { grid-template-columns: repeat(3, 1fr); }
.abc-products-per-row-4 { grid-template-columns: repeat(4, 1fr); }

@media (max-width: 600px) {
	.abc-products-per-row-2,
	.abc-products-per-row-3,
	.abc-products-per-row-4 { grid-template-columns: 1fr 1fr; }
}

/* ── Product Card (horizontal layout) ── */
.abc-product-card {
	background: var(--abc-product-bg);
	border: 2px solid #e5e7eb;
	border-radius: var(--abc-radius);
	padding: 14px;
	cursor: pointer;
	transition: border-color .2s, box-shadow .2s, background .2s;
	position: relative;
	overflow: visible;
	display: flex;
	flex-direction: column;
	gap: 0;
}

.abc-product-card:hover { border-color: var(--abc-product-selected); box-shadow: 0 4px 12px color-mix(in srgb, var(--abc-product-selected) 18%, transparent); }
.abc-product-card.abc-product-selected { border-color: var(--abc-product-selected); background: color-mix(in srgb, var(--abc-product-selected) 5%, #fff); }

/* Inactive (not selected) state — dim card, block variation/qty interaction */
.abc-product-card.abc-product-inactive { opacity: 0.90; transition: opacity 0.2s; cursor: pointer; }
.abc-product-card.abc-product-inactive:hover { opacity: 0.7; border-color: #d1d5db; box-shadow: none; }
.abc-product-card.abc-product-inactive .abc-product-variations,
.abc-product-card.abc-product-inactive .abc-product-qty-row { pointer-events: none; }

/* Header row: thumb + info + selector */
.abc-product-card-header { display: flex; align-items: flex-start; gap: 10px; }

.abc-product-thumb-wrap {
	flex-shrink: 0;
	width: 64px;
	height: 64px;
	border-radius: 6px;
	overflow: hidden;
	background: #f3f4f6;
	display: flex;
	align-items: center;
	justify-content: center;
}

.abc-product-thumb { width: 64px; height: 64px; object-fit: cover; display: block; }

.abc-product-header-info { flex: 1; min-width: 0; }

.abc-product-name { font-weight: 600; font-size: 14px; color: #1a1a2e; line-height: 1.3; margin-bottom: 2px; }
.abc-product-sub { font-size: 12px; color: #6b7280; margin-bottom: 4px; }

.abc-product-meta {
	font-size: 13px;
	color: #6b7280;
	margin-top: 4px;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 2px;
}

.abc-product-meta .abc-product-price { font-weight: 700; color: var(--abc-price-color); font-size: 14px; }
.abc-product-meta .abc-regular-price { font-size: 12px; color: #9ca3af; text-decoration: line-through; margin-right: 4px; }
.abc-product-savings { font-size: 12px; font-weight: 600; color: #16a34a; margin-top: 5px; }

/* Selection dot (top-right of header) */
.abc-product-selector { flex-shrink: 0; padding-top: 2px; }

.abc-product-dot {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	border: 2px solid #d1d5db;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: border-color .2s, background .2s;
}

.abc-product-dot.abc-product-checkbox { border-radius: 4px; }

.abc-product-card.abc-product-selected .abc-product-dot {
	border-color: var(--abc-product-selected);
	background: var(--abc-product-selected);
}

.abc-product-card.abc-product-selected .abc-product-dot::after {
	content: '';
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: #fff;
	display: block;
}

.abc-product-card.abc-product-selected .abc-product-dot.abc-product-checkbox::after {
	content: '✓';
	border-radius: 0;
	background: none;
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	line-height: 1;
	width: auto;
	height: auto;
}

.abc-product-badge {
	position: absolute;
	top: 0;
	left: 50%;
	transform: translate(-50%, -50%);
	background: var(--abc-badge-bg);
	color: var(--abc-badge-color);
	font-size: 10px;
	font-weight: 700;
	padding: 4px 12px;
	border-radius: 20px;
	text-transform: uppercase;
	letter-spacing: .6px;
	white-space: nowrap;
	box-shadow: 0 2px 8px rgba(0,0,0,.18);
	z-index: 2;
}

/* ── Quantity stepper row ── */
.abc-product-qty-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 10px;
	padding-top: 10px;
	border-top: 1px solid #f3f4f6;
}

.abc-qty-stepper {
	display: flex;
	align-items: center;
	border: 1.5px solid #d1d5db;
	border-radius: 6px;
	overflow: hidden;
}

.abc-checkout-boss-wrapper .abc-qty-btn {
	width: 30px !important;
	height: 30px !important;
	border: none !important;
	background: #f9fafb !important;
	cursor: pointer !important;
	font-size: 16px !important;
	font-weight: 500 !important;
	color: #374151 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	transition: background .15s, color .15s;
	padding: 0 !important;
	line-height: 1 !important;
	flex-shrink: 0 !important;
	box-shadow: none !important;
	text-shadow: none !important;
	border-radius: 0 !important;
}

.abc-checkout-boss-wrapper .abc-qty-btn:hover { background: #e5e7eb; color: var(--abc-primary); }

.abc-qty-num {
	min-width: 32px;
	height: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	font-weight: 600;
	color: #1a1a2e;
	border-left: 1.5px solid #d1d5db;
	border-right: 1.5px solid #d1d5db;
	background: #fff;
	padding: 0 4px;
}

.abc-product-line-total { font-weight: 700; font-size: 15px; color: var(--abc-price-color); }

/* ── Variable product variations ── */
.abc-product-variations {
	margin-top: 10px;
	padding-top: 10px;
	border-top: 1px solid #f3f4f6;
}

.abc-variation-group { margin-bottom: 10px; }
.abc-variation-group:last-child { margin-bottom: 0; }

.abc-variation-label { font-size: 12px; color: #6b7280; margin-bottom: 6px; display: block; }
.abc-checkout-boss-wrapper .abc-variation-current { color: var(--abc-primary); font-weight: 600; }

.abc-variation-btns { display: flex; flex-wrap: wrap; gap: 6px; }

.abc-checkout-boss-wrapper .abc-var-btn {
	min-width: 36px !important;
	height: 30px !important;
	border: 1.5px solid #d1d5db !important;
	border-radius: 4px !important;
	background: #fff !important;
	cursor: pointer !important;
	font-size: 12px !important;
	font-weight: 500 !important;
	color: #374151 !important;
	padding: 0 8px !important;
	transition: border-color .15s, background .15s, color .15s;
	line-height: 1 !important;
	text-transform: uppercase !important;
	box-shadow: none !important;
	text-shadow: none !important;
}

.abc-checkout-boss-wrapper .abc-var-btn:hover { border-color: var(--abc-primary) !important; color: var(--abc-primary) !important; }
.abc-checkout-boss-wrapper .abc-var-btn.active { border-color: var(--abc-primary) !important; background: var(--abc-primary) !important; color: #fff !important; }
.abc-checkout-boss-wrapper .abc-var-btn.out-of-stock { opacity: .4 !important; cursor: not-allowed !important; text-decoration: line-through !important; }
.abc-checkout-boss-wrapper .abc-variation-current { text-transform: uppercase; }

/* ── Shipping Toggle ── */
.abc-ship-to-different {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	cursor: pointer;
	margin-bottom: 12px;
	color: var(--abc-primary);
	font-weight: 500;
}

/* ── Coupon ── */
.abc-coupon-section {
	margin-bottom: var(--abc-spacing) !important;
}

.abc-coupon-row { display: flex; gap: 8px; align-items: center; }
.abc-coupon-input { flex: 1 !important; min-width: 0; }

.abc-checkout-boss-wrapper .abc-apply-coupon {
	height: var(--abc-input-height) !important;
	padding: 0 20px !important;
	white-space: nowrap !important;
	flex-shrink: 0 !important;
}

.abc-coupon-message { margin-top: 8px; font-size: 13px; padding: 8px 12px; border-radius: 6px; }
.abc-coupon-message.success { background: #d1fae5; color: #065f46; }
.abc-coupon-message.error { background: #fee2e2; color: #991b1b; }

/* ── Order Bump ── */
@keyframes abc-bump-border-pulse {
	0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--abc-bump-border, #f59e0b) 45%, transparent), 0 4px 20px color-mix(in srgb, var(--abc-bump-border, #f59e0b) 10%, transparent); }
	50%       { box-shadow: 0 0 0 6px color-mix(in srgb, var(--abc-bump-border, #f59e0b) 0%, transparent),  0 4px 24px color-mix(in srgb, var(--abc-bump-border, #f59e0b) 25%, transparent); }
}
@keyframes abc-bump-ribbon-shimmer {
	0%   { background-position: -200% center; }
	100% { background-position:  200% center; }
}
@keyframes abc-bump-cta-pulse {
	0%, 100% { opacity: 1; }
	50%       { opacity: .75; }
}

.abc-checkout-boss-wrapper .abc-order-bump {
	background: var(--abc-bump-bg, #fff9f0);
	border: 2px dashed var(--abc-bump-border, #f59e0b);
	border-radius: var(--abc-radius, 12px);
	margin-bottom: 16px;
	overflow: hidden;
	animation: abc-bump-border-pulse 2.4s ease-in-out infinite;
	transition: border-color .25s, box-shadow .25s;
}

.abc-checkout-boss-wrapper .abc-bump-ribbon {
	background: linear-gradient(90deg, var(--abc-bump-ribbon-bg, #f59e0b) 0%, color-mix(in srgb, var(--abc-bump-ribbon-bg, #f59e0b) 75%, #000) 40%, var(--abc-bump-ribbon-bg, #f59e0b) 60%, color-mix(in srgb, var(--abc-bump-ribbon-bg, #f59e0b) 75%, #000) 100%);
	background-size: 200% auto;
	animation: abc-bump-ribbon-shimmer 3s linear infinite;
	color: var(--abc-bump-ribbon-color, #fff);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .7px;
	text-transform: uppercase;
	text-align: center;
	padding: 7px 16px;
}

/* Product info row — no checkbox here */
.abc-checkout-boss-wrapper .abc-bump-body {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 14px 16px 10px;
}
.abc-checkout-boss-wrapper .abc-bump-image { width: 72px; height: 72px; border-radius: 8px; object-fit: cover; flex-shrink: 0; box-shadow: 0 2px 8px rgba(0,0,0,.12); }

.abc-checkout-boss-wrapper .abc-bump-text { flex: 1; }
.abc-checkout-boss-wrapper .abc-bump-title { display: block; font-weight: 700; font-size: 15px; color: var(--abc-bump-title-color, #1a1a2e); margin-bottom: 4px; }
.abc-checkout-boss-wrapper .abc-bump-desc { margin: 0 0 8px; font-size: var(--abc-bump-font-size, 13px); color: var(--abc-bump-desc-color, #6b7280); line-height: 1.45; }

/* Price row: offer price + strikethrough + badge */
.abc-checkout-boss-wrapper .abc-bump-price-row { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.abc-checkout-boss-wrapper .abc-bump-offer-price { font-weight: 800; color: var(--abc-bump-price-color, #d97706); font-size: 17px; }
.abc-checkout-boss-wrapper .abc-bump-regular-price { font-size: 12px; color: #9ca3af; text-decoration: line-through; }
.abc-checkout-boss-wrapper .abc-bump-save-badge {
	display: inline-flex; align-items: center;
	background: var(--abc-bump-price-color, #d97706); color: #fff;
	font-size: 10px; font-weight: 700; letter-spacing: .4px;
	padding: 2px 7px; border-radius: 20px;
}

/* CTA bar — IS the label wrapping the real checkbox. Prefixed to beat theme/WC label rules. */
.abc-checkout-boss-wrapper .abc-bump-cta-bar {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 10px 16px;
	background: color-mix(in srgb, var(--abc-bump-ribbon-bg, #f59e0b) 12%, transparent);
	border-top: 1px solid color-mix(in srgb, var(--abc-bump-ribbon-bg, #f59e0b) 25%, transparent);
	font-size: var(--abc-bump-font-size, 13px);
	font-weight: 700;
	color: var(--abc-bump-cta-color, #92400e);
	cursor: pointer;
	animation: abc-bump-cta-pulse 2s ease-in-out infinite;
	width: 100%;
	box-sizing: border-box;
	line-height: 1;
	vertical-align: baseline;
	text-align: center;
}
.abc-checkout-boss-wrapper .abc-bump-cta-bar .abc-bump-checkbox {
	width: 18px;
	height: 18px;
	min-width: 18px;
	accent-color: #f59e0b;
	cursor: pointer;
	margin: 0;
	flex-shrink: 0;
}
.abc-checkout-boss-wrapper .abc-bump-cta-text { line-height: 1.2; }

/* ── Bump qty stepper row ── */
.abc-checkout-boss-wrapper .abc-bump-qty-row {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 10px;
	padding-top: 8px;
	border-top: 1px solid color-mix(in srgb, var(--abc-bump-border, #f59e0b) 30%, transparent);
	justify-content: space-between;
}
.abc-checkout-boss-wrapper .abc-bump-line-total {
	font-size: 15px;
	font-weight: 800;
	color: var(--abc-bump-price-color, #d97706);
	white-space: nowrap;
	margin-left: auto;
}
.abc-checkout-boss-wrapper .abc-bump-qty-label {
	font-size: 12px;
	font-weight: 600;
	color: var(--abc-bump-cta-color, #92400e);
	white-space: nowrap;
}
.abc-checkout-boss-wrapper .abc-bump-qty-row .abc-qty-stepper {
	border-color: color-mix(in srgb, var(--abc-bump-border, #f59e0b) 60%, #888);
}
.abc-checkout-boss-wrapper .abc-bump-qty-row .abc-qty-btn {
	width: 26px !important;
	height: 26px !important;
}
.abc-checkout-boss-wrapper .abc-bump-qty-row .abc-qty-num {
	min-width: 28px;
	height: 26px;
	border-color: color-mix(in srgb, var(--abc-bump-border, #f59e0b) 60%, #888);
}

.abc-checkout-boss-wrapper .abc-order-bump.abc-bump-active {
	background: color-mix(in srgb, var(--abc-bump-bg, #fff9f0) 60%, var(--abc-bump-border, #f59e0b) 40%);
	border-style: solid;
	border-color: color-mix(in srgb, var(--abc-bump-border, #f59e0b) 80%, #000);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--abc-bump-border, #f59e0b) 20%, transparent), 0 6px 24px color-mix(in srgb, var(--abc-bump-border, #f59e0b) 20%, transparent);
	animation: none;
}
.abc-checkout-boss-wrapper .abc-order-bump.abc-bump-active .abc-bump-cta-bar {
	background: color-mix(in srgb, var(--abc-bump-ribbon-bg, #f59e0b) 20%, transparent);
	animation: none;
}

/* ── Shipping Methods Section ── */
.abc-shipping-methods-section {
	background: #fff;
	border-radius: var(--abc-radius);
	padding: var(--abc-spacing);
	margin-bottom: var(--abc-spacing);
	border: var(--abc-input-border);
}

.abc-shipping-methods-list { list-style: none !important; margin: 0 !important; padding: 0 !important; }

.abc-shipping-methods-list li {
	border: 2px solid #e5e7eb !important;
	border-radius: 8px !important;
	margin-bottom: 10px !important;
	overflow: hidden;
	transition: border-color .2s, background .2s;
	background: #fff !important;
	padding: 0 !important;
	list-style: none !important;
}

.abc-shipping-methods-list li::before,
.abc-shipping-methods-list li::after { display: none !important; content: none !important; }

.abc-shipping-methods-list li:has(input[type="radio"]:checked) {
	border-color: var(--abc-payment-active) !important;
	background: color-mix(in srgb, var(--abc-payment-active) 6%, #fff) !important;
}

.abc-shipping-methods-list li label {
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	padding: 14px 16px !important;
	cursor: pointer !important;
	font-weight: 600 !important;
	font-size: 15px !important;
	width: 100% !important;
	margin: 0 !important;
	color: #1a1a2e !important;
	letter-spacing: normal !important;
	text-transform: none !important;
}

.abc-shipping-methods-list li label input[type="radio"] {
	-webkit-appearance: none !important;
	appearance: none !important;
	width: 18px !important;
	height: 18px !important;
	min-width: 18px !important;
	border: 2px solid #d1d5db !important;
	border-radius: 50% !important;
	background: #fff !important;
	cursor: pointer !important;
	margin: 0 !important;
	padding: 0 !important;
	flex-shrink: 0 !important;
	box-shadow: none !important;
	outline: none !important;
	transition: border-color .2s, background .2s !important;
}

.abc-shipping-methods-list li label input[type="radio"]:checked {
	border-color: var(--abc-payment-active) !important;
	background: var(--abc-payment-active) !important;
	box-shadow: none !important;
}

.abc-ship-cost {
	margin-left: auto !important;
	color: var(--abc-price-color) !important;
	font-weight: 700 !important;
}

/* ── Payment Section ── */
/* Visual styling now comes from the shared .abc-section class (has !important guards).
   This rule keeps the payment-specific border variable and ensures correct margin. */
.abc-payment-section {
	border: var(--abc-payment-border) !important;
	margin-bottom: var(--abc-spacing) !important;
}

/* Radio is INSIDE <label> (matches builder.js preview structure).
   <li> is a simple block; <label> flex-row handles the radio+title layout.
   .payment_box sits below the label as a block child of <li>. */

.abc-checkout-boss-wrapper .payment_methods > li.wc_payment_method {
	display: block !important;
	padding: 0 !important;
}

.abc-checkout-boss-wrapper .payment_methods > li.wc_payment_method > .payment_box {
	width: 100% !important;
}

/* Override WooCommerce payment method styles inside our wrapper */
.abc-checkout-boss-wrapper .payment_methods { list-style: none !important; margin: 0 !important; padding: 0 !important; }

.abc-checkout-boss-wrapper .payment_methods li {
	border: 2px solid #e5e7eb !important;
	border-radius: 8px !important;
	margin-bottom: 10px !important;
	overflow: hidden;
	transition: border-color .2s, background .2s;
	background: #fff !important;
	padding: 0 !important;
	list-style: none !important;
}

.abc-checkout-boss-wrapper .payment_methods li::before,
.abc-checkout-boss-wrapper .payment_methods li::after {
	display: none !important;
	content: none !important;
}

.abc-checkout-boss-wrapper .payment_methods li:has(input[type="radio"]:checked) {
	border-color: var(--abc-payment-active) !important;
	background: color-mix(in srgb, var(--abc-payment-active) 6%, #fff) !important;
}

.abc-checkout-boss-wrapper .payment_methods li label {
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	padding: 14px 16px !important;
	cursor: pointer !important;
	font-weight: 600 !important;
	font-size: 15px !important;
	width: 100% !important;
	margin: 0 !important;
	color: #1a1a2e !important;
	letter-spacing: normal !important;
	text-transform: none !important;
}

.abc-checkout-boss-wrapper .payment_methods li label img {
	max-height: 24px !important;
	width: auto !important;
}

.abc-checkout-boss-wrapper .payment_methods li input[type="radio"] {
	-webkit-appearance: none !important;
	appearance: none !important;
	width: 18px !important;
	height: 18px !important;
	min-width: 18px !important;
	border: 2px solid #d1d5db !important;
	border-radius: 50% !important;
	background: #fff !important;
	cursor: pointer !important;
	margin: 0 !important;
	padding: 0 !important;
	flex-shrink: 0 !important;
	box-shadow: none !important;
	outline: none !important;
	transition: border-color .2s, background .2s !important;
}

.abc-checkout-boss-wrapper .payment_methods li input[type="radio"]:checked {
	border-color: var(--abc-payment-active) !important;
	background: var(--abc-payment-active) !important;
	box-shadow: none !important;
}

.abc-checkout-boss-wrapper .payment_box {
	padding: 12px 16px 14px !important;
	background: #f9fafb !important;
	border-top: 1px solid #e5e7eb !important;
	font-size: 14px !important;
	color: #6b7280 !important;
	margin: 0 !important;
}

.abc-checkout-boss-wrapper .woocommerce-checkout-payment { margin: 0 !important; }
.abc-checkout-boss-wrapper .woocommerce-checkout-payment .form-row.place-order { display: none !important; }
.abc-checkout-boss-wrapper #place_order { display: none !important; }

/* ── Order Summary ── */
.abc-order-summary {
	background: var(--abc-summary-bg);
	border-radius: var(--abc-radius);
	padding: var(--abc-spacing);
	border: var(--abc-input-border);
}

.abc-order-summary-below { margin-top: var(--abc-spacing); }

.abc-summary-product { margin-bottom: 0; }
.abc-summary-placeholder { color: #9ca3af; font-size: 14px; text-align: center; padding: 20px 0; }

.abc-summary-totals { display: flex; flex-direction: column; }

/* ── Savings badge (matches admin preview pill exactly) ── */
@keyframes abc-savings-pulse {
	0%   { transform: scale(1);    box-shadow: 0 0 0 0 rgba(22,163,74,.45); }
	50%  { transform: scale(1.03); box-shadow: 0 0 0 6px rgba(22,163,74,0); }
	100% { transform: scale(1);    box-shadow: 0 0 0 0 rgba(22,163,74,0); }
}

.abc-summary-savings-badge {
	display: inline-block;
	margin-top: 5px;
	padding: 3px 8px;
	background: #dcfce7;
	color: #15803d;
	font-size: 11px;
	font-weight: 700;
	border-radius: 20px;
	border: 1px solid #bbf7d0;
	letter-spacing: .02em;
	white-space: nowrap;
	animation: abc-savings-pulse 1.6s ease-in-out infinite;
}

/* ── Notices ── */
.abc-checkout-notices {
	margin-top: 16px;
}

.abc-notice {
	padding: 12px 16px;
	border-radius: 6px;
	font-size: 14px;
	margin-bottom: 8px;
}

.abc-notice-error { background: #fee2e2; color: #991b1b; border-left: 4px solid #dc2626; }
.abc-notice-success { background: #d1fae5; color: #065f46; border-left: 4px solid #10b981; }

/* WooCommerce notices inside our wrapper */
.abc-checkout-boss-wrapper .woocommerce-error,
.abc-checkout-boss-wrapper .woocommerce-message,
.abc-checkout-boss-wrapper .woocommerce-info {
	padding: 12px 16px;
	border-radius: 6px;
	margin: 8px 0;
	font-size: 14px;
}

.abc-checkout-boss-wrapper .woocommerce-error { background: #fee2e2; color: #991b1b; border-left: 4px solid #dc2626; }
.abc-checkout-boss-wrapper .woocommerce-message { background: #d1fae5; color: #065f46; border-left: 4px solid #10b981; }

/* ── Custom Field: Radio Options (card-style) ── */
.abc-radio-options {
	display: flex;
	flex-direction: column;
	gap: 8px;
	width: 100%;
	padding: 2px 0;
}

.abc-checkout-boss-wrapper .abc-radio-options .abc-radio-label {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	padding: 11px 14px !important;
	border: 2px solid #e5e7eb !important;
	border-radius: 10px !important;
	cursor: pointer !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	color: #374151 !important;
	background: #fff !important;
	transition: border-color .15s ease, background .15s ease, box-shadow .15s ease !important;
	margin: 0 !important;
	width: 100% !important;
	box-sizing: border-box !important;
	line-height: 1.4 !important;
}

.abc-checkout-boss-wrapper .abc-radio-options .abc-radio-label:hover {
	border-color: var(--abc-input-focus, #6d4aff) !important;
	background: color-mix(in srgb, var(--abc-input-focus, #6d4aff) 5%, #fff) !important;
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--abc-input-focus, #6d4aff) 10%, transparent) !important;
}

/* Suppress WordPress admin forms.min.css ::before dot on radio inputs */
.abc-checkout-boss-wrapper .abc-radio-options .abc-radio-label input[type="radio"]::before {
	display: none !important;
	content: none !important;
}

.abc-checkout-boss-wrapper .abc-radio-options .abc-radio-label input[type="radio"] {
	-webkit-appearance: none !important;
	appearance: none !important;
	width: 18px !important;
	height: 18px !important;
	min-width: 18px !important;
	border: 2px solid #d1d5db !important;
	border-radius: 50% !important;
	background: #fff !important;
	cursor: pointer !important;
	margin: 0 !important;
	padding: 0 !important;
	flex-shrink: 0 !important;
	box-shadow: none !important;
	transition: border-color .2s, background .2s !important;
	position: relative !important;
	display: block !important;
}

.abc-checkout-boss-wrapper .abc-radio-options .abc-radio-label input[type="radio"]:checked {
	border-color: var(--abc-input-focus, #6d4aff) !important;
	background: var(--abc-input-focus, #6d4aff) !important;
	box-shadow: none !important;
}

.abc-checkout-boss-wrapper .abc-radio-options .abc-radio-label input[type="radio"]::after {
	content: '' !important;
	display: block !important;
	width: 6px !important;
	height: 6px !important;
	border-radius: 50% !important;
	background: transparent !important;
	position: absolute !important;
	top: 50% !important;
	left: 50% !important;
	transform: translate(-50%, -50%) !important;
	transition: background .15s !important;
}

.abc-checkout-boss-wrapper .abc-radio-options .abc-radio-label input[type="radio"]:checked::after {
	background: #fff !important;
}

.abc-checkout-boss-wrapper .abc-radio-options .abc-radio-label:has(input[type="radio"]:checked) {
	border-color: var(--abc-input-focus, #6d4aff) !important;
	background: color-mix(in srgb, var(--abc-input-focus, #6d4aff) 7%, #fff) !important;
	color: var(--abc-input-focus, #6d4aff) !important;
}

.abc-radio-empty-hint {
	font-size: 12px !important;
	color: #9ca3af !important;
	font-style: italic !important;
	margin: 0 !important;
	padding: 6px 0 !important;
}

/* ── Custom Field: Checkbox (card-style) ── */
.abc-checkout-boss-wrapper .abc-checkbox-label {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	padding: 11px 14px !important;
	border: 2px solid #e5e7eb !important;
	border-radius: 10px !important;
	cursor: pointer !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	color: #374151 !important;
	background: #fff !important;
	transition: border-color .15s ease, background .15s ease, box-shadow .15s ease !important;
	width: 100% !important;
	box-sizing: border-box !important;
	line-height: 1.4 !important;
}

.abc-checkout-boss-wrapper .abc-checkbox-label:hover {
	border-color: var(--abc-input-focus, #6d4aff) !important;
	background: color-mix(in srgb, var(--abc-input-focus, #6d4aff) 5%, #fff) !important;
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--abc-input-focus, #6d4aff) 10%, transparent) !important;
}

/* Suppress WordPress admin forms.min.css ::before on checkbox inputs */
.abc-checkout-boss-wrapper .abc-checkbox-label input[type="checkbox"]::before {
	display: none !important;
	content: none !important;
}

.abc-checkout-boss-wrapper .abc-checkbox-label input[type="checkbox"] {
	-webkit-appearance: none !important;
	appearance: none !important;
	width: 18px !important;
	height: 18px !important;
	min-width: 18px !important;
	border: 2px solid #d1d5db !important;
	border-radius: 5px !important;
	background: #fff !important;
	cursor: pointer !important;
	margin: 0 !important;
	padding: 0 !important;
	flex-shrink: 0 !important;
	transition: border-color .2s, background .2s !important;
	position: relative !important;
	display: block !important;
}

.abc-checkout-boss-wrapper .abc-checkbox-label input[type="checkbox"]:checked {
	border-color: var(--abc-input-focus, #6d4aff) !important;
	background: var(--abc-input-focus, #6d4aff) !important;
}

.abc-checkout-boss-wrapper .abc-checkbox-label input[type="checkbox"]:checked::after {
	content: '' !important;
	display: block !important;
	width: 5px !important;
	height: 9px !important;
	border: 2px solid #fff !important;
	border-top: none !important;
	border-left: none !important;
	position: absolute !important;
	top: 45% !important;
	left: 50% !important;
	transform: translate(-50%, -50%) rotate(45deg) !important;
}

.abc-checkout-boss-wrapper .abc-checkbox-label:has(input[type="checkbox"]:checked) {
	border-color: var(--abc-input-focus, #6d4aff) !important;
	background: color-mix(in srgb, var(--abc-input-focus, #6d4aff) 7%, #fff) !important;
	color: var(--abc-input-focus, #6d4aff) !important;
}

/* ── Preview builder — field label (not admin sidebar item label) ── */
.abc-preview-field-label {
	display: block !important;
	font-size: var(--abc-label-size, 13px) !important;
	font-weight: 500 !important;
	color: var(--abc-label-color, #374151) !important;
	margin-bottom: 6px !important;
	white-space: normal !important;
	overflow: visible !important;
	text-overflow: clip !important;
}

/* ── Thank You Page — Animations ── */
@keyframes abcTyPop {
	0%   { transform: scale(0) rotate(-10deg); opacity: 0; }
	70%  { transform: scale(1.15) rotate(3deg); }
	100% { transform: scale(1) rotate(0); opacity: 1; }
}
@keyframes abcTyFadeUp {
	from { opacity: 0; transform: translateY(14px); }
	to   { opacity: 1; transform: translateY(0); }
}
@keyframes abcTyConf1 {
	0%,100% { transform: translate(0,0) rotate(0deg); }
	50%     { transform: translate(8px,-16px) rotate(180deg); }
}
@keyframes abcTyConf2 {
	0%,100% { transform: translate(0,0) rotate(0deg); }
	50%     { transform: translate(-10px,-18px) rotate(-140deg); }
}
@keyframes abcTyConf3 {
	0%,100% { transform: translate(0,0) rotate(0deg); }
	50%     { transform: translate(6px,-10px) rotate(90deg); }
}

/* ── Thank You Page ─────────────────────────────────────────────────────── */
.abc-thankyou-wrapper {
	/* Break out of narrow WC page content columns so container_width setting takes effect */
	position: relative;
	left: 50%;
	transform: translateX(-50%);
	width: 100vw;
	/* max-width is always set via inline style from container_width Design-tab setting */
	padding: 24px 16px 40px;
	background: var(--abc-bg, #f0f2f8);
	border-radius: var(--abc-radius, 16px);
	font-family: var(--abc-font-family, inherit);
	font-size: var(--abc-font-size, 15px);
	box-sizing: border-box;
}

/* (Hero styles are defined below, after the card-block rule, for correct specificity order) */

/* ── Card blocks ── */
.abc-thankyou-wrapper .abc-ty-block {
	background: #fff !important;
	border-radius: 12px !important;
	padding: 16px 18px !important;
	margin-bottom: 12px !important;
	box-shadow: 0 1px 6px rgba(0,0,0,.07) !important;
	display: flex !important;
	align-items: flex-start !important;
	gap: 14px !important;
	box-sizing: border-box !important;
	border: none !important;
}
/* Hero: specificity 0,3,0 beats the card rule's 0,2,0, AND comes after it — wins both battles */
.abc-thankyou-wrapper .abc-ty-block.abc-ty-hero {
	background: linear-gradient(135deg, var(--abc-primary,#6d4aff) 0%, #a855f7 55%, #ec4899 100%) !important;
	border-radius: 18px !important;
	padding: 44px 24px 40px !important;
	text-align: center !important;
	margin-bottom: 16px !important;
	color: #fff !important;
	position: relative !important;
	overflow: hidden !important;
	box-shadow: 0 8px 32px color-mix(in srgb, var(--abc-primary,#6d4aff) 35%, transparent) !important;
	display: block !important;
	align-items: unset !important;
	gap: 0 !important;
}
.abc-ty-hero-icon {
	width: 72px; height: 72px;
	background: rgba(255,255,255,.18);
	border: 3px solid rgba(255,255,255,.4);
	border-radius: 50%;
	display: inline-flex; align-items: center; justify-content: center;
	font-size: 34px;
	animation: abcTyPop .7s cubic-bezier(.175,.885,.32,1.275) both;
	margin-bottom: 18px;
}
.abc-ty-hero-title {
	font-size: 28px; font-weight: 900; letter-spacing: -.5px; color: #fff;
	animation: abcTyFadeUp .5s ease .2s both;
}
.abc-ty-hero-sub {
	font-size: 15px; font-weight: 600; margin-top: 8px; opacity: .9; color: #fff;
	animation: abcTyFadeUp .5s ease .4s both;
}
.abc-ty-confetti { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.abc-ty-confetti span { position: absolute; border-radius: 50%; }

/* Special blocks that are not flex cards */
.abc-thankyou-wrapper .abc-ty-follow-up-message,
.abc-thankyou-wrapper .abc-ty-social-links {
	display: block !important;
	background: transparent !important;
	box-shadow: none !important;
	padding: 0 !important;
	gap: 0 !important;
	align-items: unset !important;
}

.abc-ty-card-icon {
	font-size: 20px !important;
	flex-shrink: 0 !important;
	margin-top: 2px !important;
	line-height: 1 !important;
}
.abc-ty-card-body {
	flex: 1 !important;
	min-width: 0 !important;
}
.abc-ty-card-label {
	font-size: 13px !important;
	color: #6b7280 !important;
	margin: 0 0 3px !important;
	font-weight: 500 !important;
	line-height: 1.4 !important;
	display: block !important;
}
.abc-ty-card-value {
	font-size: 15px !important;
	font-weight: 600 !important;
	color: #1a1a2e !important;
	margin: 0 !important;
	line-height: 1.4 !important;
}
.abc-ty-primary { color: var(--abc-primary, #6d4aff) !important; }

/* ── Products block ── */
.abc-thankyou-wrapper .abc-ty-products-heading {
	font-size: 14px !important;
	font-weight: 700 !important;
	color: #1a1a2e !important;
	margin: 0 0 10px !important;
}
/* Wrapper gives the table a rounded bordered frame, matching the preview */
.abc-thankyou-wrapper .abc-ty-table-wrap {
	border: 1px solid #e5e7eb !important;
	border-radius: 8px !important;
	overflow: hidden !important;
}
.abc-thankyou-wrapper .abc-ty-product-table {
	width: 100% !important;
	border-collapse: collapse !important;
	font-size: 13px !important;
	table-layout: fixed !important;
	background: #fff !important;
	box-shadow: none !important;
	margin: 0 !important;
}
.abc-thankyou-wrapper .abc-ty-product-table th,
.abc-thankyou-wrapper .abc-ty-product-table td {
	padding: 10px 12px !important;
	text-align: left !important;
	border-bottom: 1px solid #e5e7eb !important;
	border-left: none !important;
	border-right: none !important;
	border-top: none !important;
	word-break: break-word !important;
	line-height: 1.4 !important;
	vertical-align: middle !important;
	box-shadow: none !important;
}
/* Remove bottom border on the very last row */
.abc-thankyou-wrapper .abc-ty-product-table tbody tr:last-child td { border-bottom: none !important; }
.abc-thankyou-wrapper .abc-ty-product-table th {
	font-weight: 600 !important;
	background: #f9fafb !important;
	color: #374151 !important;
	font-size: 12px !important;
	text-transform: uppercase !important;
	letter-spacing: .4px !important;
}
/* Zebra striping */
.abc-thankyou-wrapper .abc-ty-product-table tbody tr:nth-child(even) td { background: #fafafa !important; }
/* Column alignment */
.abc-thankyou-wrapper .abc-ty-product-table .abc-ty-center { text-align: center !important; }
.abc-thankyou-wrapper .abc-ty-product-table .abc-ty-right  { text-align: right !important; }

/* ── Total rows ── */
.abc-ty-total-row {
	display: flex !important;
	justify-content: space-between !important;
	font-size: 14px !important;
	color: #374151 !important;
	margin: 0 !important;
}
.abc-ty-grand-total-row {
	display: flex !important;
	justify-content: space-between !important;
	font-size: 17px !important;
	font-weight: 800 !important;
	border-top: 2px solid #e5e7eb !important;
	padding-top: 12px !important;
	margin-top: 4px !important;
	color: #1a1a2e !important;
}
.abc-ty-discount-val { color: #059669 !important; }

/* ── Billing / Shipping address ── */
.abc-ty-address {
	font-size: 13px !important;
	color: #6b7280 !important;
	line-height: 1.8 !important;
	font-style: normal !important;
	margin: 0 !important;
}

/* ── Billing Details rows ── */
.abc-ty-billing-rows {
	display: flex !important;
	flex-direction: column !important;
	gap: 0 !important;
	margin-top: 6px !important;
}
.abc-ty-billing-row {
	display: flex !important;
	gap: 10px !important;
	padding: 7px 0 !important;
	border-bottom: 1px solid #f3f4f6 !important;
	font-size: 13px !important;
	color: #374151 !important;
	align-items: flex-start !important;
}
.abc-ty-billing-row:last-child {
	border-bottom: none !important;
}
.abc-ty-billing-label {
	min-width: 110px !important;
	flex-shrink: 0 !important;
	color: #6b7280 !important;
	font-weight: 600 !important;
}
.abc-ty-billing-value {
	color: #111827 !important;
	word-break: break-word !important;
}

/* ── Follow Up Message ── */
.abc-ty-follow-up-message { margin-bottom: 12px !important; }
.abc-ty-follow-up-inner {
	display: flex !important; align-items: flex-start !important; gap: 14px !important;
	background: linear-gradient(135deg,#fffbeb,#fef3c7) !important;
	border: 1.5px solid #fcd34d !important;
	border-radius: 12px !important;
	padding: 16px 18px !important;
}
.abc-ty-follow-up-icon { font-size: 22px !important; flex-shrink: 0 !important; margin-top: 2px !important; line-height: 1 !important; }
.abc-ty-follow-up-inner p {
	margin: 0 !important;
	font-size: 14px !important; line-height: 1.7 !important;
	color: #92400e !important; font-weight: 500 !important;
}

/* ── Social Links ── */
.abc-ty-social-links { margin-bottom: 12px !important; text-align: center !important; }
.abc-ty-social-title {
	font-size: 13px !important; font-weight: 700 !important; text-transform: uppercase !important;
	letter-spacing: .8px !important; color: #374151 !important; margin-bottom: 14px !important;
}
.abc-ty-social-icons { display: flex !important; justify-content: center !important; gap: 10px !important; flex-wrap: wrap !important; }
.abc-ty-social-icon {
	display: inline-flex !important; align-items: center !important; justify-content: center !important;
	width: 48px !important; height: 48px !important; border-radius: 50% !important;
	color: #fff !important; font-size: 16px !important; font-weight: 900 !important;
	text-decoration: none !important; transition: transform .2s, box-shadow .2s !important;
	box-shadow: 0 2px 10px rgba(0,0,0,.18) !important;
}
.abc-ty-social-icon:hover { transform: scale(1.12) !important; box-shadow: 0 4px 18px rgba(0,0,0,.22) !important; }
.abc-ty-social-abbr { line-height: 1 !important; }
.abc-ty-social-fb-page  { background: #1877f2 !important; }
.abc-ty-social-fb-group { background: #1877f2 !important; }
.abc-ty-social-youtube  { background: #ff0000 !important; }
.abc-ty-social-whatsapp { background: #25d366 !important; }
.abc-ty-social-instagram { background: linear-gradient(45deg,#fd5949 0%,#d6249f 50%,#285AEB 100%) !important; }
.abc-ty-social-tiktok   { background: #010101 !important; }

/* ── Downloads block ── */
@keyframes abcDownloadBlockEntrance {
	0%   { opacity: 0; transform: translateY(-10px) scale(0.98); }
	100% { opacity: 1; transform: translateY(0)     scale(1);    }
}
@keyframes abcDownloadGlow {
	0%,100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--abc-primary,#6d4aff) 0%, transparent),
	                      0 2px 12px rgba(0,0,0,.06); }
	50%      { box-shadow: 0 0 0 6px color-mix(in srgb, var(--abc-primary,#6d4aff) 22%, transparent),
	                       0 4px 18px rgba(0,0,0,.10); }
}
@keyframes abcDownloadBtnPulse {
	0%,100% { box-shadow: 0 4px 14px color-mix(in srgb, var(--abc-primary,#6d4aff) 45%, transparent); transform: scale(1); }
	50%      { box-shadow: 0 6px 22px color-mix(in srgb, var(--abc-primary,#6d4aff) 65%, transparent); transform: scale(1.04); }
}
@keyframes abcDownloadArrowBounce {
	0%,100% { transform: translateY(0); }
	40%      { transform: translateY(3px); }
	70%      { transform: translateY(-2px); }
}

.abc-thankyou-wrapper .abc-ty-downloads {
	animation: abcDownloadBlockEntrance .5s ease both, abcDownloadGlow 2.4s ease-in-out 0.6s infinite !important;
	border: 2px solid color-mix(in srgb, var(--abc-primary,#6d4aff) 35%, transparent) !important;
	background: linear-gradient(135deg,
		color-mix(in srgb, var(--abc-primary,#6d4aff) 6%, white) 0%,
		#fff 100%) !important;
	position: relative !important;
}
.abc-thankyou-wrapper .abc-ty-downloads::before {
	content: '' !important;
	position: absolute !important;
	inset: -2px !important;
	border-radius: inherit !important;
	background: linear-gradient(135deg,
		var(--abc-primary,#6d4aff),
		color-mix(in srgb, var(--abc-primary,#6d4aff) 60%, #ff6bce)) !important;
	z-index: 0 !important;
	opacity: .18 !important;
	pointer-events: none !important;
}

.abc-ty-downloads-list {
	display: flex !important;
	flex-direction: column !important;
	gap: 10px !important;
	margin-top: 8px !important;
	position: relative !important;
	z-index: 1 !important;
}
.abc-ty-download-item {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 12px !important;
	background: #fff !important;
	border: 1px solid color-mix(in srgb, var(--abc-primary,#6d4aff) 25%, #e5e7eb) !important;
	border-radius: 8px !important;
	padding: 12px 14px !important;
}
.abc-ty-download-info {
	display: flex !important;
	flex-direction: column !important;
	gap: 2px !important;
	flex: 1 !important;
	min-width: 0 !important;
}
.abc-ty-download-name {
	font-size: 14px !important;
	font-weight: 600 !important;
	color: #111827 !important;
	word-break: break-word !important;
}
.abc-ty-download-meta {
	font-size: 12px !important;
	color: #6b7280 !important;
}
.abc-ty-download-btn {
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
	background: var(--abc-primary, #6d4aff) !important;
	color: #fff !important;
	padding: 9px 20px !important;
	border-radius: 6px !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	text-decoration: none !important;
	white-space: nowrap !important;
	flex-shrink: 0 !important;
	animation: abcDownloadBtnPulse 1.8s ease-in-out infinite !important;
	transition: background .2s, transform .15s !important;
}
.abc-ty-download-btn::before {
	content: '⬇' !important;
	display: inline-block !important;
	animation: abcDownloadArrowBounce 1.4s ease-in-out infinite !important;
	font-size: 12px !important;
}
.abc-ty-download-btn:hover {
	background: var(--abc-secondary, #4c2fe0) !important;
	color: #fff !important;
	text-decoration: none !important;
	animation: none !important;
	transform: scale(1.06) !important;
	box-shadow: 0 6px 22px color-mix(in srgb, var(--abc-primary,#6d4aff) 55%, transparent) !important;
}

/* ── Button block ── */
.abc-ty-button .abc-ty-card-body { text-align: center !important; }

.abc-thankyou-wrapper .abc-ty-button .abc-ty-btn,
.abc-ty-btn {
	display: inline-block !important;
	background: var(--abc-primary, #6d4aff) !important;
	color: #fff !important;
	padding: 12px 32px !important;
	border-radius: 8px !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	text-decoration: none !important;
	box-shadow: 0 4px 14px color-mix(in srgb, var(--abc-primary,#6d4aff) 45%, transparent) !important;
	transition: background .2s, box-shadow .2s !important;
	border: none !important;
	cursor: pointer !important;
}
.abc-ty-btn:hover {
	background: var(--abc-secondary, #4c2fe0) !important;
	color: #fff !important;
	box-shadow: 0 6px 20px color-mix(in srgb, var(--abc-primary,#6d4aff) 55%, transparent) !important;
	text-decoration: none !important;
}

/* ── FOMO Urgency Timers ────────────────────────────────────────────────── */
.abc-fomo-bar {
	background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
	color: #fff;
	text-align: center;
	padding: 11px 20px;
	border-radius: 10px 10px 0 0;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.2px;
	margin-bottom: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	flex-wrap: wrap;
	animation: abc-fomo-glow 3s ease-in-out infinite;
}
.abc-fomo-bar + .abc-product-section {
	border-top: none;
	border-radius: 0 0 12px 12px;
	margin-top: 0;
}
.abc-fomo-countdown {
	display: inline-block;
	background: rgba(239, 68, 68, 0.2);
	color: #fca5a5;
	font-family: 'Courier New', Courier, monospace;
	font-size: 1.15em;
	font-weight: 800;
	padding: 1px 8px;
	border-radius: 5px;
	border: 1px solid rgba(239, 68, 68, 0.35);
	min-width: 50px;
	text-align: center;
	animation: abc-fomo-tick 1s ease-in-out infinite;
}
@keyframes abc-fomo-glow {
	0%, 100% { box-shadow: 0 4px 20px rgba(239, 68, 68, 0.15); }
	50% { box-shadow: 0 4px 28px rgba(239, 68, 68, 0.35); }
}
@keyframes abc-fomo-tick {
	0%, 100% { transform: scale(1); }
	45% { transform: scale(1.06); }
}

/* — Product card inline timer — */
.abc-fomo-timer-inline {
	margin: 8px 0 2px;
	background: linear-gradient(90deg, #fff5f5, #fff9f0);
	border: 1px solid #fcd5b0;
	border-radius: 6px;
	padding: 5px 10px;
	font-size: 12px;
	font-weight: 600;
	color: #b45309;
	display: flex;
	align-items: center;
	gap: 5px;
	flex-wrap: wrap;
}
.abc-fomo-timer-inline .abc-fomo-countdown {
	font-size: 1em;
	color: #dc2626;
	background: rgba(220, 38, 38, 0.1);
	border-color: rgba(220, 38, 38, 0.25);
	padding: 0 5px;
	min-width: 42px;
}

/* — Order bump timer — */
.abc-fomo-bump-timer {
	background: linear-gradient(135deg, #fff7ed, #fffbeb);
	border: 1.5px solid #f59e0b;
	border-radius: 8px;
	padding: 9px 14px;
	margin: 10px 0 0;
	font-size: 13px;
	font-weight: 600;
	color: #92400e;
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
	box-shadow: 0 2px 8px rgba(245, 158, 11, 0.18);
	position: relative;
	overflow: hidden;
}
.abc-fomo-bump-timer::before {
	content: '⏱';
	font-size: 15px;
	flex-shrink: 0;
}
.abc-fomo-bump-timer .abc-fomo-timer-label {
	flex: 1;
	min-width: 0;
}
.abc-fomo-bump-timer .abc-fomo-countdown {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	background: #d97706;
	border: none;
	border-radius: 5px;
	font-size: 13px;
	font-weight: 700;
	padding: 2px 9px;
	letter-spacing: 0.5px;
	font-variant-numeric: tabular-nums;
	min-width: 52px;
	text-align: center;
	animation: abc-fomo-tick 1.5s ease-in-out infinite;
}

/* — Expired states — */
.abc-fomo-expired-badge {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	background: #fee2e2;
	color: #991b1b;
	padding: 2px 10px;
	border-radius: 20px;
	font-size: 12px;
	font-weight: 700;
	border: 1px solid #fca5a5;
}
.abc-fomo-bar.abc-fomo-expired {
	background: #4b5563;
	animation: none;
	box-shadow: none;
}
.abc-fomo-bar.abc-fomo-bar-hard-expired {
	background: linear-gradient(135deg, #7f1d1d, #991b1b);
	animation: none;
	box-shadow: 0 2px 12px rgba(153, 27, 27, 0.4);
	font-size: 13px;
}
.abc-fomo-timer-inline.abc-fomo-expired,
.abc-fomo-bump-timer.abc-fomo-expired {
	background: #f9fafb;
	border-color: #e5e7eb;
	color: #6b7280;
}
.abc-bump-fomo-expired {
	opacity: 0.55;
	pointer-events: none;
}
.abc-product-fomo-expired .abc-product-price,
.abc-product-fomo-expired .abc-line-price {
	text-decoration: line-through;
	opacity: 0.5;
}

/* ── Responsive product cards ──────────────────────────────────────────── */
@media (max-width: 480px) {
	.abc-products-grid { grid-template-columns: 1fr !important; row-gap: 28px; }
	.abc-product-card { padding: 12px; }
	.abc-product-thumb-wrap { width: 52px; height: 52px; }
	.abc-product-thumb { width: 52px; height: 52px; }
	.abc-product-name { font-size: 13px; }
	.abc-product-meta { font-size: 11px; }
	.abc-product-savings { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
	.abc-summary-savings-badge { white-space: nowrap; }
}

/* ── Responsive ──
   Both declarations below need !important: the base rules they override
   (.abc-checkout-boss-wrapper's padding at the top of this file, and each
   card's own padding on .abc-section etc.) are already !important, so a
   plain declaration here would silently lose and never apply. */
@media (max-width: 600px) {
	.abc-checkout-boss-wrapper {
		/* Break out of the theme/page-builder's narrow content column —
		   same technique .abc-thankyou-wrapper already uses — so the wrapper
		   spans the full device width instead of leaving large side gutters
		   on top of its own padding. */
		position: relative;
		left: 50%;
		transform: translateX(-50%);
		width: 100vw;
		padding: 16px !important;
	}
	.abc-section, .abc-product-section, .abc-order-summary, .abc-payment-section { padding: 16px !important; }
	.abc-checkout-boss-wrapper .abc-place-order-btn { font-size: 15px; }
	.abc-thankyou-wrapper { padding: 16px 12px 32px; border-radius: 0; }
}

/* ═══════════════════════════════════════════════════════
   BD COD Layout — packages in right column, form in left
   ═══════════════════════════════════════════════════════ */

.abc-bd-cod-layout {
	grid-template-columns: 1fr 380px;
}

/* Selected Package Box (top of left column) */
.abc-bd-selected-pkg {
	background: var(--abc-input-bg, #1e1e1e);
	border: 1.5px solid var(--abc-primary, #c9a227);
	border-radius: var(--abc-radius, 12px);
	padding: 14px 18px;
	margin-bottom: 20px;
}

.abc-bd-sel-label {
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--abc-label-color, #e0e0e0);
	opacity: .7;
	margin-bottom: 6px;
}

.abc-bd-sel-row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 8px;
}

.abc-bd-sel-name {
	font-size: 15px;
	font-weight: 600;
	color: var(--abc-label-color, #ffffff);
	flex: 1;
	min-width: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.abc-bd-sel-price {
	font-size: 18px;
	font-weight: 700;
	color: var(--abc-primary, #c9a227);
	flex-shrink: 0;
}

/* Right column: package cards stacked vertically */
.abc-bd-col-packages { display: flex; flex-direction: column; gap: 0; }

.abc-bd-col-packages .abc-product-section {
	background: var(--abc-section-bg, #1a1a1a) !important;
	border: none !important;
	padding: 20px !important;
	margin-bottom: 0 !important;
	border-radius: var(--abc-radius, 12px) var(--abc-radius, 12px) 0 0 !important;
}

.abc-bd-col-packages .abc-products-grid {
	grid-template-columns: 1fr !important;
}

.abc-bd-col-packages .abc-product-card {
	flex-direction: row;
	align-items: center;
}

.abc-bd-col-packages .abc-product-card-header {
	flex: 1;
}

/* Order summary attaches flush below package section */
.abc-bd-col-packages .abc-order-summary {
	border-radius: 0 0 var(--abc-radius, 12px) var(--abc-radius, 12px) !important;
	margin-top: 0 !important;
	border-top: 1px solid rgba(255,255,255,.06) !important;
}

/* COD note below confirm button */
.abc-bd-cod-note {
	text-align: center;
	font-size: 12px;
	color: var(--abc-label-color, #e0e0e0);
	opacity: .6;
	margin: 8px 0 0;
}

/* Guarantee box */
.abc-bd-guarantee {
	margin-top: 0 !important;
	border-radius: 0 0 var(--abc-radius, 12px) var(--abc-radius, 12px) !important;
	border-top: 1px solid rgba(255,255,255,.06) !important;
}

.abc-bd-guarantee-inner {
	display: flex;
	align-items: flex-start;
	gap: 12px;
}

.abc-bd-guarantee-icon { font-size: 22px; flex-shrink: 0; margin-top: 2px; }

.abc-bd-guarantee-text strong {
	display: block;
	font-size: 14px;
	font-weight: 600;
	color: var(--abc-label-color, #e0e0e0);
	margin-bottom: 4px;
}

.abc-bd-guarantee-text p {
	font-size: 12px;
	color: var(--abc-label-color, #e0e0e0);
	opacity: .65;
	margin: 0;
	line-height: 1.5;
}

@media (max-width: 768px) {
	.abc-bd-cod-layout { grid-template-columns: 1fr; }
	.abc-bd-col-packages { order: -1; }
	.abc-bd-col-packages .abc-product-section {
		border-radius: var(--abc-radius, 12px) !important;
	}
	.abc-bd-col-packages .abc-order-summary {
		border-radius: var(--abc-radius, 12px) !important;
		margin-top: var(--abc-spacing, 16px) !important;
	}
}

/* ── Free Gift (gift with purchase) ────────────────────────── */
/* Container block inside product cards / bump boxes: header + mini gift
   cards that mirror the order-summary gift rows. Also styles the builder
   live preview (checkout.css is loaded on the builder page). */
.abc-gift-included {
	margin-top: 10px;
	text-align: left;
}

.abc-gift-included-header {
	display: flex;
	align-items: center;
	gap: 5px;
	font-size: 12px;
	font-weight: 700;
	color: #166534;
	margin-bottom: 6px;
}

.abc-gift-included-icon {
	flex-shrink: 0;
	font-size: 13px;
	line-height: 1.3;
}

.abc-gift-mini-card {
	display: flex;
	align-items: center;
	gap: 8px;
	background: #f0fdf4;
	border: 1px solid #bbf7d0;
	border-radius: 8px;
	padding: 7px 9px;
	margin-bottom: 6px;
}

.abc-gift-mini-card:last-child { margin-bottom: 0; }

.abc-gift-mini-img {
	width: 38px;
	height: 38px;
	border-radius: 6px;
	object-fit: cover;
	flex-shrink: 0;
}

.abc-gift-mini-info {
	flex: 1;
	min-width: 0;
}

.abc-gift-mini-name {
	font-size: 12px;
	font-weight: 700;
	color: #166534;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.abc-gift-mini-price {
	font-size: 11px;
	margin-top: 1px;
}

.abc-gift-mini-price s { color: #9ca3af; }

.abc-gift-mini-price .abc-gift-zero {
	color: #16a34a;
	font-weight: 700;
}

.abc-gift-mini-badge {
	flex-shrink: 0;
	font-size: 10px;
	font-weight: 800;
	color: #fff;
	background: #16a34a;
	border-radius: 20px;
	padding: 2px 8px;
	letter-spacing: .5px;
}

.abc-order-bump .abc-gift-included { margin-top: 8px; }

@media (max-width: 480px) {
	.abc-gift-mini-name { font-size: 11px; }
	.abc-gift-mini-img { width: 32px; height: 32px; }
}

/* ── Thank You: license/serial keys block ──────────────────── */
.abc-ty-license-keys { margin-top: 8px; overflow-x: auto; }
.abc-ty-license-keys table { width: 100%; border-collapse: collapse; font-size: 13px; }
.abc-ty-license-keys th,
.abc-ty-license-keys td { padding: 8px 10px; border-bottom: 1px solid #e5e7eb; text-align: left; }
.abc-ty-license-keys code,
.abc-ty-license-keys .wcsn-key {
	font-family: monospace;
	font-weight: 700;
	letter-spacing: .5px;
	background: #f9fafb;
	border: 1px dashed #d1d5db;
	border-radius: 6px;
	padding: 3px 8px;
	display: inline-block;
}
.abc-ty-license-keys h2,
.abc-ty-license-keys h3 { font-size: 14px; margin: 0 0 8px; }