
/* Unified primary purchase/payment button across the storefront */
:root { --store-action-red: #f2382d; --store-action-red-hover: #d92d23; }
#buy-now, #place-order, #continue-pay, .continue-pay-btn,
.cart-summary .btn.red, .cart-summary a.btn.red, .payment-primary-action {
  box-sizing: border-box !important;
  min-height: 62px !important;
  border: 0 !important;
  border-radius: 15px !important;
  background: var(--store-action-red) !important;
  color: #fff !important;
  font-family: inherit !important;
  font-size: 17px !important;
  font-weight: 800 !important;
  letter-spacing: .01em !important;
  text-align: center !important;
  text-decoration: none !important;
  box-shadow: 0 9px 22px rgba(242,56,45,.22) !important;
  cursor: pointer !important;
  transition: background .18s ease, transform .18s ease, box-shadow .18s ease !important;
}
#buy-now:hover, #place-order:hover, #continue-pay:hover,
.continue-pay-btn:hover, .cart-summary .btn.red:hover {
  background: var(--store-action-red-hover) !important;
  box-shadow: 0 10px 24px rgba(217,45,35,.25) !important;
}
#buy-now:active, #place-order:active, #continue-pay:active,
.continue-pay-btn:active, .cart-summary .btn.red:active { transform: translateY(1px) !important; }

/* One bottom action rail, clear of the phone safe-area/home indicator. */
@media (max-width: 767px) {
  body:has(#buy-now), body:has(#place-order), body:has(#continue-pay) {
    padding-bottom: calc(100px + env(safe-area-inset-bottom)) !important;
  }
  #buy-now, #place-order, #continue-pay {
    position: fixed !important;
    left: 16px !important;
    right: 16px !important;
    bottom: max(14px, env(safe-area-inset-bottom)) !important;
    z-index: 1200 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    max-width: 720px !important;
    margin: 0 auto !important;
  }
}
/* Desktop: retain the same visual language without covering content. */
@media (min-width: 768px) {
  #buy-now, #place-order, #continue-pay {
    border-radius: 13px !important;
  }
}
/* Keep purchase controls aligned in product detail layout. */
.purchase-buttons #buy-now { flex: 1 1 100%; }
