/**
 * CommerceWp Core: checkout and order received.
 * Values follow the reference design (_design/Barir Bazar Checkout.dc.html).
 * Markup comes from the theme's WooCommerce overrides in woocommerce/checkout/.
 */

:root {
	--bbo-green: var(--commercewp-green, #041f1e);
	--bbo-green-hover: #0c3533;
	--bbo-gold: var(--commercewp-gold, #a98554);
	--bbo-gold-text: var(--commercewp-gold-text, #7a5c33);
	--bbo-gold-light: var(--commercewp-gold-light, #d9be8f);
	--bbo-sand: var(--commercewp-sand, #f3ebdd);
	--bbo-cream: var(--commercewp-cream, #fbf7f0);
	--bbo-white: var(--commercewp-white, #fff);
	--bbo-text: #2c3330;
	--bbo-muted: var(--commercewp-text-muted, #4a524f);
	--bbo-soft: var(--commercewp-text-soft, #5a615e);
	--bbo-strike: var(--commercewp-text-strike, #6b716e);
	--bbo-border: var(--commercewp-border, #ece2d0);
	--bbo-border-strong: var(--commercewp-border-strong, #e3d6bf);
	--bbo-border-card: var(--commercewp-border-card, #efe6d6);
	--bbo-border-button: var(--commercewp-border-button, #d9c9ac);
	--bbo-red: var(--commercewp-red, #c8432e);
	--bbo-success: var(--commercewp-success, #1f6b4a);
	--bbo-heading: var(--commercewp-font-heading, "Cormorant Garamond", Georgia, serif);
}

/* ---------- Heading + steps ---------- */

.commercewp-cohead {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding-top: clamp(18px, 3vw, 36px);
}

.commercewp-cohead__row {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px 32px;
}

.commercewp-cohead .commercewp-cohead__title {
	margin: 0;
	color: var(--bbo-green);
	font-family: var(--bbo-heading);
	font-size: clamp(34px, 4.4vw, 54px);
	font-weight: 600;
	line-height: 1.04;
}

.commercewp-costeps {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 13px;
	font-weight: 500;
}

.commercewp-costeps__item {
	display: flex;
	align-items: center;
	gap: 8px;
	color: var(--bbo-strike);
}

.commercewp-costeps__dot {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border: 1px solid var(--bbo-border-button);
	border-radius: 50%;
	font-size: 12px;
}

.commercewp-costeps__item.is-done {
	color: var(--bbo-gold-text);
}

.commercewp-costeps__item.is-done .commercewp-costeps__dot {
	border-color: var(--bbo-gold);
	background: var(--bbo-gold);
	color: var(--bbo-green);
	font-size: 16px;
}

.commercewp-costeps__item.is-current {
	color: var(--bbo-green);
}

.commercewp-costeps__item.is-current .commercewp-costeps__dot {
	border-color: var(--bbo-green);
	background: var(--bbo-green);
	color: var(--bbo-gold-light);
}

.commercewp-costeps__line {
	width: 32px;
	height: 2px;
	background: var(--bbo-border-strong);
}

.commercewp-costeps__line.is-done {
	background: var(--bbo-gold);
}

.commercewp-cobody {
	padding-block: clamp(20px, 3vw, 32px) clamp(56px, 8vw, 96px);
}

/* ---------- Layout ---------- */

.woocommerce form.commercewp-co,
form.commercewp-co {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	align-items: start;
	gap: clamp(20px, 3vw, 36px);
	margin: 0;
}

.commercewp-co__main {
	display: flex;
	flex-direction: column;
	gap: clamp(16px, 2vw, 24px);
	min-width: 0;
}

.commercewp-co__side,
.commercewp-co__side #order_review {
	display: flex;
	flex-direction: column;
	gap: 16px;
	min-width: 0;
}

.woocommerce .commercewp-co #order_review,
.woocommerce .commercewp-co #customer_details {
	float: none;
	width: auto;
}

/* Card. */
.commercewp-co-card,
.woocommerce .commercewp-co #payment.commercewp-co-card {
	display: flex;
	flex-direction: column;
	gap: 18px;
	padding: clamp(20px, 2.6vw, 32px);
	border: 1px solid var(--bbo-border-card);
	border-radius: 20px;
	background: var(--bbo-white);
	box-shadow: 0 10px 28px -20px rgba(4, 31, 30, 0.2);
}

.commercewp-co .commercewp-co-card__title {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0;
	color: var(--bbo-green);
	font-family: inherit;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.4;
}

.commercewp-co-card__num {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--bbo-green);
	color: var(--bbo-gold-light);
	font-size: 14px;
}

/* ---------- Fields ---------- */

.commercewp-co .woocommerce-billing-fields > h3,
.commercewp-co .woocommerce-additional-fields > h3,
.commercewp-co .woocommerce-shipping-fields:empty {
	display: none;
}

/* The store sells to one country, so the country row is only a fixed label. WooCommerce's
   script sets an inline display on it, hence !important. The hidden input stays in the form. */
.commercewp-co #billing_country_field {
	display: none !important;
}

.commercewp-co .woocommerce-billing-fields__field-wrapper,
.commercewp-co .woocommerce-additional-fields__field-wrapper {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px 14px;
}

.woocommerce form.commercewp-co .form-row,
form.commercewp-co .form-row {
	display: flex;
	float: none;
	flex-direction: column;
	grid-column: 1 / -1;
	gap: 6px;
	width: auto;
	margin: 0;
	padding: 0;
}

.woocommerce form.commercewp-co .form-row-first,
.woocommerce form.commercewp-co .form-row-last {
	grid-column: auto;
}

.woocommerce form.commercewp-co .form-row label,
form.commercewp-co .form-row label {
	margin: 0;
	color: var(--bbo-text);
	font-size: 14px;
	font-weight: 500;
	line-height: 1.5;
}

.woocommerce form.commercewp-co .form-row .required {
	color: inherit;
	font-weight: inherit;
	text-decoration: none;
}

.woocommerce form.commercewp-co .form-row .optional {
	color: inherit;
}

.woocommerce form.commercewp-co .form-row .woocommerce-input-wrapper {
	display: block;
	width: 100%;
}

.woocommerce form.commercewp-co .form-row input.input-text,
.woocommerce form.commercewp-co .form-row textarea,
.woocommerce form.commercewp-co .form-row select,
.commercewp-co .select2-container .select2-selection--single {
	width: 100%;
	height: 48px;
	margin: 0;
	padding: 0 14px;
	border: 1px solid var(--bbo-border-strong);
	border-radius: 12px;
	background: var(--bbo-cream);
	color: var(--commercewp-text, #1d2422);
	font-family: inherit;
	font-size: 15px;
	line-height: 1.5;
	box-shadow: none;
}

.woocommerce form.commercewp-co .form-row textarea {
	height: auto;
	min-height: 0;
	padding: 12px 14px;
	resize: vertical;
}

.commercewp-co .select2-container .select2-selection--single {
	display: flex;
	align-items: center;
	padding-right: 36px;
}

.commercewp-co .select2-container .select2-selection--single .select2-selection__rendered {
	padding: 0;
	color: inherit;
	line-height: 1.5;
}

.commercewp-co .select2-container .select2-selection--single .select2-selection__arrow {
	top: 0;
	right: 8px;
	height: 46px;
}

.woocommerce form.commercewp-co .form-row input.input-text:focus-visible,
.woocommerce form.commercewp-co .form-row textarea:focus-visible,
.woocommerce form.commercewp-co .form-row select:focus-visible,
.commercewp-co .select2-container--focus .select2-selection--single {
	outline: 2px solid var(--bbo-gold);
	outline-offset: 2px;
}

.woocommerce form.commercewp-co .form-row.woocommerce-invalid input.input-text,
.woocommerce form.commercewp-co .form-row.woocommerce-invalid textarea,
.woocommerce form.commercewp-co .form-row.woocommerce-invalid select,
.woocommerce form.commercewp-co .form-row.woocommerce-invalid .select2-selection {
	border-color: var(--bbo-red);
}

.woocommerce form.commercewp-co .form-row.woocommerce-validated input.input-text,
.woocommerce form.commercewp-co .form-row.woocommerce-validated select,
.woocommerce form.commercewp-co .form-row.woocommerce-validated .select2-selection {
	border-color: var(--bbo-border-strong);
}

.woocommerce form.commercewp-co .form-row .checkout-inline-error-message,
.woocommerce form.commercewp-co .form-row .woocommerce-error {
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--bbo-red);
	font-size: 12px;
	font-weight: 400;
}

.commercewp-co .woocommerce-account-fields {
	margin-top: 18px;
}

.commercewp-co .woocommerce-account-fields .create-account label {
	display: flex;
	align-items: center;
	gap: 8px;
}

/* ---------- Delivery area ---------- */

.commercewp-co-shipping {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.commercewp-co-zones {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr));
	gap: 12px;
}

.commercewp-co .commercewp-co-zone {
	position: relative;
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0;
	padding: 16px;
	border: 2px solid var(--bbo-border-strong);
	border-radius: 14px;
	background: var(--bbo-white);
	text-align: left;
}

.commercewp-co .commercewp-co-zone.is-active {
	border-color: var(--bbo-green);
	background: var(--bbo-cream);
	cursor: pointer;
}

.commercewp-co-zone input {
	position: absolute;
	width: 1px;
	height: 1px;
	opacity: 0;
}

.commercewp-co-radio {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
	border: 2px solid var(--bbo-border-strong);
	border-radius: 50%;
}

.commercewp-co-radio::after {
	content: "";
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: transparent;
}

.commercewp-co-zone.is-active .commercewp-co-radio,
.commercewp-co-pay input:checked + label .commercewp-co-radio {
	border-color: var(--bbo-green);
}

.commercewp-co-zone.is-active .commercewp-co-radio::after,
.commercewp-co-pay input:checked + label .commercewp-co-radio::after {
	background: var(--bbo-green);
}

.commercewp-co-zone:has(input:focus-visible),
.commercewp-co-pay:has(input:focus-visible) {
	outline: 2px solid var(--bbo-gold);
	outline-offset: 2px;
}

.commercewp-co-zone__text {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.commercewp-co-zone__label {
	color: var(--bbo-green);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.4;
}

.commercewp-co-zone__eta {
	color: var(--bbo-soft);
	font-size: 13px;
	font-weight: 400;
}

.commercewp-co-zone__fee {
	color: var(--bbo-gold-text);
	font-size: 15px;
	font-weight: 600;
	white-space: nowrap;
}

.commercewp-co-shipping__msg {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	color: var(--bbo-success);
	font-size: 14px;
}

.commercewp-co-shipping__msg--hint {
	color: var(--bbo-gold-text);
}

.commercewp-co-shipping__msg--warn {
	color: var(--bbo-red);
}

.commercewp-co-shipping__msg .commercewp-icon {
	font-size: 20px;
}

.commercewp-co-shipping__note {
	margin: 0;
	color: var(--bbo-strike);
	font-size: 12px;
}

/* ---------- Payment ---------- */

.woocommerce .commercewp-co #payment ul.payment_methods,
.commercewp-co #payment ul.payment_methods {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr));
	align-items: start;
	gap: 10px;
	margin: 0;
	padding: 0;
	border: 0;
	list-style: none;
}

.woocommerce .commercewp-co #payment ul.payment_methods::before,
.woocommerce .commercewp-co #payment ul.payment_methods::after {
	content: none;
}

.woocommerce .commercewp-co #payment ul.payment_methods li.commercewp-co-pay,
.commercewp-co #payment li.commercewp-co-pay {
	position: relative;
	margin: 0;
	overflow: hidden;
	border: 2px solid var(--bbo-border-strong);
	border-radius: 14px;
	background: var(--bbo-white);
	line-height: 1.5;
}

.commercewp-co #payment li.commercewp-co-pay:has(input:checked) {
	border-color: var(--bbo-green);
	background: var(--bbo-cream);
}

.woocommerce .commercewp-co #payment li.commercewp-co-pay input.input-radio {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: 0;
	opacity: 0;
}

.woocommerce .commercewp-co #payment li.commercewp-co-pay label {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0;
	padding: 14px 16px;
	cursor: pointer;
}

.commercewp-co-pay__icon {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 10px;
	background: var(--bbo-sand);
	color: var(--bbo-gold-text);
	font-size: 22px;
}

.woocommerce .commercewp-co #payment .commercewp-co-pay__icon img {
	float: none;
	max-width: 28px;
	max-height: 28px;
	margin: 0;
}

.commercewp-co-pay__text {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.commercewp-co-pay__name {
	color: var(--bbo-green);
	font-size: 15px;
	font-weight: 600;
}

.commercewp-co-pay__sub {
	color: var(--bbo-soft);
	font-size: 13px;
	font-weight: 400;
}

.woocommerce .commercewp-co #payment div.payment_box,
.commercewp-co #payment div.payment_box {
	margin: 0;
	padding: 0 16px 14px;
	border-radius: 0;
	background: transparent;
	color: var(--bbo-muted);
	font-size: 13px;
	line-height: 1.6;
}

.woocommerce .commercewp-co #payment div.payment_box::before {
	content: none;
}

.commercewp-co #payment div.payment_box p {
	margin: 0;
}

/* ---------- Order summary ---------- */

.commercewp-co-summary.commercewp-co-card {
	gap: 16px;
}

.commercewp-co-summary__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	color: var(--bbo-strike);
	font-size: 13px;
}

.commercewp-co-items {
	display: flex;
	flex-direction: column;
	gap: 14px;
	max-height: 360px;
	padding: 8px 8px 2px 0;
	overflow-y: auto;
}

.commercewp-co-item {
	display: grid;
	grid-template-columns: 60px minmax(0, 1fr) auto;
	align-items: center;
	gap: 12px;
}

.commercewp-co-item__thumb {
	position: relative;
	display: block;
	width: 60px;
	height: 60px;
	border: 1px solid var(--bbo-border);
	border-radius: 12px;
	background: var(--bbo-white);
}

.commercewp-co-item .commercewp-co-item__thumb img {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: 11px;
	object-fit: cover;
}

.commercewp-co-item__badge {
	position: absolute;
	top: -7px;
	right: -7px;
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 22px;
	height: 22px;
	padding: 0 5px;
	border-radius: 999px;
	background: var(--bbo-green);
	color: var(--bbo-gold-light);
	font-size: 11px;
	font-weight: 700;
	line-height: 1;
}

.commercewp-co-item__info {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
}

.commercewp-co-item__name {
	overflow: hidden;
	color: var(--bbo-green);
	font-size: 14px;
	font-weight: 500;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.commercewp-co-item__info dl.variation {
	margin: 0;
	color: var(--bbo-strike);
	font-size: 12px;
}

.commercewp-co-item__info dl.variation dt,
.commercewp-co-item__info dl.variation dd,
.commercewp-co-item__info dl.variation p {
	display: inline;
	margin: 0;
}

.commercewp-co-item__actions {
	display: flex;
	align-items: center;
	gap: 8px;
}

.commercewp-co-item__qty {
	display: flex;
	align-items: center;
	height: 28px;
	overflow: hidden;
	border: 1px solid var(--bbo-border-strong);
	border-radius: 999px;
}

.commercewp-co .commercewp-co-item__qty button {
	width: 28px;
	height: 28px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--bbo-green);
	font-size: 15px;
	line-height: 1;
	cursor: pointer;
}

.commercewp-co .commercewp-co-item__qty button:hover {
	background: var(--bbo-sand);
}

.commercewp-co-item__qty span {
	min-width: 20px;
	font-size: 13px;
	font-weight: 600;
	text-align: center;
}

.commercewp-co .commercewp-co-item__remove {
	padding: 4px;
	border: 0;
	background: transparent;
	color: var(--bbo-strike);
	font-size: 12px;
	font-weight: 400;
	text-decoration: underline;
	cursor: pointer;
}

.commercewp-co .commercewp-co-item__remove:hover {
	color: var(--bbo-red);
}

.commercewp-co-item__total {
	color: var(--bbo-green);
	font-size: 14px;
	font-weight: 600;
	white-space: nowrap;
}

.commercewp-co-summary.is-busy .commercewp-co-items {
	opacity: 0.55;
	pointer-events: none;
}

.commercewp-co-coupon {
	display: flex;
	gap: 8px;
}

.woocommerce form.commercewp-co .commercewp-co-coupon__input,
.commercewp-co .commercewp-co-coupon__input {
	flex: 1;
	min-width: 0;
	height: 46px;
	padding: 0 14px;
	border: 1px solid var(--bbo-border-strong);
	border-radius: 12px;
	background: var(--bbo-cream);
	font-size: 14px;
	text-transform: uppercase;
}

.commercewp-co .commercewp-co-coupon__input::placeholder {
	text-transform: none;
}

.commercewp-co .commercewp-co-coupon__btn {
	height: 46px;
	padding: 0 18px;
	border: 1px solid var(--bbo-green);
	border-radius: 12px;
	background: transparent;
	color: var(--bbo-green);
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.commercewp-co .commercewp-co-coupon__btn:hover {
	background: var(--bbo-green);
	color: var(--bbo-sand);
}

.commercewp-co-coupon__msg {
	margin-top: -6px;
	font-size: 13px;
}

.commercewp-co-coupon__msg:empty {
	display: none;
}

.commercewp-co-coupon__msg.is-ok {
	color: var(--bbo-success);
}

.commercewp-co-coupon__msg.is-error {
	color: var(--bbo-red);
}

.commercewp-co-totals {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 0;
	padding-top: 14px;
	border-top: 1px solid var(--bbo-border);
	color: var(--bbo-muted);
	font-size: 14px;
}

.commercewp-co-totals > div {
	display: flex;
	justify-content: space-between;
	gap: 12px;
}

.commercewp-co-totals dt {
	margin: 0;
	font-weight: 400;
}

.commercewp-co-totals dd {
	margin: 0;
	color: var(--bbo-green);
	font-weight: 500;
	text-align: right;
}

.commercewp-co-totals .cart-discount,
.commercewp-co-totals .cart-discount dd {
	color: var(--bbo-success);
}

.commercewp-co-totals .woocommerce-remove-coupon {
	margin-left: 6px;
	color: var(--bbo-strike);
	font-size: 12px;
	font-weight: 400;
	text-decoration: underline;
}

.commercewp-co-totals .order-total {
	align-items: baseline;
	padding-top: 12px;
	border-top: 1px dashed var(--bbo-border-strong);
}

.commercewp-co-totals .order-total dt {
	color: var(--bbo-green);
	font-size: 16px;
	font-weight: 600;
}

.commercewp-co-totals .order-total dd {
	font-size: 24px;
	font-weight: 600;
}

.commercewp-co-totals .order-total strong {
	font-weight: 600;
}

.woocommerce .commercewp-co .place-order,
.commercewp-co .place-order {
	display: block;
	float: none;
	margin: 0;
	padding: 0;
}

.woocommerce .commercewp-co #place_order,
.commercewp-co #place_order {
	display: flex;
	float: none;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	height: 56px;
	margin: 0;
	padding: 0 20px;
	border: 0;
	border-radius: 999px;
	background-color: var(--bbo-green);
	color: var(--bbo-sand);
	font-family: inherit;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
	transition: background-color 0.2s ease;
}

.woocommerce .commercewp-co #place_order:hover {
	background-color: var(--bbo-green-hover);
}

/* Lock icon. It is drawn in CSS because WooCommerce's script rewrites the button text. */
.commercewp-co #place_order::before {
	content: "";
	flex: none;
	width: 22px;
	height: 22px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -960 960 960' fill='%23f3ebdd'%3E%3Cpath d='M240-80q-33 0-56.500-23.500T160-160v-400q0-33 23.500-56.500T240-640h40v-80q0-83 58.500-141.500T480-920q83 0 141.500 58.500T680-720v80h40q33 0 56.500 23.500T800-560v400q0 33-23.500 56.500T720-80H240Zm0-80h480v-400H240v400Zm240-120q33 0 56.500-23.500T560-360q0-33-23.500-56.500T480-440q-33 0-56.500 23.500T400-360q0 33 23.500 56.500T480-280ZM360-640h240v-80q0-50-35-85t-85-35q-50 0-85 35t-35 85v80ZM240-160v-400 400Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.commercewp-co-terms {
	margin: 0;
	color: var(--bbo-strike);
	font-size: 12px;
	line-height: 1.6;
	text-align: center;
}

.commercewp-co-terms a {
	color: var(--bbo-gold-text);
}

.commercewp-co-perks {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.commercewp-co-perks li {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	padding: 12px 6px;
	border: 1px solid var(--bbo-border-card);
	border-radius: 14px;
	background: var(--bbo-white);
	color: var(--bbo-green);
	font-size: 12px;
	font-weight: 600;
	text-align: center;
}

.commercewp-co-perks .commercewp-icon {
	color: var(--bbo-gold-text);
	font-size: 22px;
}

/* Returning customer / login prompt above the form. */
.commercewp-cobody .woocommerce-form-login-toggle,
.commercewp-cobody form.woocommerce-form-login {
	margin-bottom: 16px;
}

.commercewp-cobody form.woocommerce-form-login {
	padding: clamp(20px, 2.6vw, 32px);
	border: 1px solid var(--bbo-border-card);
	border-radius: 20px;
	background: var(--bbo-white);
}

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

.commercewp-copage--done .commercewp-cobody,
body.woocommerce-order-received .commercewp-cobody {
	max-width: 640px;
	padding-block: clamp(40px, 7vw, 96px);
}

.commercewp-thanks__card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
	padding: clamp(28px, 5vw, 56px);
	border: 1px solid var(--bbo-border-card);
	border-radius: 20px;
	background: var(--bbo-white);
	box-shadow: 0 10px 28px -20px rgba(4, 31, 30, 0.2);
	text-align: center;
}

.commercewp-thanks__tick {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 72px;
	height: 72px;
	border-radius: 50%;
	background: var(--bbo-green);
	color: var(--bbo-gold-light);
	font-size: 40px;
}

.commercewp-thanks .commercewp-thanks__title {
	margin: 0;
	color: var(--bbo-green);
	font-family: var(--bbo-heading);
	font-size: clamp(32px, 4vw, 46px);
	font-weight: 600;
	line-height: 1.05;
}

.commercewp-thanks__text {
	max-width: 440px;
	margin: 0;
	color: var(--bbo-muted);
	font-size: 15px;
	line-height: 1.65;
}

.commercewp-thanks__text strong {
	color: var(--bbo-green);
}

.woocommerce .commercewp-thanks .commercewp-thanks__facts,
.commercewp-thanks__facts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
	grid-auto-flow: column;
	grid-auto-columns: minmax(0, 1fr);
	gap: 12px;
	width: 100%;
	margin: 0;
	padding: 16px 0;
	border-top: 1px solid var(--bbo-border);
	border-bottom: 1px solid var(--bbo-border);
	color: var(--bbo-strike);
	font-size: 13px;
}

.commercewp-thanks__facts > div {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.commercewp-thanks__facts dt {
	margin: 0;
	font-weight: 400;
}

.commercewp-thanks__facts dd {
	margin: 0;
	color: var(--bbo-green);
	font-size: 16px;
	font-weight: 600;
}

.commercewp-thanks__actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
	margin: 0;
}

.woocommerce .commercewp-thanks a.commercewp-thanks__btn,
.commercewp-thanks .commercewp-thanks__btn {
	display: flex;
	align-items: center;
	gap: 8px;
	height: 50px;
	padding: 0 24px;
	border: 1px solid var(--bbo-green);
	border-radius: 999px;
	background: var(--bbo-green);
	color: var(--bbo-sand);
	font-size: 14px;
	font-weight: 600;
}

.woocommerce .commercewp-thanks a.commercewp-thanks__btn:hover {
	background: var(--bbo-green-hover);
	color: var(--bbo-sand);
}

.woocommerce .commercewp-thanks a.commercewp-thanks__btn--outline,
.commercewp-thanks .commercewp-thanks__btn--outline {
	border-color: var(--bbo-border-button);
	background: transparent;
	color: var(--bbo-green);
	font-weight: 500;
}

.woocommerce .commercewp-thanks a.commercewp-thanks__btn--outline:hover {
	border-color: var(--bbo-green);
	background: transparent;
	color: var(--bbo-green);
}

.commercewp-thanks__btn--outline .commercewp-icon {
	color: var(--commercewp-whatsapp, #1f8f4e);
	font-size: 20px;
}

.commercewp-thanks__extra:empty {
	display: none;
}

.commercewp-thanks__extra {
	margin-top: 16px;
	color: var(--bbo-muted);
	font-size: 14px;
	text-align: center;
}

/* ---------- Desktop ---------- */

@media (min-width: 1024px) {
	.woocommerce form.commercewp-co,
	form.commercewp-co {
		grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
	}

	.commercewp-co__side {
		position: sticky;
		top: calc(var(--commercewp-header-h, 130px) + 16px);
	}
}

@media (max-width: 479px) {
	.commercewp-co .woocommerce-billing-fields__field-wrapper {
		grid-template-columns: minmax(0, 1fr);
	}

	.woocommerce form.commercewp-co .form-row-first,
	.woocommerce form.commercewp-co .form-row-last {
		grid-column: 1 / -1;
	}

	.commercewp-costeps__line {
		width: 16px;
	}
}