/* =========================================================================
   Med z Biofarmy — shop flow inside the prototype shell.

   Cart, checkout, order received and My Account. Everything from the opening
   comment down to the media queries is the proven block from version 0.2.7
   (assets/css/refresh.css, lines 605-1674) copied byte for byte, minus the old
   standalone checkout header — the prototype's own header renders instead — and
   with the two theme wrapper selectors re-pointed at our `.mbf-shop` container.
   The sections after the media queries are new: they replace the layout that
   WooCommerce's own stylesheets used to provide through floats.

   WooCommerce templates, fields, shipping, gateways and order handling are not
   touched anywhere in this file. It is styling only.
   ========================================================================= */

/* ==========================================================================
   Private shop-flow preview: cart, checkout and order received.
   Mirrors the storefront design system (Spectral / Karla, honey accent,
   cream surfaces, 16px cards, pill buttons). WooCommerce fields, shipping,
   payment gateways and order handling are untouched — this is styling only.
   ========================================================================== */
.mbf-checkout-preview {
  --mbf-paper: #f6efe2;
  --mbf-surface: #fbf6ec;
  --mbf-ink: #3a2c1a;
  --mbf-moss: #6f5b40;
  --mbf-muted: #6f5b40;
  --mbf-honey: #c8841f;
  --mbf-honey-deep: #5a3a0c;
  --mbf-line: #e4d7c0;
  --mbf-deep: #2a2014;
  --mbf-radius: 16px;
  --mbf-wrap: 1200px;
  /* The order summary sits a shade darker than the billing card. */
  --mbf-summary: #f3e7d3;
  --mbf-summary-line: #e6d3b2;
  --mbf-display: "Spectral", Georgia, serif;
  --mbf-body: "Karla", system-ui, sans-serif;
  --mbf-ring: 0 0 0 3px rgba(200, 132, 31, .22);
  --mbf-lift: 0 28px 50px -40px var(--mbf-deep);
  background: var(--mbf-paper);
  color: var(--mbf-ink);
  font-family: var(--mbf-body);
}


/* --- Progress band ------------------------------------------------------ */
.mbf-shop-intro {
  background: linear-gradient(180deg, #f2e2c8, #f6ecdb);
  border-bottom: 1px solid #ecdcbe;
  font-family: var(--mbf-body);
}
.mbf-shop-intro__inner { margin: 0 auto; max-width: var(--mbf-wrap, 1200px); padding: 40px 28px 34px; }
.mbf-shop-eyebrow {
  color: var(--mbf-honey-deep);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .18em;
  margin: 0 0 8px;
  text-transform: uppercase;
}
.mbf-shop-title {
  color: var(--mbf-deep);
  font-family: var(--mbf-display);
  font-size: clamp(30px, 4vw, 46px);
  font-weight: 600;
  letter-spacing: -.02em;
  line-height: 1.05;
  margin: 0;
}
.mbf-steps { display: flex; flex-wrap: wrap; gap: 10px; list-style: none; margin: 22px 0 0; padding: 0; }
.mbf-step {
  align-items: center;
  background: rgba(255, 255, 255, .5);
  border: 1.5px solid var(--mbf-line);
  border-radius: 999px;
  color: var(--mbf-moss);
  display: inline-flex;
  font-size: 14px;
  font-weight: 700;
  gap: 9px;
  padding: 8px 18px 8px 9px;
}
.mbf-step__dot {
  align-items: center;
  background: var(--mbf-paper);
  border-radius: 50%;
  color: var(--mbf-moss);
  display: inline-flex;
  font-size: 12px;
  font-weight: 800;
  height: 24px;
  justify-content: center;
  width: 24px;
}
.mbf-step.is-done { border-color: rgba(200, 132, 31, .45); color: var(--mbf-honey-deep); }
.mbf-step.is-done .mbf-step__dot { background: var(--mbf-honey); color: #fff; }
.mbf-step.is-current { background: var(--mbf-deep); border-color: var(--mbf-deep); color: var(--mbf-surface); }
.mbf-step.is-current .mbf-step__dot { background: var(--mbf-honey); color: #fff; }

/* --- Shared WooCommerce chrome ----------------------------------------- */
.mbf-checkout-preview .woocommerce { font-family: var(--mbf-body); }
.mbf-checkout-preview .woocommerce a.button,
.mbf-checkout-preview .woocommerce button.button,
.mbf-checkout-preview .woocommerce input.button,
.mbf-checkout-preview .woocommerce a.button.alt,
.mbf-checkout-preview .woocommerce button.button.alt {
  background: var(--mbf-honey);
  border: 1.5px solid transparent;
  border-radius: 999px;
  box-shadow: 0 10px 24px -12px var(--mbf-honey);
  color: #fff;
  font-family: var(--mbf-body);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
  overflow: hidden;
  padding: 13px 24px;
  position: relative;
  text-transform: none;
  transition: background .18s ease, transform .18s ease;
}
.mbf-checkout-preview .woocommerce a.button:hover,
.mbf-checkout-preview .woocommerce button.button:hover,
.mbf-checkout-preview .woocommerce input.button:hover,
.mbf-checkout-preview .woocommerce a.button.alt:hover,
.mbf-checkout-preview .woocommerce button.button.alt:hover {
  background: var(--mbf-honey-deep);
  color: #fff;
  transform: translateY(-1px);
}
.mbf-checkout-preview .woocommerce a.button.wc-backward,
.mbf-checkout-preview .woocommerce button[name="update_cart"] {
  background: transparent;
  border-color: var(--mbf-line);
  box-shadow: none;
  color: var(--mbf-ink);
}
.mbf-checkout-preview .woocommerce a.button.wc-backward:hover,
.mbf-checkout-preview .woocommerce button[name="update_cart"]:hover {
  background: transparent;
  border-color: var(--mbf-honey);
  color: var(--mbf-honey-deep);
}
.mbf-checkout-preview .woocommerce button.button:disabled,
.mbf-checkout-preview .woocommerce button.button[disabled] { filter: grayscale(.4); opacity: .5; }

.mbf-checkout-preview .woocommerce-message,
.mbf-checkout-preview .woocommerce-info,
.mbf-checkout-preview .woocommerce-error {
  background: var(--mbf-surface);
  border: 1px solid var(--mbf-line);
  border-left: 4px solid var(--mbf-honey);
  border-radius: 14px;
  border-top: 1px solid var(--mbf-line);
  color: var(--mbf-ink);
  font-size: 14px;
  line-height: 1.6;
  padding: 16px 20px 16px 24px;
}
.mbf-checkout-preview .woocommerce-error { border-left-color: #b4462a; }
.mbf-checkout-preview .woocommerce-message::before,
.mbf-checkout-preview .woocommerce-info::before,
.mbf-checkout-preview .woocommerce-error::before { display: none; }
.mbf-checkout-preview .woocommerce-message a,
.mbf-checkout-preview .woocommerce-info a { color: var(--mbf-honey-deep); font-weight: 700; }

/* --- Form controls ------------------------------------------------------ */
.mbf-checkout-preview .woocommerce form .form-row { float: none; margin: 0; padding: 0; width: 100%; }
.mbf-checkout-preview .woocommerce form .form-row label {
  color: var(--mbf-moss);
  display: block;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .02em;
  margin: 0 0 8px;
}
.mbf-checkout-preview .woocommerce form .form-row .required,
.mbf-checkout-preview .woocommerce .required { border: 0; color: var(--mbf-honey); text-decoration: none; }
body.mbf-checkout-preview .woocommerce form .form-row input.input-text,
body.mbf-checkout-preview .woocommerce form .form-row textarea,
body.mbf-checkout-preview .woocommerce form .form-row select,
body.mbf-checkout-preview .woocommerce form .form-row .select2-selection {
  background: #fffdf7;
  border: 1.5px solid var(--mbf-line);
  border-radius: 12px;
  box-shadow: none;
  box-sizing: border-box;
  color: var(--mbf-ink);
  font-family: var(--mbf-body);
  font-size: 15px;
  min-height: 48px;
  padding: 12px 16px;
  transition: border-color .15s ease, box-shadow .15s ease;
  width: 100% !important;
}
body.mbf-checkout-preview .woocommerce form .form-row input.input-text:focus,
body.mbf-checkout-preview .woocommerce form .form-row textarea:focus,
body.mbf-checkout-preview .woocommerce form .form-row select:focus {
  border-color: var(--mbf-honey);
  box-shadow: var(--mbf-ring);
  outline: none;
}
body.mbf-checkout-preview .woocommerce form .form-row input.input-text::placeholder,
body.mbf-checkout-preview .woocommerce form .form-row textarea::placeholder { color: #b3a186; }
.mbf-checkout-preview .woocommerce textarea { min-height: 118px; resize: vertical; }
.mbf-checkout-preview input[type="checkbox"],
.mbf-checkout-preview input[type="radio"] { accent-color: var(--mbf-honey); height: 17px; width: 17px; }
/* Single-country stores render the country as static text. */
.mbf-checkout-preview .woocommerce-input-wrapper > strong {
  align-items: center;
  background: var(--mbf-paper);
  border: 1.5px dashed var(--mbf-line);
  border-radius: 12px;
  color: var(--mbf-moss);
  display: flex;
  font-size: 15px;
  font-weight: 600;
  min-height: 48px;
  padding: 12px 16px;
}

/* --- Checkout layout ---------------------------------------------------- */
.mbf-checkout-preview .mbf-shop { padding: 44px 0 90px; }
/* This coupon widget duplicates WooCommerce's native coupon panel. */
body.mbf-checkout-preview.mbf-shop-checkout .wad-form-coupon { display: none !important; }
.mbf-checkout-preview .woocommerce-form-coupon-toggle { margin: 0 0 26px; }
/* The theme lays this notice out as a reversed flex row, which puts the link
   before the question it answers. Force plain inline text order. */
body.mbf-checkout-preview .woocommerce-form-coupon-toggle .woocommerce-info {
  border-left-width: 1px;
  border-style: dashed;
  display: block !important;
  flex-direction: row !important;
  justify-content: flex-start !important;
  padding: 16px 20px;
  text-align: left !important;
}
.mbf-checkout-preview .woocommerce-form-coupon-toggle .showcoupon { color: var(--mbf-honey-deep); font-weight: 800; }
.mbf-checkout-preview form.checkout_coupon {
  background: var(--mbf-surface);
  border: 1px solid var(--mbf-line);
  border-radius: var(--mbf-radius);
  padding: 22px;
}
/* The active theme has its own checkout hierarchy; keep that proven flow intact. */
.mbf-checkout-preview form.checkout { display: block; }
body.mbf-checkout-preview #customer_details { display: block !important; }
body.mbf-checkout-preview #customer_details .col-1,
body.mbf-checkout-preview #customer_details .col-2 { float: none; width: 100% !important; }
body.mbf-checkout-preview #customer_details .col-2 { margin-top: 30px; }
.mbf-checkout-preview #customer_details {
  background: var(--mbf-surface);
  border: 1px solid var(--mbf-line);
  border-radius: var(--mbf-radius);
  box-shadow: var(--mbf-lift);
  box-sizing: border-box;
  margin: 0 !important;
  padding: 34px;
}
.mbf-checkout-preview .woocommerce-billing-fields h3,
.mbf-checkout-preview #order_review_heading {
  color: var(--mbf-deep);
  font-family: var(--mbf-display);
  font-size: clamp(24px, 3vw, 32px);
  font-weight: 600;
  letter-spacing: -.01em;
  line-height: 1.1;
  margin: 0 0 22px;
}
.mbf-checkout-preview .woocommerce-shipping-fields h3,
.mbf-checkout-preview .woocommerce-additional-fields h3 {
  color: var(--mbf-ink);
  font-family: var(--mbf-body);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0;
  margin: 0 0 14px;
}
/* Field layout.
   Percentage widths, floats and reveal animations from the theme kept winning
   the specificity fight, so assets/js/checkout.js moves the fields we want
   paired into our own `.mbf-pair` wrapper. The wrapper is a plain column of
   flex items: floats, inline-block and clear all stop applying inside a flex
   container, which removes the whole class of bugs at the source. */
body.mbf-checkout-preview .mbf-fieldstack,
body.mbf-checkout-preview .woocommerce-billing-fields__field-wrapper,
body.mbf-checkout-preview .woocommerce-shipping-fields__field-wrapper,
body.mbf-checkout-preview .woocommerce-additional-fields__field-wrapper {
  align-items: stretch !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 22px !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}
body.mbf-checkout-preview .mbf-pair {
  align-items: start !important;
  display: grid !important;
  gap: 22px !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}
/* One reset for every row, wherever it now lives. */
body.mbf-checkout-preview .mbf-fieldstack > .form-row,
body.mbf-checkout-preview .mbf-pair > .form-row,
body.mbf-checkout-preview .woocommerce-billing-fields__field-wrapper > .form-row,
body.mbf-checkout-preview .woocommerce-shipping-fields__field-wrapper > .form-row {
  align-self: start !important;
  animation: none !important;
  bottom: auto !important;
  clear: none !important;
  display: block !important;
  flex: 0 0 auto !important;
  float: none !important;
  left: auto !important;
  margin: 0 !important;
  max-width: none !important;
  min-width: 0 !important;
  opacity: 1 !important;
  padding: 0 !important;
  position: relative !important;
  right: auto !important;
  top: auto !important;
  transform: none !important;
  transition: none !important;
  vertical-align: top !important;
  width: 100% !important;
}
/* Labels get a fixed slot so a one-line and a two-line label still leave their
   inputs on the same baseline. */
body.mbf-checkout-preview .mbf-fieldstack > .form-row > label,
body.mbf-checkout-preview .mbf-pair > .form-row > label,
body.mbf-checkout-preview .woocommerce-billing-fields__field-wrapper > .form-row > label,
body.mbf-checkout-preview .woocommerce-shipping-fields__field-wrapper > .form-row > label {
  align-items: flex-end;
  display: flex !important;
  float: none !important;
  line-height: 1.35;
  margin: 0 0 10px !important;
  min-height: 19px;
  padding: 0 !important;
  width: 100% !important;
}
body.mbf-checkout-preview .form-row .woocommerce-input-wrapper {
  display: block !important;
  float: none !important;
  width: 100% !important;
}
.mbf-checkout-preview .woocommerce-shipping-fields {
  border-top: 1px solid var(--mbf-line);
  margin-top: 30px;
  padding-top: 26px;
}
.mbf-checkout-preview .woocommerce-additional-fields {
  border-top: 1px solid var(--mbf-line);
  margin-top: 26px;
  padding-top: 26px;
}
.mbf-checkout-preview .woocommerce-shipping-fields > h3 > label { display: flex; align-items: center; gap: 10px; }

/* --- Order summary ------------------------------------------------------
   The heading and the table are two sibling elements, so they are styled as
   the top and bottom half of a single, slightly darker card. */
body.mbf-checkout-preview #order_review_heading {
  background: var(--mbf-summary);
  border: 1px solid var(--mbf-summary-line);
  border-bottom: 0;
  border-radius: var(--mbf-radius) var(--mbf-radius) 0 0;
  box-sizing: border-box;
  /* Must be flush with the billing card's top edge. */
  margin: 0 !important;
  padding: 26px 26px 0;
  width: 100%;
}
body.mbf-checkout-preview #order_review {
  background: var(--mbf-summary);
  border: 1px solid var(--mbf-summary-line);
  border-radius: 0 0 var(--mbf-radius) var(--mbf-radius);
  border-top: 0;
  box-shadow: var(--mbf-lift);
  box-sizing: border-box;
  color: var(--mbf-ink);
  margin: 0 !important;
  padding: 20px 26px 26px;
  width: 100%;
}
.mbf-checkout-preview #order_review table.shop_table {
  background: transparent;
  border: 0;
  border-collapse: collapse;
  border-radius: 0;
  color: inherit;
  margin: 0;
  width: 100%;
}
.mbf-checkout-preview #order_review table.shop_table th,
.mbf-checkout-preview #order_review table.shop_table td {
  border: 0;
  border-bottom: 1px solid var(--mbf-summary-line);
  color: inherit;
  font-size: 15px;
  padding: 14px 0;
  text-align: left;
}
.mbf-checkout-preview #order_review table.shop_table td { text-align: right; }
.mbf-checkout-preview #order_review table.shop_table thead th {
  color: var(--mbf-honey-deep);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  padding-top: 0;
  text-transform: uppercase;
}
/* The MEDZISÚČET heading belongs over its column of figures, not glued to the
   left edge of the cell. */
body.mbf-checkout-preview #order_review table.shop_table thead th.product-total,
body.mbf-checkout-preview #order_review table.shop_table thead th:last-child {
  padding-right: 0 !important;
  text-align: right !important;
}
.mbf-checkout-preview #order_review .cart_item td.product-name { color: var(--mbf-ink); font-weight: 600; text-align: left; }
.mbf-checkout-preview #order_review .product-quantity { color: var(--mbf-moss); font-weight: 400; }
.mbf-checkout-preview #order_review tfoot th { font-weight: 700; }
.mbf-checkout-preview #order_review .order-total th,
.mbf-checkout-preview #order_review .order-total td { border-bottom: 0; padding-bottom: 0; padding-top: 18px; }
.mbf-checkout-preview #order_review .order-total th { font-family: var(--mbf-body); font-size: 15px; }
.mbf-checkout-preview #order_review .order-total .amount,
.mbf-checkout-preview #order_review .order-total bdi {
  color: var(--mbf-deep);
  font-family: var(--mbf-display);
  font-size: 26px;
  font-weight: 700;
}
/* Shipping is the one row WooCommerce renders as a label (or a list of them)
   instead of a bare amount, so it needs pushing onto the same right edge as the
   other figures. */
body.mbf-checkout-preview #order_review .woocommerce-shipping-totals td,
body.mbf-checkout-preview #order_review .woocommerce-shipping-totals td ul,
body.mbf-checkout-preview #order_review .woocommerce-shipping-totals td li,
body.mbf-checkout-preview #order_review .shipping td,
body.mbf-checkout-preview #order_review .shipping td ul,
body.mbf-checkout-preview #order_review .shipping td li { text-align: right !important; }
/* With a single shipping method WooCommerce prints a bare label, which keeps
   the theme's left alignment and drifts away from the column of figures. */
body.mbf-checkout-preview #order_review .woocommerce-shipping-totals td label,
body.mbf-checkout-preview #order_review .shipping td label,
body.mbf-checkout-preview #order_review .woocommerce-shipping-methods label {
  color: var(--mbf-ink) !important;
  display: inline-block !important;
  float: none !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: right !important;
  width: auto !important;
}
body.mbf-checkout-preview #order_review .woocommerce-shipping-methods {
  list-style: none;
  margin: 0 !important;
  padding: 0 !important;
  text-align: right !important;
  width: 100%;
}
.mbf-checkout-preview #order_review .woocommerce-shipping-methods li { margin: 0 0 8px; }
.mbf-checkout-preview #order_review .woocommerce-shipping-methods li:last-child { margin-bottom: 0; }

/* --- Payment ------------------------------------------------------------ */
.mbf-checkout-preview #payment { background: transparent; border: 0; border-radius: 0; margin-top: 20px; padding: 0; }
.mbf-checkout-preview #payment ul.payment_methods {
  border: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  list-style: none;
  margin: 0;
  padding: 0;
}
/* The row is a plain block with the radio parked absolutely on the left and the
   label reserving that space with padding. Flex was fragile here: the theme
   takes the radio out of flow, the label then claimed the whole line and the
   text ran straight through the radio. Padding cannot be beaten that way. */
body.mbf-checkout-preview #payment ul.payment_methods > li {
  background: var(--mbf-surface);
  border: 1.5px solid var(--mbf-summary-line);
  border-radius: 14px;
  box-sizing: border-box !important;
  display: block !important;
  list-style: none;
  margin: 0 !important;
  overflow: hidden;
  padding: 0 !important;
  position: relative !important;
  transition: border-color .15s ease, background .15s ease;
  width: 100% !important;
}
.mbf-checkout-preview #payment ul.payment_methods > li:has(input:checked) {
  background: #fffdf7;
  border-color: var(--mbf-honey);
}
body.mbf-checkout-preview #payment ul.payment_methods > li input[type="radio"] {
  height: 17px !important;
  left: 20px !important;
  margin: 0 !important;
  position: absolute !important;
  right: auto !important;
  top: 18px !important;
  width: 17px !important;
  z-index: 1;
}
body.mbf-checkout-preview #payment ul.payment_methods > li > label {
  box-sizing: border-box !important;
  color: var(--mbf-ink);
  display: block !important;
  float: none !important;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.4;
  margin: 0 !important;
  padding: 15px 20px 15px 49px !important;
  width: 100% !important;
}
.mbf-checkout-preview #payment ul.payment_methods > li img { display: inline-block; max-height: 24px; width: auto; }
/* The theme/WooCommerce keep their own margin, padding, border and radius on the
   detail panel, which leaves it floating as a smaller inset box. Force the panel
   flush so it meets the card border edge to edge, with its content on the same
   left edge as the radio above it. */
body.mbf-checkout-preview #payment div.payment_box {
  background: var(--mbf-paper) !important;
  border: 0 !important;
  border-radius: 0 !important;
  border-top: 1px solid var(--mbf-summary-line) !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  clear: both !important;
  color: var(--mbf-ink);
  display: block;
  flex: 0 0 100%;
  float: none !important;
  font-size: 14px;
  line-height: 1.6;
  margin: 0 !important;
  max-width: none !important;
  padding: 20px !important;
  width: 100% !important;
}
.mbf-checkout-preview #payment div.payment_box::before { display: none; }
.mbf-checkout-preview #payment div.payment_box p { margin: 0 0 14px; }
.mbf-checkout-preview #payment div.payment_box p:last-child { margin-bottom: 0; }
.mbf-checkout-preview #payment .payment_box .form-row { margin: 0 0 14px; }
.mbf-checkout-preview #payment .payment_box .form-row:last-child { margin-bottom: 0; }
/* Stripe leaves empty placeholder rows behind, which read as a dead gap
   between the CVC field and the save-card checkbox. */
.mbf-checkout-preview #payment .payment_box .form-row:empty,
.mbf-checkout-preview #payment .payment_box p:empty,
.mbf-checkout-preview #payment .payment_box > div:empty { display: none !important; margin: 0 !important; }
.mbf-checkout-preview #payment .payment_box label { color: var(--mbf-moss); font-size: 13px; font-weight: 700; }
/* Checkbox rows put the input and its label side by side, so wrapped text
   stays aligned under itself instead of under the box. */
body.mbf-checkout-preview #payment .payment_box .form-row:has(> input[type="checkbox"]) {
  align-items: flex-start;
  display: flex;
  gap: 10px;
}
body.mbf-checkout-preview #payment .payment_box .form-row > input[type="checkbox"] { flex: 0 0 auto; margin: 2px 0 0; }
body.mbf-checkout-preview #payment .payment_box .form-row > input[type="checkbox"] + label {
  line-height: 1.5;
  margin: 0;
}
.mbf-checkout-preview #payment .wc-stripe-elements-field,
.mbf-checkout-preview #payment .wc-payment-form input,
.mbf-checkout-preview #payment .wc-credit-card-form input,
.mbf-checkout-preview #payment .StripeElement {
  background: #fffdf7;
  border: 1.5px solid var(--mbf-line);
  border-radius: 12px;
  box-sizing: border-box;
  min-height: 48px;
  padding: 14px 16px;
  width: 100%;
}
.mbf-checkout-preview #payment .wc-stripe-elements-field--focus,
.mbf-checkout-preview #payment .StripeElement--focus { border-color: var(--mbf-honey); box-shadow: var(--mbf-ring); }
.mbf-checkout-preview #payment .woocommerce-SavedPaymentMethods { list-style: none; margin: 0; padding: 0; }
/* Stack anything that lands in here, so a theme-injected extra submit button
   can never sit on top of WooCommerce's own one. */
.mbf-checkout-preview #payment .place-order {
  align-items: stretch;
  border: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 0;
  padding: 20px 0 0;
}
body.mbf-checkout-preview #payment .place-order > button,
body.mbf-checkout-preview #payment .place-order > input[type="submit"] {
  float: none !important;
  inset: auto !important;
  margin: 0 !important;
  overflow: hidden;
  /* Must stay positioned: the theme parks an absolutely positioned hover
     layer inside the button, which escapes and covers the page otherwise. */
  position: relative !important;
  transform: none !important;
  width: 100% !important;
}
/* That hover layer (span.qodef-outlined-button-background) fights our pill
   styling, so drop it across the whole flow. */
body.mbf-checkout-preview .qodef-outlined-button-background,
body.mbf-checkout-preview .qodef-button-background,
body.mbf-checkout-preview [class*="qodef"][class*="button-background"] { display: none !important; }
.mbf-checkout-preview #payment #place_order {
  background: var(--mbf-honey);
  border: 1.5px solid transparent;
  border-radius: 999px;
  box-shadow: 0 12px 26px -12px var(--mbf-honey);
  color: #fff;
  float: none;
  font-family: var(--mbf-body);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0;
  padding: 17px 26px;
  text-transform: none;
  transition: background .18s ease, transform .18s ease;
  width: 100%;
}
.mbf-checkout-preview #payment #place_order:hover {
  background: var(--mbf-honey-deep);
  color: #fff;
  transform: translateY(-1px);
}
/* Some themes and checkout add-ons inject a second submit button. #place_order
   is WooCommerce's own and the only one that must survive. */
body.mbf-checkout-preview form.checkout button[name="woocommerce_checkout_place_order"]:not(#place_order),
body.mbf-checkout-preview form.checkout input[name="woocommerce_checkout_place_order"]:not(#place_order),
body.mbf-checkout-preview form.checkout .place-order > button:not(#place_order),
body.mbf-checkout-preview form.checkout .place-order > input[type="submit"]:not(#place_order),
body.mbf-checkout-preview form.checkout [class*="wad-"] button[type="submit"],
body.mbf-checkout-preview form.checkout [class*="wad-"] input[type="submit"] { display: none !important; }
.mbf-checkout-preview .woocommerce-privacy-policy-text,
.mbf-checkout-preview #payment .woocommerce-privacy-policy-text {
  color: var(--mbf-moss);
  font-size: 13px;
  line-height: 1.6;
}
.mbf-checkout-preview .woocommerce-privacy-policy-text a { color: var(--mbf-honey-deep); font-weight: 700; }
.mbf-checkout-preview .woocommerce-terms-and-conditions-wrapper .form-row { margin-top: 12px; }
.mbf-checkout-preview .woocommerce-terms-and-conditions-wrapper label {
  align-items: flex-start;
  color: var(--mbf-ink) !important;
  display: flex;
  font-size: 13px;
  font-weight: 600;
  gap: 10px;
}
/* WooCommerce's AJAX curtain: keep it see-through so a stalled request never
   reads as a solid grey block sitting on top of the summary. */
body.mbf-checkout-preview .blockUI.blockOverlay {
  backdrop-filter: none !important;
  background: #f6efe2 !important;
  opacity: .45 !important;
}

/* --- Cart --------------------------------------------------------------- */
.mbf-checkout-preview .woocommerce-cart-form table.shop_table {
  background: var(--mbf-surface);
  border: 1px solid var(--mbf-line);
  border-collapse: separate;
  border-radius: var(--mbf-radius);
  border-spacing: 0;
  box-shadow: var(--mbf-lift);
  margin: 0;
  overflow: hidden;
}
.mbf-checkout-preview .woocommerce-cart-form table.shop_table th {
  border: 0;
  border-bottom: 1px solid var(--mbf-line);
  color: var(--mbf-honey-deep);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  padding: 18px 16px;
  text-transform: uppercase;
}
.mbf-checkout-preview .woocommerce-cart-form table.shop_table td {
  border: 0;
  border-bottom: 1px solid var(--mbf-line);
  color: var(--mbf-ink);
  font-size: 15px;
  padding: 18px 16px;
  vertical-align: middle;
}
.mbf-checkout-preview .woocommerce-cart-form table.shop_table tr:last-child td { border-bottom: 0; }
.mbf-checkout-preview .woocommerce-cart-form .product-thumbnail img {
  border-radius: 12px;
  height: 72px;
  object-fit: cover;
  width: 72px;
}
.mbf-checkout-preview .woocommerce-cart-form .product-name a {
  color: var(--mbf-deep);
  font-weight: 700;
  text-decoration: none;
}
.mbf-checkout-preview .woocommerce-cart-form .product-name a:hover { color: var(--mbf-honey-deep); }
.mbf-checkout-preview .woocommerce-cart-form .product-price,
.mbf-checkout-preview .woocommerce-cart-form .product-subtotal { color: var(--mbf-ink); font-weight: 700; }
.mbf-checkout-preview .woocommerce .quantity {
  background: var(--mbf-paper);
  border: 1.5px solid var(--mbf-line);
  border-radius: 999px;
  display: inline-flex;
  overflow: hidden;
  padding: 2px;
}
body.mbf-checkout-preview .woocommerce .quantity input.qty {
  background: transparent;
  border: 0;
  border-radius: 999px;
  color: var(--mbf-ink);
  font-family: var(--mbf-body);
  font-weight: 700;
  min-height: 40px;
  padding: 8px;
  text-align: center;
  width: 68px !important;
}
.mbf-checkout-preview .woocommerce-cart-form .product-remove a.remove {
  background: var(--mbf-paper) !important;
  color: var(--mbf-moss) !important;
  font-size: 18px;
  height: 28px;
  line-height: 26px;
  width: 28px;
}
.mbf-checkout-preview .woocommerce-cart-form .product-remove a.remove:hover {
  background: var(--mbf-honey) !important;
  color: #fff !important;
}
.mbf-checkout-preview .woocommerce-cart-form .coupon { align-items: center; display: flex; gap: 10px; }
body.mbf-checkout-preview .woocommerce-cart-form .coupon input.input-text {
  border-radius: 999px;
  max-width: 240px;
  width: auto !important;
}
.mbf-checkout-preview .cart-collaterals { margin-top: 34px; }
.mbf-checkout-preview .cart_totals {
  background: var(--mbf-surface);
  border: 1px solid var(--mbf-line);
  border-radius: var(--mbf-radius);
  box-shadow: var(--mbf-lift);
  padding: 26px;
}
.mbf-checkout-preview .cart_totals h2 {
  color: var(--mbf-deep);
  font-family: var(--mbf-display);
  font-size: 26px;
  font-weight: 600;
  letter-spacing: -.01em;
  margin: 0 0 18px;
  text-transform: none;
}
.mbf-checkout-preview .cart_totals table.shop_table {
  background: transparent;
  border: 0;
  border-collapse: collapse;
  margin: 0;
  width: 100%;
}
.mbf-checkout-preview .cart_totals table.shop_table th,
.mbf-checkout-preview .cart_totals table.shop_table td {
  border: 0;
  border-bottom: 1px solid var(--mbf-line);
  color: var(--mbf-ink);
  font-size: 15px;
  padding: 14px 0;
}
.mbf-checkout-preview .cart_totals table.shop_table td { text-align: right; }
.mbf-checkout-preview .cart_totals .order-total th,
.mbf-checkout-preview .cart_totals .order-total td { border-bottom: 0; padding-top: 18px; }
.mbf-checkout-preview .cart_totals .order-total .amount,
.mbf-checkout-preview .cart_totals .order-total bdi {
  color: var(--mbf-deep);
  font-family: var(--mbf-display);
  font-size: 26px;
  font-weight: 700;
}
.mbf-checkout-preview .wc-proceed-to-checkout { padding: 20px 0 0; }
.mbf-checkout-preview .wc-proceed-to-checkout a.checkout-button {
  display: block;
  font-size: 16px;
  padding: 17px 26px;
  text-align: center;
  width: 100%;
}
.mbf-checkout-preview .cart-empty,
.mbf-checkout-preview .woocommerce-info.cart-empty {
  font-family: var(--mbf-display);
  font-size: 22px;
}

/* --- Order received ----------------------------------------------------- */
/* The theme reaches this screen with three classes
   (.woocommerce-order-received .woocommerce-order .woocommerce-thankyou-order-received
   in main.min.css), so our two-class selectors lost and the thank-you sentence
   rendered in Montserrat instead of the display serif. These selectors add one
   level each — no !important needed. Measured on the order-received endpoint. */
.mbf-checkout-preview .woocommerce-order { margin: 0 auto; max-width: 860px; }
body.mbf-checkout-preview .woocommerce-notice.woocommerce-thankyou-order-received {
  color: var(--mbf-deep);
  font-family: var(--mbf-display);
  font-size: clamp(26px, 3.4vw, 38px);
  font-weight: 600;
  letter-spacing: -.01em;
  line-height: 1.15;
  margin: 0 0 26px;
}
body.mbf-checkout-preview ul.woocommerce-order-overview.order_details {
  background: var(--mbf-surface);
  border: 1px solid var(--mbf-line);
  border-radius: var(--mbf-radius);
  box-shadow: var(--mbf-lift);
  display: grid;
  gap: 0;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  list-style: none;
  margin: 0 0 32px;
  padding: 8px;
}
body.mbf-checkout-preview ul.woocommerce-order-overview.order_details li {
  border: 0;
  border-right: 1px solid var(--mbf-line);
  color: var(--mbf-moss);
  float: none;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  margin: 0;
  padding: 18px 16px;
  text-transform: uppercase;
  width: auto;
}
body.mbf-checkout-preview ul.woocommerce-order-overview.order_details li:last-child { border-right: 0; }
body.mbf-checkout-preview ul.woocommerce-order-overview.order_details li strong {
  color: var(--mbf-deep);
  display: block;
  font-family: var(--mbf-display);
  font-size: 19px;
  font-weight: 600;
  letter-spacing: 0;
  margin-top: 8px;
  text-transform: none;
}
.mbf-checkout-preview .woocommerce-order-details,
.mbf-checkout-preview .woocommerce-customer-details { margin-bottom: 32px; }
.mbf-checkout-preview .woocommerce-order-details__title,
.mbf-checkout-preview .woocommerce-column__title,
.mbf-checkout-preview .woocommerce-customer-details h2 {
  color: var(--mbf-deep);
  font-family: var(--mbf-display);
  font-size: 24px;
  font-weight: 600;
  letter-spacing: -.01em;
  margin: 0 0 16px;
  text-transform: none;
}
.mbf-checkout-preview .woocommerce-order table.shop_table,
.mbf-checkout-preview .woocommerce-customer-details address {
  background: var(--mbf-surface);
  border: 1px solid var(--mbf-line);
  border-collapse: separate;
  border-radius: var(--mbf-radius);
  border-spacing: 0;
  color: var(--mbf-ink);
  font-size: 15px;
  font-style: normal;
  line-height: 1.7;
  padding: 0;
}
.mbf-checkout-preview .woocommerce-customer-details address { padding: 22px 24px; }
.mbf-checkout-preview .woocommerce-order table.shop_table th,
.mbf-checkout-preview .woocommerce-order table.shop_table td {
  border: 0;
  border-bottom: 1px solid var(--mbf-line);
  color: var(--mbf-ink);
  padding: 16px 22px;
}
.mbf-checkout-preview .woocommerce-order table.shop_table thead th {
  color: var(--mbf-honey-deep);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.mbf-checkout-preview .woocommerce-order table.shop_table tfoot tr:last-child th,
.mbf-checkout-preview .woocommerce-order table.shop_table tfoot tr:last-child td { border-bottom: 0; }
.mbf-checkout-preview .woocommerce-order table.shop_table tfoot tr:last-child td .amount,
.mbf-checkout-preview .woocommerce-order table.shop_table tfoot tr:last-child td bdi {
  color: var(--mbf-deep);
  font-family: var(--mbf-display);
  font-size: 22px;
  font-weight: 700;
}
.mbf-checkout-preview .woocommerce-bacs-bank-details {
  background: var(--mbf-surface);
  border: 1px solid var(--mbf-line);
  border-radius: var(--mbf-radius);
  margin-bottom: 32px;
  padding: 22px 24px;
}
.mbf-checkout-preview .woocommerce-bacs-bank-details h2,
.mbf-checkout-preview .wc-bacs-bank-details-heading {
  color: var(--mbf-deep);
  font-family: var(--mbf-display);
  font-size: 22px;
  font-weight: 600;
  margin: 0 0 12px;
}
.mbf-checkout-preview .wc-bacs-bank-details { list-style: none; margin: 0; padding: 0; }
.mbf-checkout-preview .wc-bacs-bank-details li { border-bottom: 1px solid var(--mbf-line); padding: 10px 0; }
.mbf-checkout-preview .wc-bacs-bank-details li:last-child { border-bottom: 0; }

/* --- Desktop checkout grid ---------------------------------------------- */
@media (min-width: 981px) {
  .mbf-checkout-preview form.checkout {
    align-items: start;
    display: grid;
    gap: 0 38px;
    grid-template-columns: minmax(0, 1fr) minmax(360px, .78fr);
    grid-template-rows: auto auto 1fr;
  }
  .mbf-checkout-preview #customer_details { grid-column: 1; grid-row: 1 / span 3; }
  .mbf-checkout-preview #order_review_heading { align-self: start; grid-column: 2; grid-row: 1; }
  .mbf-checkout-preview #order_review { align-self: start; grid-column: 2; grid-row: 2; }
  .mbf-checkout-preview .cart-collaterals .cart_totals { float: none; margin-left: auto; width: min(440px, 100%); }
}

@media (max-width: 980px) {
  .mbf-checkout-header__inner { padding: 12px 20px; }
  .mbf-checkout-nav { display: none; }
  .mbf-checkout-preview form.checkout { display: block; }
  body.mbf-checkout-preview #order_review_heading { margin: 32px 0 0 !important; }
  .mbf-checkout-preview .mbf-shop { padding: 32px 0 64px; }
  .mbf-checkout-preview .cart_totals { width: 100%; }
}

@media (max-width: 600px) {
  .mbf-checkout-header__inner { padding: 10px 16px; }
  .mbf-checkout-brand img { height: 32px; }
  .mbf-checkout-brand strong { font-size: 17px; }
  .mbf-checkout-brand small { font-size: 9px; }
  .mbf-checkout-cart { font-size: 13px; padding: 8px 14px; }
  .mbf-shop-intro__inner { padding: 28px 16px 24px; }
  .mbf-steps { gap: 8px; }
  .mbf-step { font-size: 12px; padding: 6px 14px 6px 7px; }
  .mbf-step__dot { font-size: 11px; height: 20px; width: 20px; }
  .mbf-checkout-preview #customer_details { border-radius: 14px; padding: 20px; }
  body.mbf-checkout-preview #order_review_heading { border-radius: 14px 14px 0 0; padding: 20px 20px 0; }
  .mbf-checkout-preview #order_review { border-radius: 0 0 14px 14px; padding: 16px 20px 20px; }
  body.mbf-checkout-preview .mbf-pair { grid-template-columns: 1fr !important; }
  .mbf-checkout-preview .woocommerce-cart-form table.shop_table td { padding: 14px 10px; }
  .mbf-checkout-preview .woocommerce-cart-form .coupon { flex-wrap: wrap; }
  body.mbf-checkout-preview ul.woocommerce-order-overview.order_details { grid-template-columns: 1fr; }
  body.mbf-checkout-preview ul.woocommerce-order-overview.order_details li {
    border-bottom: 1px solid var(--mbf-line);
    border-right: 0;
  }
  body.mbf-checkout-preview ul.woocommerce-order-overview.order_details li:last-child { border-bottom: 0; }
}

/* =========================================================================
   NEW — layout for the prototype shell.

   Under the full takeover the theme's stylesheet is gone, so the wrappers and
   float clearing that used to come from it have to be supplied here. Nothing
   above this line is redefined except the two container paddings, which now
   also carry the side gutters.
   ========================================================================= */

/* --- Container ---------------------------------------------------------- */
.mbf-checkout-preview .mbf-shop {
  box-sizing: border-box;
  margin: 0 auto;
  max-width: var(--mbf-wrap);
  padding: 44px 28px 90px;
  width: 100%;
}
/* Floats inside WooCommerce's own markup have to be closed, otherwise the
   footer rises into the content. */
.mbf-checkout-preview .mbf-shop::after,
.mbf-checkout-preview .woocommerce::after,
.mbf-checkout-preview .woocommerce-cart-form::after,
.mbf-checkout-preview .cart-collaterals::after,
.mbf-checkout-preview .woocommerce-MyAccount-content::after,
.mbf-checkout-preview .woocommerce .col2-set::after {
  clear: both;
  content: "";
  display: table;
}
.mbf-checkout-preview .mbf-shop > .woocommerce { width: 100%; }
.mbf-checkout-preview .mbf-shop h2,
.mbf-checkout-preview .mbf-shop h3 { font-family: var(--mbf-display); }
.mbf-checkout-preview .mbf-shop p,
.mbf-checkout-preview .mbf-shop li,
.mbf-checkout-preview .mbf-shop td,
.mbf-checkout-preview .mbf-shop th { font-family: var(--mbf-body); }
.mbf-checkout-preview .mbf-shop a { color: var(--mbf-honey-deep); }
.mbf-checkout-preview .woocommerce-breadcrumb,
.mbf-checkout-preview .mbf-shop .woocommerce-products-header { display: none; }

/* --- Cart --------------------------------------------------------------
   The cart is rendered by `templates/cart-page.php`, so every class below is
   ours and the theme's cart markup is no longer involved. Two blocks: the
   items card (a form, because quantities and the coupon post to WooCommerce)
   and the summary card beside it.

   Only WooCommerce's own output inside the summary keeps WooCommerce class
   names — the shipping rows, the shipping calculator and the checkout button.
   ---------------------------------------------------------------------- */
body.mbf-shop-cart .mbf-cartx {
  box-sizing: border-box;
  display: grid;
  gap: 26px;
  width: 100%;
}

/* --- Cart: the items card ---------------------------------------------- */
body.mbf-shop-cart .mbf-cartx__items {
  background: var(--mbf-surface);
  border: 1px solid var(--mbf-line);
  border-radius: var(--mbf-radius);
  box-shadow: var(--mbf-lift);
  box-sizing: border-box;
  margin: 0;
  min-width: 0;
  overflow: hidden;
}
body.mbf-shop-cart .mbf-cartx__lines { display: block; }

/* One line per cart item. The areas are named, so the row keeps its shape on
   a narrow screen with nothing more than a different template. */
body.mbf-shop-cart .mbf-line {
  align-items: center;
  border-bottom: 1px solid var(--mbf-line);
  box-sizing: border-box;
  column-gap: 20px;
  display: grid;
  grid-template-areas: "thumb body qty total remove";
  grid-template-columns: 84px minmax(0, 1fr) auto 104px 28px;
  margin: 0;
  padding: 22px;
}
body.mbf-shop-cart .mbf-line:last-child { border-bottom: 0; }

body.mbf-shop-cart .mbf-line__thumb {
  background: var(--mbf-paper);
  border: 1px solid var(--mbf-line);
  border-radius: 14px;
  display: block;
  grid-area: thumb;
  height: 84px;
  overflow: hidden;
  width: 84px;
}
body.mbf-shop-cart .mbf-line__thumb img {
  display: block;
  height: 100%;
  object-fit: cover;
  width: 100%;
}

body.mbf-shop-cart .mbf-line__body {
  grid-area: body;
  min-width: 0;
}
/* Product names on this shop are set in capitals, so they need a touch of
   letter-spacing to stay readable at this size. */
body.mbf-shop-cart .mbf-line__name {
  font-family: var(--mbf-body);
  font-size: 17px;
  font-weight: 700;
  letter-spacing: .01em;
  line-height: 1.3;
  margin: 0;
  text-transform: none;
}
body.mbf-shop-cart .mbf-line__name,
body.mbf-shop-cart .mbf-line__name a {
  color: var(--mbf-deep);
  text-decoration: none;
}
body.mbf-shop-cart .mbf-line__name a:hover { color: var(--mbf-honey-deep); }

body.mbf-shop-cart .mbf-line__meta {
  color: var(--mbf-moss);
  font-size: 13px;
  line-height: 1.5;
  margin: 6px 0 0;
}
body.mbf-shop-cart .mbf-line__meta p { margin: 0; }
body.mbf-shop-cart .mbf-line__meta dl,
body.mbf-shop-cart .mbf-line__meta dt,
body.mbf-shop-cart .mbf-line__meta dd { display: inline; margin: 0; }

body.mbf-shop-cart .mbf-line__unit {
  align-items: baseline;
  color: var(--mbf-ink);
  display: flex;
  flex-wrap: wrap;
  font-size: 14px;
  gap: 8px;
  margin: 7px 0 0;
}
body.mbf-shop-cart .mbf-line__unit-label {
  color: var(--mbf-moss);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}
body.mbf-shop-cart .mbf-line__backorder {
  color: var(--mbf-honey-deep);
  font-size: 13px;
  margin: 6px 0 0;
}

body.mbf-shop-cart .mbf-line__qty { grid-area: qty; }

/* --- Cart: quantity stepper -------------------------------------------- */
body.mbf-shop-cart .mbf-qty {
  align-items: center;
  background: var(--mbf-paper);
  border: 1.5px solid var(--mbf-line);
  border-radius: 999px;
  box-sizing: border-box;
  display: inline-flex;
  gap: 2px;
  padding: 3px;
}
body.mbf-shop-cart .mbf-qty--fixed {
  color: var(--mbf-ink);
  font-weight: 700;
  padding: 8px 16px;
}
body.mbf-shop-cart .mbf-qty__btn {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 50%;
  box-shadow: none;
  color: var(--mbf-ink);
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  font-family: var(--mbf-body);
  font-size: 18px;
  font-weight: 700;
  height: 32px;
  justify-content: center;
  line-height: 1;
  min-height: 0;
  padding: 0;
  transition: background-color .15s ease, color .15s ease;
  width: 32px;
}
body.mbf-shop-cart .mbf-qty__btn:hover:not([disabled]) {
  background: var(--mbf-honey);
  color: #fff;
}
body.mbf-shop-cart .mbf-qty__btn[disabled] {
  cursor: default;
  opacity: .35;
}
body.mbf-shop-cart .mbf-qty__input {
  -moz-appearance: textfield;
  appearance: textfield;
  background: transparent;
  border: 0;
  box-shadow: none;
  color: var(--mbf-ink);
  font-family: var(--mbf-body);
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
  margin: 0;
  min-height: 32px;
  padding: 0;
  text-align: center;
  width: 42px;
}
/* The native spinners sit on top of the − and + buttons, so they go. */
body.mbf-shop-cart .mbf-qty__input::-webkit-inner-spin-button,
body.mbf-shop-cart .mbf-qty__input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  appearance: none;
  margin: 0;
}
body.mbf-shop-cart .mbf-qty__input:focus { outline: none; }
body.mbf-shop-cart .mbf-qty:focus-within {
  border-color: var(--mbf-honey);
  box-shadow: 0 0 0 3px var(--mbf-ring);
}

body.mbf-shop-cart .mbf-line__total {
  color: var(--mbf-deep);
  font-family: var(--mbf-display);
  font-size: 20px;
  font-weight: 700;
  grid-area: total;
  margin: 0;
  text-align: right;
}
body.mbf-shop-cart .mbf-line__total bdi { white-space: nowrap; }

body.mbf-shop-cart .mbf-line__remove {
  align-items: center;
  background: var(--mbf-paper);
  border-radius: 50%;
  color: var(--mbf-moss);
  display: flex;
  font-size: 18px;
  grid-area: remove;
  height: 28px;
  justify-content: center;
  line-height: 1;
  text-decoration: none;
  transition: background-color .15s ease, color .15s ease;
  width: 28px;
}
body.mbf-shop-cart .mbf-line__remove:hover {
  background: var(--mbf-honey);
  color: #fff;
}

/* While an update is on its way back the card stays put but stops taking
   clicks, so a double press cannot post twice. */
body.mbf-shop-cart .mbf-cart-busy {
  opacity: .6;
  pointer-events: none;
}

/* --- Cart: actions bar -------------------------------------------------- */
body.mbf-shop-cart .mbf-cartx__actions {
  align-items: center;
  border-top: 1px dashed var(--mbf-line);
  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: space-between;
  padding: 18px 22px;
}
body.mbf-shop-cart .mbf-coupon {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
body.mbf-shop-cart input.mbf-coupon__field {
  background: var(--mbf-paper);
  border: 1.5px solid var(--mbf-line);
  border-radius: 999px;
  box-sizing: border-box;
  color: var(--mbf-ink);
  font-family: var(--mbf-body);
  font-size: 15px;
  max-width: 220px;
  min-height: 46px;
  padding: 12px 18px;
  width: 220px;
}
body.mbf-shop-cart input.mbf-coupon__field:focus {
  border-color: var(--mbf-honey);
  box-shadow: 0 0 0 3px var(--mbf-ring);
  outline: none;
}

/* One button style, three weights: honey for the one action that moves the
   order forward, an outline for the coupon, quiet for the manual update. */
body.mbf-shop-cart button.mbf-btn {
  background: var(--mbf-honey);
  border: 1.5px solid transparent;
  border-radius: 999px;
  box-shadow: 0 8px 22px -12px var(--mbf-honey);
  color: #fff;
  cursor: pointer;
  font-family: var(--mbf-body);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
  min-height: 46px;
  padding: 13px 24px;
  text-transform: none;
  transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}
body.mbf-shop-cart button.mbf-btn:hover { background: var(--mbf-honey-deep); }
body.mbf-shop-cart button.mbf-btn--outline {
  background: transparent;
  border-color: var(--mbf-honey);
  box-shadow: none;
  color: var(--mbf-honey-deep);
}
body.mbf-shop-cart button.mbf-btn--outline:hover {
  background: var(--mbf-honey);
  color: #fff;
}
body.mbf-shop-cart button.mbf-btn--quiet {
  background: transparent;
  border-color: var(--mbf-line);
  box-shadow: none;
  color: var(--mbf-moss);
}
body.mbf-shop-cart button.mbf-btn--quiet:hover {
  background: var(--mbf-paper);
  border-color: var(--mbf-moss);
  color: var(--mbf-ink);
}

/* --- Cart: summary ----------------------------------------------------- */
body.mbf-shop-cart .mbf-cartx__summary {
  background: var(--mbf-summary);
  border: 1px solid var(--mbf-summary-line);
  border-radius: var(--mbf-radius);
  box-sizing: border-box;
  height: fit-content;
  min-width: 0;
  padding: 24px;
}
body.mbf-shop-cart .mbf-sum__title {
  color: var(--mbf-deep);
  font-family: var(--mbf-display);
  font-size: 26px;
  font-weight: 600;
  letter-spacing: -.01em;
  margin: 0 0 8px;
  text-transform: none;
}
body.mbf-shop-cart table.mbf-sum {
  background: transparent;
  border: 0;
  border-collapse: collapse;
  margin: 0;
  width: 100%;
}
body.mbf-shop-cart table.mbf-sum tbody,
body.mbf-shop-cart table.mbf-sum tr,
body.mbf-shop-cart table.mbf-sum th,
body.mbf-shop-cart table.mbf-sum td { border: 0; }
body.mbf-shop-cart table.mbf-sum tr {
  align-items: baseline;
  border-bottom: 1px dashed var(--mbf-summary-line);
  column-gap: 14px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 13px 0;
}
body.mbf-shop-cart table.mbf-sum th {
  color: var(--mbf-moss);
  font-family: var(--mbf-body);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .1em;
  padding: 0;
  text-align: left;
  text-transform: uppercase;
}
body.mbf-shop-cart table.mbf-sum td {
  color: var(--mbf-ink);
  font-size: 16px;
  font-weight: 700;
  padding: 0;
  text-align: right;
}
body.mbf-shop-cart table.mbf-sum tr.mbf-sum__row--coupon td { color: var(--mbf-honey-deep); }
body.mbf-shop-cart table.mbf-sum tr.mbf-sum__row--total {
  border-bottom: 0;
  padding-bottom: 4px;
  padding-top: 18px;
}
body.mbf-shop-cart table.mbf-sum tr.mbf-sum__row--total th { color: var(--mbf-ink); }
body.mbf-shop-cart table.mbf-sum tr.mbf-sum__row--total td,
body.mbf-shop-cart table.mbf-sum tr.mbf-sum__row--total .amount,
body.mbf-shop-cart table.mbf-sum tr.mbf-sum__row--total bdi {
  color: var(--mbf-deep);
  font-family: var(--mbf-display);
  font-size: 28px;
  font-weight: 700;
  line-height: 1.1;
}

/* Shipping is WooCommerce's own output: a label, or a list of methods, or the
   calculator. It gets the full width of the card and stacks under its
   heading, because a list of methods never fits beside one. */
body.mbf-shop-cart table.mbf-sum tr.shipping {
  grid-template-columns: minmax(0, 1fr);
  row-gap: 10px;
}
body.mbf-shop-cart table.mbf-sum tr.shipping td { text-align: left; }
body.mbf-shop-cart table.mbf-sum ul#shipping_method {
  display: grid;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
}
body.mbf-shop-cart table.mbf-sum ul#shipping_method li {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 0;
  text-indent: 0;
}
body.mbf-shop-cart table.mbf-sum ul#shipping_method label {
  color: var(--mbf-ink);
  font-size: 14px;
  font-weight: 600;
  margin: 0;
}
body.mbf-shop-cart table.mbf-sum .woocommerce-shipping-destination {
  color: var(--mbf-moss);
  font-size: 13px;
  font-weight: 400;
  margin: 4px 0 0;
}
body.mbf-shop-cart table.mbf-sum .shipping-calculator-button {
  color: var(--mbf-honey-deep);
  font-size: 13px;
  font-weight: 700;
}
body.mbf-shop-cart .shipping-calculator-form {
  display: grid;
  gap: 10px;
  margin: 10px 0 0;
}
body.mbf-shop-cart .shipping-calculator-form .form-row { margin: 0; }
body.mbf-shop-cart .shipping-calculator-form input.input-text,
body.mbf-shop-cart .shipping-calculator-form select {
  background: var(--mbf-paper);
  border: 1.5px solid var(--mbf-summary-line);
  border-radius: 12px;
  box-sizing: border-box;
  color: var(--mbf-ink);
  font-family: var(--mbf-body);
  font-size: 14px;
  padding: 11px 14px;
  width: 100%;
}

/* The one solid honey button on the page. */
body.mbf-shop-cart .mbf-sum__cta { padding: 18px 0 0; }
body.mbf-shop-cart .mbf-sum__cta .wc-proceed-to-checkout { margin: 0; padding: 0; }
/* The theme sets a.button with !important and was winning here, so the cart's
   primary button rendered in theme grey at 265px instead of honey at full width.
   Measured on production: even an inline background lost to it. Only the three
   declarations the theme touches insist. */
body.mbf-shop-cart .mbf-sum__cta a.checkout-button,
body.mbf-shop-cart .mbf-sum__cta a.button {
  background: var(--mbf-honey) !important;
  border: 1.5px solid transparent;
  border-radius: 999px;
  box-shadow: 0 10px 26px -14px var(--mbf-honey);
  box-sizing: border-box;
  color: #fff !important;
  display: block;
  font-family: var(--mbf-body);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0;
  margin: 0;
  padding: 17px 26px;
  text-align: center;
  text-decoration: none;
  text-transform: none;
  transition: background-color .18s ease;
  width: 100% !important;
}
body.mbf-shop-cart .mbf-sum__cta a.checkout-button:hover,
body.mbf-shop-cart .mbf-sum__cta a.button:hover { background: var(--mbf-honey-deep) !important; }

body.mbf-shop-cart .mbf-cart-back {
  color: var(--mbf-honey-deep);
  display: block;
  font-size: 14px;
  font-weight: 700;
  margin: 16px 0 0;
  text-align: center;
  text-decoration: none;
}
body.mbf-shop-cart .mbf-cart-back:hover { text-decoration: underline; }

/* --- Cart: cross-sells ------------------------------------------------- */
body.mbf-shop-cart .cross-sells { margin: 34px 0 0; }
body.mbf-shop-cart .cross-sells > h2 {
  color: var(--mbf-deep);
  font-family: var(--mbf-display);
  font-size: 26px;
  font-weight: 600;
  margin: 0 0 18px;
}

/* --- Cart: empty ------------------------------------------------------- */
body.mbf-shop-cart .mbf-cartx--empty {
  background: var(--mbf-surface);
  border: 1px solid var(--mbf-line);
  border-radius: var(--mbf-radius);
  box-shadow: var(--mbf-lift);
  padding: 54px 30px;
  text-align: center;
}
body.mbf-shop-cart .mbf-cartx__empty-title {
  color: var(--mbf-deep);
  font-family: var(--mbf-display);
  font-size: 26px;
  font-weight: 600;
  margin: 0;
}
body.mbf-shop-cart .mbf-cartx__empty-note {
  color: var(--mbf-moss);
  font-size: 15px;
  margin: 10px 0 24px;
}
body.mbf-shop-cart a.mbf-cartx__empty-btn {
  background: var(--mbf-honey);
  border-radius: 999px;
  color: #fff;
  display: inline-block;
  font-size: 15px;
  font-weight: 700;
  padding: 15px 30px;
  text-decoration: none;
}
body.mbf-shop-cart a.mbf-cartx__empty-btn:hover { background: var(--mbf-honey-deep); }

/* --- Cart: items and summary side by side ------------------------------- */
@media (min-width: 981px) {
  body.mbf-shop-cart .mbf-cartx {
    align-items: start;
    column-gap: 36px;
    grid-template-columns: minmax(0, 1fr) 340px;
  }
  body.mbf-shop-cart .mbf-cartx__items { grid-column: 1; }
  /* The summary follows the list down the page. An ancestor with
     `overflow-x: hidden` would cancel this, so the shell opts out on the
     cart. */
  body.mbf-shop-cart .mbf-cartx__summary {
    grid-column: 2;
    position: sticky;
    top: 104px;
  }
  body.admin-bar.mbf-shop-cart .mbf-cartx__summary { top: 136px; }
  body.mbf-shop-cart .app { overflow: visible; }
}

/* --- Cart: narrow screens ---------------------------------------------- */
@media (max-width: 860px) {
  body.mbf-shop-cart .mbf-line {
    column-gap: 16px;
    grid-template-areas:
      "thumb body  remove"
      "thumb qty   total";
    /* The third column was a fixed 28px, sized for the round × in the first row.
       The line total shares that column in the second row, so "22,00 €" at 18px
       spilled out of it and the card's overflow:hidden cut the euro sign off.
       `auto` lets the column take the wider of the two. */
    grid-template-columns: 72px minmax(0, 1fr) auto;
    padding: 18px;
    row-gap: 12px;
  }
  body.mbf-shop-cart .mbf-line__thumb { height: 72px; width: 72px; }
  body.mbf-shop-cart .mbf-line__name { font-size: 16px; }
  body.mbf-shop-cart .mbf-line__qty { justify-self: start; }
  body.mbf-shop-cart .mbf-line__remove { justify-self: end; }
  body.mbf-shop-cart .mbf-line__total { font-size: 18px; white-space: nowrap; }
}

@media (max-width: 560px) {
  body.mbf-shop-cart .mbf-cartx__actions {
    align-items: stretch;
    flex-direction: column;
    padding: 16px 18px;
  }
  body.mbf-shop-cart .mbf-coupon { flex-wrap: nowrap; }
  body.mbf-shop-cart input.mbf-coupon__field { flex: 1 1 120px; max-width: none; width: auto; }
  body.mbf-shop-cart .mbf-cartx__summary { padding: 20px; }
}

/* --- Quality floor ----------------------------------------------------- */
body.mbf-checkout-preview a:focus-visible,
body.mbf-checkout-preview button:focus-visible,
body.mbf-checkout-preview input:focus-visible,
body.mbf-checkout-preview select:focus-visible,
body.mbf-checkout-preview textarea:focus-visible {
  outline: 2px solid var(--mbf-honey);
  outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
  body.mbf-checkout-preview *,
  body.mbf-checkout-preview *::before,
  body.mbf-checkout-preview *::after {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
  }
}

/* --- My Account --------------------------------------------------------- */
/* The navigation is a row of pills above a single content card. WooCommerce's
   own two-column float layout is dropped, so nothing can escape its container. */
body.mbf-checkout-preview .woocommerce-MyAccount-navigation,
body.mbf-checkout-preview .woocommerce-MyAccount-content {
  box-sizing: border-box;
  float: none !important;
  margin: 0;
  width: 100% !important;
}
body.mbf-checkout-preview .woocommerce-MyAccount-navigation ul {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  list-style: none;
  margin: 0 0 26px;
  padding: 0;
}
body.mbf-checkout-preview .woocommerce-MyAccount-navigation li { margin: 0; padding: 0; }
body.mbf-checkout-preview .woocommerce-MyAccount-navigation li a {
  background: var(--mbf-surface);
  border: 1.5px solid var(--mbf-line);
  border-radius: 999px;
  color: var(--mbf-ink);
  display: inline-block;
  font-size: 14px;
  font-weight: 700;
  padding: 10px 20px;
  text-decoration: none;
  transition: border-color .15s ease, color .15s ease;
}
body.mbf-checkout-preview .woocommerce-MyAccount-navigation li a:hover {
  border-color: var(--mbf-honey);
  color: var(--mbf-honey-deep);
}
body.mbf-checkout-preview .woocommerce-MyAccount-navigation li.is-active a {
  background: var(--mbf-deep);
  border-color: var(--mbf-deep);
  color: var(--mbf-surface);
}
body.mbf-checkout-preview .woocommerce-MyAccount-content {
  background: var(--mbf-surface);
  border: 1px solid var(--mbf-line);
  border-radius: var(--mbf-radius);
  box-shadow: var(--mbf-lift);
  padding: 34px;
}
.mbf-checkout-preview .woocommerce-MyAccount-content > p:first-child { margin-top: 0; }
.mbf-checkout-preview .woocommerce-MyAccount-content h2,
.mbf-checkout-preview .woocommerce-MyAccount-content h3,
.mbf-checkout-preview .woocommerce-MyAccount-content legend {
  color: var(--mbf-deep);
  font-family: var(--mbf-display);
  font-size: 24px;
  font-weight: 600;
  letter-spacing: -.01em;
  margin: 0 0 18px;
  text-transform: none;
}
.mbf-checkout-preview .woocommerce-MyAccount-content fieldset {
  border: 0;
  border-top: 1px solid var(--mbf-line);
  margin: 30px 0 0;
  padding: 26px 0 0;
}
.mbf-checkout-preview .woocommerce-MyAccount-content p { color: var(--mbf-ink); font-size: 15px; line-height: 1.7; }
.mbf-checkout-preview .woocommerce-MyAccount-content .woocommerce-Address-title h3 { font-size: 20px; }
body.mbf-checkout-preview .woocommerce-EditAccountForm .clear { display: none; }
body.mbf-checkout-preview .woocommerce-EditAccountForm > p.form-row,
body.mbf-checkout-preview .woocommerce-EditAccountForm fieldset > p.form-row,
body.mbf-checkout-preview .woocommerce-address-fields .form-row,
body.mbf-checkout-preview .woocommerce-MyAccount-content form .form-row { margin: 0 0 22px; }
body.mbf-checkout-preview .woocommerce-MyAccount-content form .form-row:last-of-type { margin-bottom: 0; }
body.mbf-checkout-preview .woocommerce-MyAccount-content .woocommerce-Button,
body.mbf-checkout-preview .woocommerce-MyAccount-content button.button { margin-top: 8px; }

/* Order and download tables. */
body.mbf-checkout-preview .woocommerce-MyAccount-content table.shop_table,
body.mbf-checkout-preview .woocommerce-MyAccount-content table.woocommerce-orders-table {
  background: var(--mbf-paper);
  border: 1px solid var(--mbf-line);
  border-collapse: separate;
  border-radius: 14px;
  border-spacing: 0;
  margin: 0;
  width: 100%;
}
body.mbf-checkout-preview .woocommerce-MyAccount-content table.shop_table th {
  border: 0;
  border-bottom: 1px solid var(--mbf-line);
  color: var(--mbf-honey-deep);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  padding: 16px 18px;
  text-align: left;
  text-transform: uppercase;
}
body.mbf-checkout-preview .woocommerce-MyAccount-content table.shop_table td {
  border: 0;
  border-bottom: 1px solid var(--mbf-line);
  color: var(--mbf-ink);
  font-size: 15px;
  padding: 16px 18px;
  vertical-align: middle;
}
body.mbf-checkout-preview .woocommerce-MyAccount-content table.shop_table tr:last-child td { border-bottom: 0; }
body.mbf-checkout-preview .woocommerce-MyAccount-content table.shop_table td.woocommerce-orders-table__cell-order-actions { text-align: right; }
body.mbf-checkout-preview .woocommerce-MyAccount-content table.shop_table a.button {
  font-size: 13px;
  padding: 9px 16px;
}

/* Addresses are two cards side by side, not floated columns. */
body.mbf-checkout-preview .woocommerce-Addresses.col2-set,
body.mbf-checkout-preview .woocommerce-MyAccount-content .u-columns {
  display: grid;
  gap: 24px;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}
body.mbf-checkout-preview .woocommerce-Addresses .col-1,
body.mbf-checkout-preview .woocommerce-Addresses .col-2,
body.mbf-checkout-preview .woocommerce-MyAccount-content .u-column1,
body.mbf-checkout-preview .woocommerce-MyAccount-content .u-column2 {
  box-sizing: border-box;
  float: none !important;
  margin: 0;
  width: 100% !important;
}
body.mbf-checkout-preview .woocommerce-Address address {
  background: var(--mbf-paper);
  border: 1px solid var(--mbf-line);
  border-radius: 14px;
  color: var(--mbf-ink);
  font-size: 15px;
  font-style: normal;
  line-height: 1.7;
  padding: 20px 22px;
}

/* --- Login and registration -------------------------------------------- */
body.mbf-checkout-preview .mbf-shop .woocommerce > .u-columns.col2-set,
body.mbf-checkout-preview .mbf-shop .woocommerce-account-fields ~ .u-columns {
  display: grid;
  gap: 26px;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}
body.mbf-checkout-preview .mbf-shop .woocommerce > .u-columns.col2-set > .u-column1,
body.mbf-checkout-preview .mbf-shop .woocommerce > .u-columns.col2-set > .u-column2 {
  box-sizing: border-box;
  float: none !important;
  margin: 0;
  width: 100% !important;
}
body.mbf-checkout-preview .mbf-shop form.woocommerce-form-login,
body.mbf-checkout-preview .mbf-shop form.woocommerce-form-register {
  background: var(--mbf-surface);
  border: 1px solid var(--mbf-line);
  border-radius: var(--mbf-radius);
  box-shadow: var(--mbf-lift);
  margin: 0;
  padding: 30px;
}
.mbf-checkout-preview .mbf-shop .u-columns > h2 {
  color: var(--mbf-deep);
  font-family: var(--mbf-display);
  font-size: 26px;
  font-weight: 600;
  margin: 0 0 16px;
}
body.mbf-checkout-preview .woocommerce-form-login__rememberme,
body.mbf-checkout-preview .woocommerce-form-login__submit + .lost_password { margin-top: 4px; }
body.mbf-checkout-preview .woocommerce-form-login label.woocommerce-form-login__rememberme {
  align-items: center;
  display: flex;
  gap: 10px;
  font-weight: 600;
}
.mbf-checkout-preview .woocommerce-LostPassword { margin: 14px 0 0; }
.mbf-checkout-preview .woocommerce-privacy-policy-text p { font-size: 13px; }

/* --- Responsive --------------------------------------------------------- */
@media (max-width: 980px) {
  .mbf-checkout-preview .mbf-shop { padding: 32px 20px 64px; }
  body.mbf-checkout-preview .woocommerce-MyAccount-content { padding: 24px; }
}
@media (max-width: 600px) {
  .mbf-checkout-preview .mbf-shop { padding: 26px 16px 56px; }
  body.mbf-checkout-preview .woocommerce-MyAccount-content { border-radius: 14px; padding: 20px; }
  body.mbf-checkout-preview .woocommerce-cart-form td.actions { justify-content: stretch; }
  body.mbf-checkout-preview .woocommerce-cart-form td.actions .coupon,
  body.mbf-checkout-preview .woocommerce-cart-form td.actions button[name="update_cart"] { width: 100%; }
  body.mbf-checkout-preview .woocommerce-cart-form td.actions .coupon input.input-text { flex: 1 1 auto; max-width: none; }
  body.mbf-checkout-preview .mbf-shop form.woocommerce-form-login,
  body.mbf-checkout-preview .mbf-shop form.woocommerce-form-register { padding: 20px; }
}
