/*
 * The WooCommerce purchase flow: the add-to-cart notice, the Cart block and the
 * Checkout block, in the house's own language.
 *
 * ── Skin, not surgery ───────────────────────────────────────────────────────
 *
 * Every rule here changes how something looks, never what it is or what it
 * does. No block is replaced, no markup is overridden, no script touches the
 * cart's state — the Blocks keep all their own behaviour, including the
 * quantity selector, which is already − value + with min / max / step and
 * keyboard handling built in. Update-safety follows from that: if a future
 * WooCommerce renames a class, the element falls back to WooCommerce's own
 * styling rather than breaking.
 *
 * ── Why the selectors start with `body` ─────────────────────────────────────
 *
 * The Blocks stylesheet and the theme.json button element both style these
 * elements at two or three classes of specificity. One leading element is
 * enough to win without `!important`, and keeps every rule inside the two block
 * roots (`.wp-block-woocommerce-cart`, `.wp-block-woocommerce-checkout`) or the
 * theme's own `.woo-area` wrapper — nothing here can reach any other page.
 *
 * Tokens: wood #1a2a1e, wood-deep #0f1a13, cream #f5f0e8, gold #c4a35a,
 * gold-dim #8a7340 (gold text on cream fails contrast; gold-dim passes).
 */

/* --- Shared: the site's primary button ----------------------------------- */

body .wp-block-woocommerce-cart .wc-block-cart__submit-button,
body .wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button,
body .wc-block-components-totals-coupon .wc-block-components-totals-coupon__button,
body .woo-area .woocommerce-message a.button,
body .woo-area .woocommerce-info a.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 3.5rem;
	padding: 0 2rem;
	border: 0;
	border-radius: 999px;
	background: var(--wp--preset--color--brand-wood);
	color: var(--wp--preset--color--brand-cream);
	font-family: var(--wp--preset--font-family--sans);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.28em;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	box-shadow: 0 10px 30px -12px rgba(45, 27, 16, 0.35);
	cursor: pointer;
	transition: background-color 0.35s var(--ease-luxury), color 0.35s var(--ease-luxury);
}

body .wp-block-woocommerce-cart .wc-block-cart__submit-button .wc-block-components-button__text,
body .wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button .wc-block-components-button__text {
	text-decoration: none;
}

body .wp-block-woocommerce-cart .wc-block-cart__submit-button:hover,
body .wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button:hover:not(:disabled),
body .wc-block-components-totals-coupon .wc-block-components-totals-coupon__button:hover:not(:disabled),
body .woo-area .woocommerce-message a.button:hover,
body .woo-area .woocommerce-info a.button:hover {
	background: var(--wp--preset--color--brand-gold);
	color: var(--wp--preset--color--brand-wood);
}

body .wp-block-woocommerce-cart .wc-block-cart__submit-button:focus-visible,
body .wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button:focus-visible,
body .wc-block-components-totals-coupon .wc-block-components-totals-coupon__button:focus-visible,
body .woo-area .woocommerce-message a.button:focus-visible,
body .woo-area .woocommerce-info a.button:focus-visible {
	outline: 2px solid var(--wp--preset--color--brand-gold);
	outline-offset: 3px;
}

/*
 * The two full-width calls to action carry long Slovene labels — "Nadaljuj na
 * zaključek nakupa" is 28 characters — so they track tighter than the site's
 * short buttons, and wrap onto a second line cleanly rather than overflow if a
 * narrow card ever forces it.
 */
body .wp-block-woocommerce-cart .wc-block-cart__submit-button,
body .wp-block-woocommerce-checkout .wc-block-components-checkout-place-order-button {
	width: 100%;
	min-height: 3.75rem;
	padding: 0.9rem 1.5rem;
	font-size: 0.6875rem;
	letter-spacing: 0.14em;
	line-height: 1.45;
}

/* --- The add-to-cart notice on a product page ---------------------------- */

/*
 * WooCommerce's classic notice: a green top rule, a lilac-grey panel and a grey
 * button. Same element, same role="alert", same "Prikaži košarico" link — only
 * dressed as the house would: a white card on a hairline, an olive bar for a
 * success and bark for an error, and the button that every other action uses.
 */
body .woo-area .woocommerce-message,
body .woo-area .woocommerce-info,
body .woo-area .woocommerce-error {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem 1.5rem;
	margin: 0 0 2rem;
	padding: 1rem 1.25rem 1rem 3.25rem;
	border: 1px solid rgba(45, 74, 47, 0.2);
	border-left: 4px solid var(--wp--preset--color--brand-olive);
	border-radius: 1.25rem;
	background: #fff;
	box-shadow: 0 14px 34px -24px rgba(15, 26, 19, 0.35);
	font-family: var(--wp--preset--font-family--sans);
	font-size: 0.9375rem;
	line-height: 1.5;
	color: var(--wp--preset--color--brand-wood-deep);
	list-style: none;
}

body .woo-area .woocommerce-error {
	border-color: rgba(61, 43, 26, 0.2);
	border-left-color: var(--wp--preset--color--brand-bark);
}

body .woo-area .woocommerce-message::after,
body .woo-area .woocommerce-info::after,
body .woo-area .woocommerce-error::after {
	content: none;
}

/* WooCommerce's own tick/info icon, recoloured and re-centred. */
body .woo-area .woocommerce-message::before,
body .woo-area .woocommerce-info::before,
body .woo-area .woocommerce-error::before {
	top: 50%;
	left: 1.25rem;
	transform: translateY(-50%);
	color: var(--wp--preset--color--brand-olive);
}

body .woo-area .woocommerce-error::before {
	color: var(--wp--preset--color--brand-bark);
}

body .woo-area .woocommerce-message a.button,
body .woo-area .woocommerce-info a.button {
	float: none;
	order: 2;
	min-height: 2.75rem;
	padding: 0 1.5rem;
	font-size: 0.625rem;
}

/* --- Shared: fields -------------------------------------------------------- */

/*
 * Blocks targets text fields as `.wc-block-components-form
 * .wc-block-components-text-input input[type=email]` — four classes' worth,
 * because an attribute selector counts as one. These match it and add one.
 */
body .wp-block-woocommerce-cart .wc-block-components-text-input input:is([type="text"], [type="email"], [type="tel"], [type="number"], [type="password"], [type="url"]),
body .wp-block-woocommerce-checkout .wc-block-components-form .wc-block-components-text-input input:is([type="text"], [type="email"], [type="tel"], [type="number"], [type="password"], [type="url"]),
body .wp-block-woocommerce-checkout .wc-block-components-text-input input:is([type="text"], [type="email"], [type="tel"], [type="number"], [type="password"], [type="url"]),
body .wp-block-woocommerce-checkout .wc-block-components-form .wc-block-components-textarea,
body .wp-block-woocommerce-checkout .wc-blocks-components-select .wc-blocks-components-select__container {
	border: 1px solid rgba(26, 42, 30, 0.18);
	border-radius: 0.875rem;
	background: #fff;
	box-shadow: none;
	font-family: var(--wp--preset--font-family--sans);
	color: var(--wp--preset--color--brand-wood-deep);
	transition: border-color 0.2s, box-shadow 0.2s;
}

body .wp-block-woocommerce-checkout .wc-blocks-components-select .wc-blocks-components-select__select {
	border: 0;
	background: transparent;
	font-family: var(--wp--preset--font-family--sans);
	color: var(--wp--preset--color--brand-wood-deep);
}

body .wp-block-woocommerce-cart .wc-block-components-text-input label,
body .wp-block-woocommerce-checkout .wc-block-components-text-input label,
body .wp-block-woocommerce-checkout .wc-blocks-components-select__label {
	font-family: var(--wp--preset--font-family--sans);
	color: var(--wp--preset--color--brand-stone);
}

body .wp-block-woocommerce-cart .wc-block-components-text-input input:is([type="text"], [type="email"], [type="tel"], [type="number"], [type="password"], [type="url"]):focus,
body .wp-block-woocommerce-checkout .wc-block-components-form .wc-block-components-text-input input:is([type="text"], [type="email"], [type="tel"], [type="number"], [type="password"], [type="url"]):focus,
body .wp-block-woocommerce-checkout .wc-block-components-text-input input:is([type="text"], [type="email"], [type="tel"], [type="number"], [type="password"], [type="url"]):focus,
body .wp-block-woocommerce-checkout .wc-block-components-form .wc-block-components-textarea:focus,
body .wp-block-woocommerce-checkout .wc-blocks-components-select .wc-blocks-components-select__container:focus-within {
	border-color: var(--wp--preset--color--brand-gold);
	box-shadow: 0 0 0 3px rgba(196, 163, 90, 0.25);
	outline: 0;
}

/* Errors keep WooCommerce's red: a warning should look like one. */
body .wp-block-woocommerce-checkout .wc-block-components-form .wc-block-components-text-input.has-error input:is([type="text"], [type="email"], [type="tel"], [type="number"], [type="password"], [type="url"]) {
	border-color: #cc1818;
}

/* --- Shared: small type ---------------------------------------------------- */

body .wp-block-woocommerce-cart .wc-block-components-product-metadata,
body .wp-block-woocommerce-checkout .wc-block-components-product-metadata,
body .wp-block-woocommerce-checkout .wc-block-checkout__guest-checkout-notice,
body .wp-block-woocommerce-checkout .wc-block-checkout__terms,
body .wp-block-woocommerce-checkout .wc-block-components-checkbox__label,
body .wp-block-woocommerce-checkout .wc-block-components-checkout-step__description,
body .wp-block-woocommerce-checkout .wc-block-components-address-form__address_2-toggle {
	font-family: var(--wp--preset--font-family--sans);
	font-size: 0.8125rem;
	line-height: 1.6;
	color: var(--wp--preset--color--brand-stone);
}

body .wp-block-woocommerce-checkout .wc-block-checkout__terms a {
	color: var(--wp--preset--color--brand-gold-dim);
	text-decoration: underline;
	text-underline-offset: 3px;
}

body .wp-block-woocommerce-checkout .wc-block-checkout__terms a:hover {
	color: var(--wp--preset--color--brand-wood);
}

/* --- Shared: product rows -------------------------------------------------- */

body .wp-block-woocommerce-cart .wc-block-components-product-name,
body .wp-block-woocommerce-checkout .wc-block-components-product-name {
	font-family: var(--wp--preset--font-family--serif);
	font-size: 1.0625rem;
	font-weight: 600;
	line-height: 1.3;
	color: var(--wp--preset--color--brand-wood-deep);
	text-decoration: none;
}

body .wp-block-woocommerce-cart a.wc-block-components-product-name:hover {
	color: var(--wp--preset--color--brand-gold-dim);
}

body .wp-block-woocommerce-cart .wc-block-components-product-price,
body .wp-block-woocommerce-cart .wc-block-cart-item__total,
body .wp-block-woocommerce-checkout .wc-block-components-product-price {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 600;
	color: var(--wp--preset--color--brand-wood);
}

body .wp-block-woocommerce-cart .wc-block-cart-item__image img,
body .wp-block-woocommerce-checkout .wc-block-components-order-summary-item__image img {
	border-radius: 0.75rem;
}

/* --- Shared: totals -------------------------------------------------------- */

body .wp-block-woocommerce-cart .wc-block-components-totals-wrapper,
body .wp-block-woocommerce-checkout .wc-block-components-totals-wrapper {
	border-top-color: rgba(196, 163, 90, 0.2);
}

body .wp-block-woocommerce-cart .wc-block-components-totals-item__label,
body .wp-block-woocommerce-cart .wc-block-components-totals-item__value,
body .wp-block-woocommerce-checkout .wc-block-components-totals-item__label,
body .wp-block-woocommerce-checkout .wc-block-components-totals-item__value {
	font-family: var(--wp--preset--font-family--sans);
	font-size: 0.875rem;
	color: var(--wp--preset--color--brand-stone);
}

/* The amount due is the one number on the page that must not be missed. */
body .wp-block-woocommerce-cart .wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
body .wp-block-woocommerce-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
	font-family: var(--wp--preset--font-family--serif);
	font-size: 1.25rem;
	font-weight: 600;
	color: var(--wp--preset--color--brand-wood-deep);
}

body .wp-block-woocommerce-cart .wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
body .wp-block-woocommerce-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
	font-family: var(--wp--preset--font-family--serif);
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--wp--preset--color--brand-wood-deep);
}

/* --- Shared: the coupon accordion ----------------------------------------- */

body .wc-block-components-totals-coupon .wc-block-components-panel__button {
	font-family: var(--wp--preset--font-family--sans);
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--wp--preset--color--brand-wood);
}

body .wc-block-components-totals-coupon .wc-block-components-panel__button:hover {
	color: var(--wp--preset--color--brand-gold-dim);
}

body .wc-block-components-totals-coupon .wc-block-components-panel__button:focus-visible {
	outline: 2px solid var(--wp--preset--color--brand-gold);
	outline-offset: 2px;
	border-radius: 0.5rem;
}

body .wc-block-components-totals-coupon .wc-block-components-panel__button svg {
	fill: currentColor;
}

body .wc-block-components-totals-coupon .wc-block-components-totals-coupon__button {
	min-height: 3rem;
	padding: 0 1.5rem;
	font-size: 0.625rem;
	box-shadow: none;
}

/* --- Cart ------------------------------------------------------------------ */

/* Column heads read as the site's gold eyebrows, not as table headers. */
body .wp-block-woocommerce-cart .wc-block-cart-items__header,
body .wp-block-woocommerce-cart .wc-block-cart__totals-title {
	font-family: var(--wp--preset--font-family--sans);
	font-size: 0.625rem;
	font-weight: 700;
	letter-spacing: 0.3em;
	text-transform: uppercase;
	color: var(--wp--preset--color--brand-gold-dim);
}

body .wp-block-woocommerce-cart .wc-block-cart-items,
body .wp-block-woocommerce-cart .wc-block-cart-items__row,
body .wp-block-woocommerce-cart .wc-block-cart-items__header {
	border-color: rgba(196, 163, 90, 0.2);
}

body .wp-block-woocommerce-cart .wc-block-cart-items td {
	border-color: rgba(196, 163, 90, 0.2);
}

/*
 * The summary column as a card, like the package cards on /paketi/. The totals
 * block IS the sidebar element here (one div, both classes), so this is one
 * compound selector, not a descendant one.
 */
body .wp-block-woocommerce-cart .wc-block-components-sidebar.wc-block-cart__sidebar {
	padding: 1.5rem 1.75rem 1.75rem;
	border: 1px solid rgba(196, 163, 90, 0.2);
	border-radius: 1.75rem;
	background: #fff;
	box-shadow: var(--luxury-shadow);
}

body .wp-block-woocommerce-cart .wc-block-cart__sidebar .wc-block-cart__totals-title {
	padding: 0 0 1rem;
}

/*
 * Blocks' own − value + control, restyled to match the product page's stepper.
 * Its behaviour — Store API updates, min / max / step, disabled ends, keyboard —
 * is untouched; only colour, shape and type change.
 */
body .wp-block-woocommerce-cart .wc-block-components-quantity-selector {
	overflow: hidden;
	border: 1px solid rgba(196, 163, 90, 0.45);
	border-radius: 999px;
	background: #fff;
}

body .wp-block-woocommerce-cart .wc-block-components-quantity-selector::after {
	border: 0;
}

body .wp-block-woocommerce-cart .wc-block-components-quantity-selector .wc-block-components-quantity-selector__input {
	border: 0;
	border-inline: 1px solid rgba(196, 163, 90, 0.25);
	border-radius: 0;
	background: transparent;
	font-family: var(--wp--preset--font-family--sans);
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--wp--preset--color--brand-wood-deep);
	box-shadow: none;
}

body .wp-block-woocommerce-cart .wc-block-components-quantity-selector .wc-block-components-quantity-selector__button {
	min-width: 2.5rem;
	border: 0;
	background: transparent;
	font-family: var(--wp--preset--font-family--sans);
	font-size: 1.125rem;
	color: var(--wp--preset--color--brand-wood);
	opacity: 1;
	transition: background-color 0.3s;
}

body .wp-block-woocommerce-cart .wc-block-components-quantity-selector .wc-block-components-quantity-selector__button:hover:not(:disabled) {
	background: rgba(196, 163, 90, 0.15);
}

body .wp-block-woocommerce-cart .wc-block-components-quantity-selector .wc-block-components-quantity-selector__button:disabled {
	color: rgba(26, 42, 30, 0.25);
	cursor: not-allowed;
}

body .wp-block-woocommerce-cart .wc-block-components-quantity-selector .wc-block-components-quantity-selector__button:focus-visible,
body .wp-block-woocommerce-cart .wc-block-components-quantity-selector .wc-block-components-quantity-selector__input:focus-visible {
	outline: 2px solid var(--wp--preset--color--brand-gold);
	outline-offset: -3px;
	box-shadow: none;
}

body .wp-block-woocommerce-cart .wc-block-cart-item__remove-link {
	font-family: var(--wp--preset--font-family--sans);
	font-size: 0.75rem;
	color: var(--wp--preset--color--brand-stone);
	text-decoration: underline;
	text-underline-offset: 3px;
}

body .wp-block-woocommerce-cart .wc-block-cart-item__remove-link:hover {
	color: var(--wp--preset--color--brand-bark-deep);
}

body .wp-block-woocommerce-cart .wc-block-cart-item__remove-link:focus-visible {
	outline: 2px solid var(--wp--preset--color--brand-gold);
	outline-offset: 2px;
}

/* --- Checkout -------------------------------------------------------------- */

body .wp-block-woocommerce-checkout .wc-block-components-checkout-step__title {
	font-family: var(--wp--preset--font-family--serif);
	font-size: 1.375rem;
	font-weight: 600;
	color: var(--wp--preset--color--brand-wood-deep);
}

/*
 * The order summary as the same card as the cart's.
 *
 * Scoped to the sidebar on purpose. On a narrow screen Blocks renders the
 * summary twice: collapsed in the sidebar at the top, and again in full above
 * the place-order button — the second copy is a "fill wrapper" carrying the
 * same block class, its own heading and an inner bordered box. Card styles on
 * that wrapper boxed the box and clipped the heading, so there it is the inner
 * box that becomes the card.
 */
body .wp-block-woocommerce-checkout .wc-block-checkout__sidebar .wp-block-woocommerce-checkout-order-summary-block,
body .wp-block-woocommerce-checkout .checkout-order-summary-block-fill {
	overflow: hidden;
	border: 1px solid rgba(196, 163, 90, 0.2);
	border-radius: 1.75rem;
	background: #fff;
	box-shadow: var(--luxury-shadow);
}

body .wp-block-woocommerce-checkout .checkout-order-summary-block-fill {
	margin-bottom: 1.5rem;
	border-radius: 1.25rem;
	box-shadow: none;
}

/* The collapsed summary bar at the top of a phone screen. */
body .wp-block-woocommerce-checkout .wc-block-checkout__sidebar .wc-block-components-checkout-order-summary__title {
	padding: 1rem 1.25rem;
	border: 0;
}

body .wp-block-woocommerce-checkout .wc-block-components-checkout-order-summary__title-price {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 600;
	color: var(--wp--preset--color--brand-wood-deep);
}

body .wp-block-woocommerce-checkout .checkout-order-summary-block-fill-wrapper > h2,
body .wp-block-woocommerce-checkout .checkout-order-summary-block-fill-wrapper .wc-block-components-title {
	margin: 0 0 1rem;
	font-family: var(--wp--preset--font-family--serif);
	font-size: 1.375rem;
	font-weight: 600;
	color: var(--wp--preset--color--brand-wood-deep);
}

body .wp-block-woocommerce-checkout .wc-block-components-checkout-order-summary__title-text {
	font-family: var(--wp--preset--font-family--serif);
	font-size: 1.25rem;
	font-weight: 600;
	color: var(--wp--preset--color--brand-wood-deep);
}

body .wp-block-woocommerce-checkout .wc-block-components-order-summary-item__quantity {
	border: 2px solid #fff;
	background: var(--wp--preset--color--brand-wood);
	color: var(--wp--preset--color--brand-cream);
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 700;
	box-shadow: none;
}

/*
 * Payment methods as separate cards. Blocks draws one outline round the whole
 * list and a rule between options; each option gets its own rounded card
 * instead, with the chosen one in gold.
 */
body .wp-block-woocommerce-checkout .wc-block-components-radio-control--highlight-checked::after {
	border: 0;
}

body .wp-block-woocommerce-checkout .wc-block-components-radio-control-accordion-option {
	margin-bottom: 0.75rem;
	border: 1px solid rgba(26, 42, 30, 0.14);
	border-radius: 1rem;
	background: #fff;
	box-shadow: none;
	transition: border-color 0.2s, box-shadow 0.2s;
}

body .wp-block-woocommerce-checkout .wc-block-components-radio-control-accordion-option::after {
	border: 0;
}

body .wp-block-woocommerce-checkout .wc-block-components-radio-control-accordion-option--checked-option-highlighted {
	border-color: var(--wp--preset--color--brand-gold);
	box-shadow: 0 0 0 1px var(--wp--preset--color--brand-gold);
}

body .wp-block-woocommerce-checkout .wc-block-components-radio-control__label,
body .wp-block-woocommerce-checkout .wc-block-components-payment-method-label {
	font-family: var(--wp--preset--font-family--sans);
	font-weight: 600;
	color: var(--wp--preset--color--brand-wood-deep);
}

body .wp-block-woocommerce-checkout .wc-block-components-radio-control-accordion-content {
	font-family: var(--wp--preset--font-family--sans);
	font-size: 0.8125rem;
	line-height: 1.6;
	color: var(--wp--preset--color--brand-stone);
}

body .wp-block-woocommerce-checkout .wc-block-components-radio-control .wc-block-components-radio-control__input {
	border-color: rgba(26, 42, 30, 0.4);
}

body .wp-block-woocommerce-checkout .wc-block-components-radio-control .wc-block-components-radio-control__input:checked {
	border-color: var(--wp--preset--color--brand-wood);
}

body .wp-block-woocommerce-checkout .wc-block-components-radio-control .wc-block-components-radio-control__input:checked::before {
	background: var(--wp--preset--color--brand-wood);
}

body .wp-block-woocommerce-checkout .wc-block-components-radio-control .wc-block-components-radio-control__input:focus-visible,
body .wp-block-woocommerce-checkout .wc-block-components-checkbox .wc-block-components-checkbox__input:focus-visible {
	outline: 2px solid var(--wp--preset--color--brand-gold);
	outline-offset: 2px;
}

body .wp-block-woocommerce-checkout .wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"] {
	border-color: rgba(26, 42, 30, 0.35);
	border-radius: 0.3rem;
}

body .wp-block-woocommerce-checkout .wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"]:checked {
	border-color: var(--wp--preset--color--brand-wood);
	background: var(--wp--preset--color--brand-wood);
}

body .wp-block-woocommerce-checkout .wc-block-components-checkbox .wc-block-components-checkbox__mark {
	fill: var(--wp--preset--color--brand-cream);
}

/* --- The empty basket ------------------------------------------------------ */

/*
 * The card inc/woocommerce-vouchers.php puts inside the Empty Cart block: a
 * gold hairline, the serif title, one line of help and one call to action, on
 * the same white card as the cart's summary. Compact on purpose — an empty
 * basket is a signpost, not a page.
 */
body .wp-block-woocommerce-cart .ps-empty-cart {
	display: flex;
	flex-direction: column;
	align-items: center;
	max-width: 34rem;
	margin: 0.5rem auto 0;
	padding: 3rem 2.5rem 3.25rem;
	border: 1px solid rgba(196, 163, 90, 0.2);
	border-radius: 1.75rem;
	background: #fff;
	box-shadow: var(--luxury-shadow);
	text-align: center;
}

body .wp-block-woocommerce-cart .ps-empty-cart__rule {
	display: block;
	width: 3rem;
	height: 1px;
	margin-bottom: 1.75rem;
	background: var(--wp--preset--color--brand-gold);
}

body .wp-block-woocommerce-cart .ps-empty-cart__title {
	margin: 0 0 0.75rem;
	font-family: var(--wp--preset--font-family--serif);
	font-size: 1.875rem;
	font-weight: 600;
	line-height: 1.2;
	color: var(--wp--preset--color--brand-wood-deep);
}

body .wp-block-woocommerce-cart .ps-empty-cart__text {
	max-width: 24rem;
	margin: 0 0 2rem;
	font-family: var(--wp--preset--font-family--sans);
	font-size: 0.9375rem;
	line-height: 1.7;
	color: var(--wp--preset--color--brand-stone);
}

body .wp-block-woocommerce-cart .ps-empty-cart__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 3.25rem;
	padding: 0 2.25rem;
	border-radius: 999px;
	background: var(--wp--preset--color--brand-wood);
	color: var(--wp--preset--color--brand-cream);
	font-family: var(--wp--preset--font-family--sans);
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.24em;
	text-decoration: none;
	text-transform: uppercase;
	box-shadow: 0 10px 30px -12px rgba(45, 27, 16, 0.35);
	transition: background-color 0.35s var(--ease-luxury), color 0.35s var(--ease-luxury);
}

body .wp-block-woocommerce-cart .ps-empty-cart__cta:hover {
	background: var(--wp--preset--color--brand-gold);
	color: var(--wp--preset--color--brand-wood);
}

body .wp-block-woocommerce-cart .ps-empty-cart__cta:focus-visible {
	outline: 2px solid var(--wp--preset--color--brand-gold);
	outline-offset: 3px;
}

@media (max-width: 480px) {
	body .wp-block-woocommerce-cart .ps-empty-cart {
		padding: 2.5rem 1.5rem 2.75rem;
		border-radius: 1.5rem;
	}

	body .wp-block-woocommerce-cart .ps-empty-cart__title {
		font-size: 1.5rem;
	}

	body .wp-block-woocommerce-cart .ps-empty-cart__cta {
		width: 100%;
	}
}

/*
 * The voucher-code box (the redemption shortcode under the Cart block) has
 * nothing to apply a code to while the basket is empty, so it steps aside and
 * returns the moment the filled cart renders. Keyed on the filled cart being
 * absent, not on the empty one being present: before the script runs, both
 * templates are in the page, and a basket with something in it must never
 * lose the box even for an instant.
 */
body:has(.wp-block-woocommerce-empty-cart-block):not(:has(.wp-block-woocommerce-filled-cart-block)) .ps-voucher-form {
	display: none;
}