/* Additions for the Stripe-backed store. Everything else uses the site's own Webflow styles. */
html.sf-cart-open { overflow: hidden; }

/* Order page: Webflow's layout stays hidden until cart.js has filled it in. */
.sf-loading { visibility: hidden; }
.sf-order-status { padding: 24px 0; opacity: .7; }

.sf-vat-note { font-size: 12px; color: #666; margin: -4px 0 12px; }

/* Email capture for free (trial) downloads, shown in the cart footer. */
.sf-free-email { margin: 0 0 16px; }
.sf-free-email[hidden], .sf-vat-note[hidden] { display: none; }
.sf-free-email .text-label { display: block; margin-bottom: 4px; }
.sf-free-email input[type="email"] { width: 100%; margin-bottom: 8px; }
.sf-optin { display: flex; gap: 8px; align-items: center; font-size: 12px; color: #666; cursor: pointer; }
.sf-gap-above { margin-top: 24px; }

/* Order page Downloads block: an even 16px between every line and row
   (block's top line, rows, invoice divider, bottom line). Buttons keep their size. */
.w-commerce-commercedownloadslist .download-item { margin-top: 16px; margin-bottom: 16px; }
.block-content-12 { padding-top: 0; padding-bottom: 0; }
.sf-invoice-sep { margin: 16px 0; }
/* Same width for "Download" and "View" so their edges line up. */
.download-item .button-small.downloads { min-width: 112px; box-sizing: border-box; text-align: center; }

/* Webflow stacks the order page below 992px. The Downloads block's closing
   divider then already closes the section, so drop the "Items in order"
   block's own opening divider and extra top padding (no doubled line). */
@media screen and (max-width: 991px) {
  .order-confirmation .order-summary-wrap { padding-top: 0; }
  .order-confirmation .order-items-2 > .separator:first-child { display: none; }
}