/* Product page: name and price centered, same sizes as the Shopify store. */
.main-product__block-title .prod__title{justify-content:center;text-align:center}
.main-product__block-title h1{padding-right:0;font-size:21px;line-height:1.35}
.main-product__block-price .prod__reviews-and-prices,.main-product__block-price .f-price{justify-content:center}
.main-product__block-price .f-price-item{font-size:18px;line-height:1.4}
@media (min-width:768px){
  .main-product__block-title h1{font-size:30px;line-height:42px}
  .main-product__block-price .f-price-item{font-size:24px}
}

/* Add to cart filled with the store's navy (header colour); a lighter navy on hover. */
.main-product__block-buy_buttons .add-to-cart.sf__btn{background:#1d3557;border-color:#1d3557;color:#fff}
.main-product__block-buy_buttons .add-to-cart.sf__btn:hover,.main-product__block-buy_buttons .add-to-cart.sf__btn:focus{background:#2a4a75;border-color:#2a4a75!important;color:#fff!important}
/* After the click and until checkout opens (product.js): spinner + "Adding to cart…" / "Opening checkout…",
   and a lighter fill sweeping across the button, fast at first, then easing so it never looks stuck. */
.main-product__block-buy_buttons .add-to-cart.sf__btn{overflow:hidden}
.main-product__block-buy_buttons .add-to-cart.sf__btn::before{content:"";position:absolute;inset:0;background:rgba(255,255,255,.16);transform:scaleX(0);transform-origin:left center;pointer-events:none}
.form.product-form.adding .main-product__block-buy_buttons .add-to-cart.sf__btn::before{animation:rx-atc-fill 7s cubic-bezier(.1,.75,.25,1) forwards}
.main-product__block-buy_buttons .add-to-cart .atc-status{margin-left:8px}
@keyframes rx-atc-fill{to{transform:scaleX(.97)}}
@media (prefers-reduced-motion:reduce){.form.product-form.adding .main-product__block-buy_buttons .add-to-cart.sf__btn::before{animation:none;transform:scaleX(.6)}}
/* Payment methods right under the button, one row of Shopify-size badges (38 × 24, smaller on narrow phones). */
.main-product__block-buy_buttons .prod__form-error:empty{padding-top:0}
.main-product__block-buy_buttons+.main-product__block-custom_liquid{margin-top:14px}
.rx-payment-icons{display:flex;justify-content:space-between;align-items:center;gap:6px;margin:0;padding:0;list-style:none}
.rx-payment-icons li{flex:0 1 38px;min-width:0}
.rx-payment-icons svg{display:block;width:100%;height:auto;aspect-ratio:38/24}