/**
 * Checkout and cart, in the gift card form's visual language.
 *
 * Loaded on the cart and checkout pages only (DWGC_Checkout::enqueue_assets()).
 * Every rule is scoped to body.dwgc-checkout; rules that depend on the short
 * virtual-only checkout are scoped to body.dwgc-checkout--virtual, so a cart
 * with a physical product keeps WooCommerce's layout for everything that
 * changes shape.
 *
 * The values mirror public/assets/purchase-form.css — same tokens, same
 * input box, same label, same button — so the two pages read as one flow.
 * The Checkout block's own selectors are deep and attribute-qualified, which
 * is why several rules here carry .wc-block-checkout and input[type]: that
 * is the specificity needed to land over them without !important.
 */

body.dwgc-checkout {
	--dwgc-ink: var(--gsap-light, var(--bde-body-text-color, #fffce1));
	--dwgc-bg: var(--black-2, var(--bde-background-color, #191919));
	--dwgc-accent: var(--red, var(--bde-brand-primary-color, #fe0100));
	--dwgc-on-accent: var(--bde-button-primary-text-color, #fff);
	--dwgc-line: rgba(255, 252, 225, 0.22);
	--dwgc-line: color-mix(in srgb, var(--dwgc-ink) 22%, transparent);
	--dwgc-line-strong: rgba(255, 252, 225, 0.47);
	--dwgc-line-strong: color-mix(in srgb, var(--dwgc-ink) 47%, transparent);
	--dwgc-muted: rgba(255, 252, 225, 0.66);
	--dwgc-muted: color-mix(in srgb, var(--dwgc-ink) 66%, transparent);
	--dwgc-sunk: rgba(255, 252, 225, 0.06);
	--dwgc-sunk: color-mix(in srgb, var(--dwgc-ink) 6%, transparent);

	/* Height the Stripe card form settles at (card number, expiry + CVC,
	   country), reserved before its iframe arrives so "Place order" does not
	   jump down when it does. */
	--dwgc-stripe-reserve: 278px;
}

body.dwgc-checkout .wc-block-checkout {
	color: var(--dwgc-ink);
	font-family: inherit;
}

/* ---------------------------------------------------------------------
 * Section headings — the form's small uppercase labels, one size up
 * ------------------------------------------------------------------ */

body.dwgc-checkout .wc-block-checkout .wc-block-components-checkout-step__title,
body.dwgc-checkout .wc-block-checkout .wc-block-components-checkout-order-summary__title-text,
body.dwgc-checkout .wc-block-checkout .wc-block-components-title.wc-block-components-title {
	color: var(--dwgc-ink);
	font-size: 0.875rem;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-checkout-step__description {
	color: var(--dwgc-muted);
	font-size: 0.8125rem;
}

/* "You are currently checking out as a guest." The shop has no customer
   accounts, so every buyer is a guest and the line gives them nothing to do. */
body.dwgc-checkout .wc-block-checkout .wc-block-checkout__guest-checkout-notice {
	display: none;
}

/* The short checkout asks for name and email only, so "Billing address"
   over two name fields says something untrue. The names read as part of
   the contact details instead. */
body.dwgc-checkout--virtual .wc-block-checkout__billing-fields .wc-block-components-checkout-step__heading-container {
	display: none;
}

body.dwgc-checkout--virtual .wc-block-checkout .wc-block-checkout__billing-fields {
	margin-top: 0;
	padding-top: 0;
}

body.dwgc-checkout--virtual .wc-block-checkout .wc-block-components-address-form__country {
	display: none;
}

/* ---------------------------------------------------------------------
 * Text inputs — the gift card form's field: label above, 1px hairline box
 *
 * The block floats its label inside the input. Here it sits above, like the
 * form's, which is also clearer: the label never shrinks away mid-typing.
 * The label comes after the input in the markup, so it is moved up with
 * `order`, which leaves a validation message below the input where it
 * belongs.
 * ------------------------------------------------------------------ */

body.dwgc-checkout .wc-block-checkout .wc-block-components-text-input {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-text-input label,
body.dwgc-checkout .wc-block-checkout .wc-block-components-text-input.is-active label {
	order: -1;
	position: static;
	max-width: none;
	margin: 0;
	transform: none;
	color: var(--dwgc-muted);
	font-size: 0.75rem;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	white-space: normal;
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-text-input input[type],
body.dwgc-checkout .wc-block-checkout .wc-block-components-text-input.is-active input[type],
body.dwgc-checkout .wc-block-checkout .wc-blocks-components-select__select {
	box-sizing: border-box;
	height: auto;
	min-height: 0;
	margin: 0;
	padding: 13px 16px;
	border: 1px solid var(--dwgc-line);
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	color: var(--dwgc-ink);
	font-family: inherit;
	/* Under 16px, iOS Safari zooms the page when the field takes focus. */
	font-size: 16px;
	font-weight: 400;
	line-height: 1.4;
	transition: border-color 0.14s ease;
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-text-input input[type]:hover {
	border-color: var(--dwgc-line-strong);
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-text-input input[type]:focus {
	outline: 2px solid var(--dwgc-accent);
	outline-offset: 0;
	border-color: var(--dwgc-accent);
	box-shadow: none;
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-text-input.has-error input[type] {
	border-color: var(--dwgc-accent);
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-validation-error {
	color: var(--dwgc-accent);
	font-size: 0.8125rem;
}

/* ---------------------------------------------------------------------
 * Checkboxes — terms, "use same address"
 * ------------------------------------------------------------------ */

body.dwgc-checkout .wc-block-checkout .wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"] {
	border: 1px solid var(--dwgc-line-strong);
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"]:checked {
	border-color: var(--dwgc-accent);
	background: var(--dwgc-accent);
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"]:focus-visible {
	outline: 2px solid var(--dwgc-ink);
	outline-offset: 2px;
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-checkbox .wc-block-components-checkbox__mark {
	fill: var(--dwgc-on-accent);
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-checkbox__label,
body.dwgc-checkout .wc-block-checkout .wc-block-checkout__terms {
	color: var(--dwgc-ink);
	font-size: 0.875rem;
	line-height: 1.5;
}

body.dwgc-checkout .wc-block-checkout .wc-block-checkout__terms a {
	color: var(--dwgc-ink);
	text-decoration: underline;
	text-underline-offset: 3px;
}

body.dwgc-checkout .wc-block-checkout .wc-block-checkout__terms a:hover {
	color: var(--dwgc-accent);
}

/* ---------------------------------------------------------------------
 * Express checkout and payment
 * ------------------------------------------------------------------ */

body.dwgc-checkout .wc-block-checkout .wc-block-components-express-payment--checkout .wc-block-components-express-payment__content {
	border-color: var(--dwgc-line);
	border-radius: 0;
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-express-payment__title-container::before,
body.dwgc-checkout .wc-block-checkout .wc-block-components-express-payment__title-container::after,
body.dwgc-checkout .wc-block-checkout .wc-block-components-express-payment-continue-rule::before,
body.dwgc-checkout .wc-block-checkout .wc-block-components-express-payment-continue-rule::after {
	border-color: var(--dwgc-line);
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-express-payment__title,
body.dwgc-checkout .wc-block-checkout .wc-block-components-express-payment-continue-rule {
	color: var(--dwgc-muted);
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-radio-control-accordion-option,
body.dwgc-checkout .wc-block-checkout .wc-block-components-radio-control--highlight-checked::after,
body.dwgc-checkout .wc-block-checkout .wc-block-components-radio-control-accordion-option--checked-option-highlighted {
	border-radius: 0;
	box-shadow: none;
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-radio-control--highlight-checked {
	border: 1px solid var(--dwgc-line);
	border-radius: 0;
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-radio-control--highlight-checked::after {
	border: 0;
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-radio-control__input[type="radio"] {
	border-color: var(--dwgc-line-strong);
	background: transparent;
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-radio-control__input[type="radio"]:checked::before {
	background: var(--dwgc-accent);
}

/*
 * Load without layout shift.
 *
 * Stripe mounts two things a second or two after the page: the express
 * buttons above the form, and the payment options with the card form. Each
 * pushed everything under it down (169px, then 13px on desktop). Their space
 * is held open in advance:
 *
 *   - the express area, as padding on the form, only until the payment
 *     options exist. Both arrive together, so the padding hands over to the
 *     real buttons in the same frame — and if a browser ends up with no
 *     wallet at all, the space still goes away once payment has loaded
 *     rather than staying as a gap.
 *   - the payment section, at the height it settles at;
 *   - the card form inside it (--dwgc-stripe-reserve).
 *
 * Measured on this site at 1440px and 375px with the Payment Element's card
 * form. The express reserve here is the two-column layout's; the narrow
 * layouts, where the order summary sits above the express buttons, hold it
 * open under the summary instead (see "Narrow screens" below).
 */
body.dwgc-checkout {
	--dwgc-express-reserve: 169px;
	--dwgc-payment-reserve: 394px;
}

/* Narrow: the card form puts expiry and CVC on their own rows. */
@media (max-width: 699px) {
	body.dwgc-checkout {
		--dwgc-payment-reserve: 425px;
		--dwgc-stripe-reserve: 309px;
	}
}

body.dwgc-checkout .wc-block-checkout__main:not(:has(.wc-block-components-express-payment)):not(:has(.wc-block-components-radio-control-accordion-option)) .wc-block-checkout__form {
	padding-top: var(--dwgc-express-reserve);
}

body.dwgc-checkout .wc-block-checkout .wc-block-checkout__payment-method {
	min-height: var(--dwgc-payment-reserve);
	box-sizing: border-box;
}

body.dwgc-checkout .wc-block-checkout .wc-block-checkout__payment-method .wc-block-components-radio-control-accordion-content {
	min-height: var(--dwgc-stripe-reserve);
	box-sizing: border-box;
}

/* ---------------------------------------------------------------------
 * Place order — the gift card form's "Add to basket" button
 * ------------------------------------------------------------------ */

body.dwgc-checkout .wc-block-checkout .wc-block-components-checkout-place-order-button.wc-block-components-button,
body.dwgc-checkout .wc-block-checkout .wc-block-components-checkout-place-order-button.wc-block-components-button:not(.is-link) {
	width: 100%;
	min-height: 56px;
	padding: 16px 28px;
	border: 1px solid var(--dwgc-accent);
	border-radius: 0;
	background: var(--dwgc-accent);
	box-shadow: none;
	color: var(--dwgc-on-accent);
	font-family: inherit;
	font-size: 0.9375rem;
	font-weight: 500;
	line-height: 1;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	transition: background-color 0.14s ease, color 0.14s ease;
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-checkout-place-order-button.wc-block-components-button:not(.is-link):hover {
	background: transparent;
	color: var(--dwgc-accent);
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-checkout-place-order-button.wc-block-components-button:not(.is-link):focus-visible {
	outline: 2px solid var(--dwgc-ink);
	outline-offset: 2px;
}

/* ---------------------------------------------------------------------
 * Order summary — the mini cart's gift card line
 *
 *   [image]  Dāvanu karte                 50,00 €
 *            Summa: 50 €
 *            Saņēmējs: Anna (anna@…)
 * ------------------------------------------------------------------ */

body.dwgc-checkout .wc-block-checkout .wc-block-components-order-summary,
body.dwgc-checkout .wc-block-checkout .wc-block-components-sidebar .wc-block-components-panel,
body.dwgc-checkout .wc-block-checkout .wc-block-components-totals-wrapper {
	border-color: var(--dwgc-line);
}

body.dwgc-checkout .wc-block-checkout .wc-block-checkout__sidebar .wp-block-woocommerce-checkout-order-summary-block,
body.dwgc-checkout .wc-block-checkout .checkout-order-summary-block-fill {
	border-color: var(--dwgc-line);
	border-radius: 0;
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-order-summary-item__image {
	width: 64px;
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-order-summary-item__image img {
	width: 64px;
	height: 64px;
	max-width: none;
	object-fit: cover;
	border-radius: 4px;
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-product-name {
	color: var(--dwgc-ink);
	font-size: 1rem;
	font-weight: 500;
	line-height: 1.3;
}

/* Gift cards are always quantity 1 and priced by their amount, so the
   quantity badge and the per-unit price only repeat what the amount row and
   the line total already say. */
body.dwgc-checkout--virtual .wc-block-checkout .wc-block-components-order-summary-item__quantity,
body.dwgc-checkout--virtual .wc-block-checkout .wc-block-components-order-summary-item__individual-prices {
	display: none;
}

/* The block prints the item's details before its variation, which puts the
   recipient above the amount. Amount first, as in the mini cart. */
body.dwgc-checkout .wc-block-checkout .wc-block-components-product-metadata {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin-top: 4px;
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-product-metadata > .wc-block-components-product-details + .wc-block-components-product-details {
	order: -1;
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-product-details {
	margin: 0;
	color: var(--dwgc-muted);
	font-size: 0.8125rem;
	line-height: 1.45;
	overflow-wrap: anywhere;
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-product-details__name {
	font-weight: 400;
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-totals-item__label,
body.dwgc-checkout .wc-block-checkout .wc-block-components-totals-item__value {
	color: var(--dwgc-ink);
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

body.dwgc-checkout .wc-block-checkout .wc-block-components-panel__button,
body.dwgc-checkout .wc-block-checkout .wc-block-components-checkout-order-summary__title {
	color: var(--dwgc-ink);
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

/* ---------------------------------------------------------------------
 * Narrow screens — one order summary, open, at the top
 *
 * Below its two-column width the Checkout block shows the summary twice: a
 * collapsed copy from the sidebar above the form, and an open copy above
 * "Place order". The open copy is lifted to the top of the form and the
 * collapsed one hidden. Every rule keys on the open copy existing — the block
 * renders it only in the narrow layouts — so the two-column layout is
 * untouched and the page never ends up without a summary.
 *
 * The open copy lives inside the actions block, so the two boxes between it
 * and the form are flattened (display: contents) to make it a flex item of
 * the form, which `order` can move. Nothing moves in the DOM: React keeps its
 * nodes and the Stripe iframes are not remounted.
 * ------------------------------------------------------------------ */

body.dwgc-checkout .wc-block-checkout:has(.checkout-order-summary-block-fill-wrapper) .wc-block-checkout__sidebar {
	display: none;
}

/* The block paints once before it has measured itself: no size class yet, so
   the collapsed copy still above the form and the open one not rendered. A
   frame later the classes land and the form jumps up past the collapsed copy.
   That one frame is kept invisible instead. The animation is a fallback that
   shows it after a second regardless, in case the measurement never comes. */
@media (max-width: 799px) {
	body.dwgc-checkout .wc-block-components-sidebar-layout.wc-block-checkout:not(.is-mobile):not(.is-small):not(.is-medium):not(.is-large) {
		visibility: hidden;
		animation: dwgc-checkout-reveal 0s linear 1s forwards;
	}
}

@keyframes dwgc-checkout-reveal {
	to {
		visibility: visible;
	}
}

body.dwgc-checkout .wc-block-checkout__form:has(.checkout-order-summary-block-fill-wrapper) {
	display: flex;
	flex-direction: column;
}

body.dwgc-checkout .wc-block-checkout__form .wc-block-checkout__actions:has(.checkout-order-summary-block-fill-wrapper),
body.dwgc-checkout .wc-block-checkout__form .wc-block-checkout__actions > div:has(> .checkout-order-summary-block-fill-wrapper) {
	display: contents;
}

body.dwgc-checkout .wc-block-checkout__form .checkout-order-summary-block-fill-wrapper {
	order: -1;
}

/* The actions block's bottom margin went with its box. */
body.dwgc-checkout .wc-block-checkout__form:has(.checkout-order-summary-block-fill-wrapper) .wc-block-checkout__actions_row {
	margin-bottom: 36px;
}

/* Until the cart loads, the line shows as a 53px skeleton, then as the real
   77px line. By the button that happened off-screen; at the top it would push
   the whole form down. */
body.dwgc-checkout .checkout-order-summary-block-fill .wc-block-components-order-summary-item:has(.wc-block-components-skeleton__element) {
	box-sizing: border-box;
	min-height: 77px;
}

/* The express buttons now arrive under the summary, so their space is held
   there rather than as padding on the form, which would sit above it. Heights
   they settle at: stacked in the phone layout, side by side from 480px. */
body.dwgc-checkout .wc-block-checkout:is(.is-small, .is-medium) {
	--dwgc-express-reserve: 133px;
}

body.dwgc-checkout .wc-block-checkout.is-mobile {
	--dwgc-express-reserve: 193px;
}

body.dwgc-checkout .wc-block-checkout__main:not(:has(.wc-block-components-express-payment)):not(:has(.wc-block-components-radio-control-accordion-option)) .wc-block-checkout__form:has(.checkout-order-summary-block-fill-wrapper) {
	padding-top: 0;
}

body.dwgc-checkout .wc-block-checkout__main:not(:has(.wc-block-components-express-payment)):not(:has(.wc-block-components-radio-control-accordion-option)) .checkout-order-summary-block-fill-wrapper {
	margin-bottom: var(--dwgc-express-reserve);
}

/* ---------------------------------------------------------------------
 * Notices
 * ------------------------------------------------------------------ */

body.dwgc-checkout .wc-block-components-notice-banner {
	border: 1px solid var(--dwgc-line);
	border-left: 3px solid var(--dwgc-accent);
	border-radius: 0;
	background: var(--dwgc-sunk);
	color: var(--dwgc-ink);
}

body.dwgc-checkout .wc-block-components-notice-banner > svg {
	fill: var(--dwgc-accent);
	background: transparent;
}

/* ---------------------------------------------------------------------
 * Order received — the thank-you page after payment
 *
 * This page is WooCommerce's classic order summary inside Breakdance's
 * checkout element, and Breakdance paints it from its --bde-woo-* variables,
 * whose defaults are a light theme: white boxes, a pale green notice, near-
 * black text — unreadable on the site's dark background. The variables are
 * re-pointed at our tokens here, for this page only, so every Breakdance
 * rule that reads them follows; the rules after that set what the variables
 * cannot (heading case, label size, the notice's shape).
 * ------------------------------------------------------------------ */

body.dwgc-checkout.woocommerce-order-received .breakdance-woocommerce {
	--bde-woo-base-text-color: var(--dwgc-ink);
	--bde-woo-base-headings-color: var(--dwgc-ink);
	--bde-woo-base-border-color: var(--dwgc-line);
	--bde-woo-buttons-and-links__text-link-color: var(--dwgc-ink);
	--bde-woo-buttons-and-links__text-link-color-hover: var(--dwgc-accent);
	--bde-woo-wrappers__background-color: transparent;
	--bde-woo-wrappers__border-color: var(--dwgc-line);
	--bde-woo-wrappers__border-radius: 0;
	--bde-woo-wrappers__shadow: none;
	--bde-woo-tables__background-color: transparent;
	--bde-woo-tables__header-color: transparent;
	--bde-woo-tables__border-color: var(--dwgc-line);
	--bde-woo-tables__border-radius: 0;
	--bde-woo-notices__success-background: transparent;
	--bde-woo-notices__success-text: var(--dwgc-ink);
	--bde-woo-notices__border-radius: 0;
	color: var(--dwgc-ink);
}

/* "Paldies. Jūsu pasūtījums ir saņemts." reads as the page's heading. */
body.dwgc-checkout.woocommerce-order-received .breakdance-woocommerce .woocommerce-thankyou-order-received {
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--dwgc-ink);
	font-size: 1.25rem;
	font-weight: 500;
	line-height: 1.3;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

body.dwgc-checkout.woocommerce-order-received .breakdance-woocommerce .woocommerce-thankyou-order-received::before {
	content: none;
	display: none;
}

/* Section headings: "Pasūtījuma informācija", "Norēķinu adrese". */
body.dwgc-checkout.woocommerce-order-received .breakdance-woocommerce .woocommerce-order-details__title,
body.dwgc-checkout.woocommerce-order-received .breakdance-woocommerce .woocommerce-column__title {
	color: var(--dwgc-ink);
	font-size: 1.25rem;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

/* Order number, date, total, payment method: small label over the value. */
body.dwgc-checkout.woocommerce-order-received .breakdance-woocommerce ul.woocommerce-order-overview {
	border: 1px solid var(--dwgc-line);
	border-radius: 0;
	box-shadow: none;
}

body.dwgc-checkout.woocommerce-order-received .breakdance-woocommerce ul.woocommerce-order-overview li {
	gap: 8px;
	color: var(--dwgc-muted);
	font-size: 0.75rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

body.dwgc-checkout.woocommerce-order-received .breakdance-woocommerce ul.woocommerce-order-overview li strong {
	color: var(--dwgc-ink);
	font-size: 1rem;
	font-weight: 500;
	letter-spacing: 0;
	text-transform: none;
}

/* The line items table. */
body.dwgc-checkout.woocommerce-order-received .breakdance-woocommerce table.order_details {
	border: 1px solid var(--dwgc-line);
	border-radius: 0;
	background: transparent;
	color: var(--dwgc-ink);
}

body.dwgc-checkout.woocommerce-order-received .breakdance-woocommerce table.order_details th,
body.dwgc-checkout.woocommerce-order-received .breakdance-woocommerce table.order_details td {
	border-color: var(--dwgc-line);
	background: transparent;
	color: var(--dwgc-ink);
}

body.dwgc-checkout.woocommerce-order-received .breakdance-woocommerce table.order_details thead th {
	color: var(--dwgc-muted);
	font-size: 0.75rem;
	font-weight: 400;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

body.dwgc-checkout.woocommerce-order-received .breakdance-woocommerce table.order_details td.product-name a {
	color: var(--dwgc-ink);
	text-decoration: none;
}

body.dwgc-checkout.woocommerce-order-received .breakdance-woocommerce table.order_details td.product-name a:hover {
	color: var(--dwgc-accent);
}

body.dwgc-checkout.woocommerce-order-received .breakdance-woocommerce table.order_details .product-quantity {
	color: var(--dwgc-muted);
}

/* Billing address. */
body.dwgc-checkout.woocommerce-order-received .breakdance-woocommerce .woocommerce-customer-details {
	border: 1px solid var(--dwgc-line);
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}

body.dwgc-checkout.woocommerce-order-received .breakdance-woocommerce .woocommerce-customer-details address {
	padding: 16px 18px;
	border: 1px solid var(--dwgc-line);
	border-radius: 0;
	color: var(--dwgc-ink);
	font-style: normal;
}

/* ---------------------------------------------------------------------
 * Empty cart — a short line and a way back to the gift cards
 * ------------------------------------------------------------------ */

/* Breakdance's cart lays its wrapper out as a row (items beside totals), which
   put the empty message and its button side by side at desktop width. */
body.dwgc-checkout .woocommerce:has(> .wc-empty-cart-message) {
	flex-direction: column;
	align-items: center;
	padding-top: 48px;
}

body.dwgc-checkout .wc-empty-cart-message,
body.dwgc-checkout .return-to-shop {
	max-width: 32rem;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

body.dwgc-checkout .wc-empty-cart-message .cart-empty,
body.dwgc-checkout .wc-empty-cart-message .cart-empty.woocommerce-info {
	margin: 0 0 28px;
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
	color: var(--dwgc-ink);
	font-size: 1.25rem;
	font-weight: 400;
	line-height: 1.4;
	text-align: center;
}

body.dwgc-checkout .wc-empty-cart-message .cart-empty::before {
	content: none;
	display: none;
}

body.dwgc-checkout .return-to-shop {
	margin-top: 0;
	margin-bottom: 64px;
}

body.dwgc-checkout .return-to-shop .button.wc-backward,
body.dwgc-checkout .return-to-shop a.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-height: 56px;
	padding: 16px 36px;
	border: 1px solid var(--dwgc-accent);
	border-radius: 0;
	background: var(--dwgc-accent);
	box-shadow: none;
	color: var(--dwgc-on-accent);
	font-family: inherit;
	font-size: 0.9375rem;
	font-weight: 500;
	line-height: 1;
	letter-spacing: 0.08em;
	text-decoration: none;
	text-transform: uppercase;
	transition: background-color 0.14s ease, color 0.14s ease;
}

body.dwgc-checkout .return-to-shop .button.wc-backward:hover,
body.dwgc-checkout .return-to-shop a.button:hover {
	background: transparent;
	color: var(--dwgc-accent);
}

body.dwgc-checkout .return-to-shop .button.wc-backward:focus-visible {
	outline: 2px solid var(--dwgc-ink);
	outline-offset: 2px;
}