How to remove the border in the "Buy it now" button in the product page? DAWN THEME

Topic summary

A user needed help removing the border that appears when hovering over the \

Summarized with AI on November 25. AI used: claude-sonnet-4-5-20250929.

I have been trying to remove the border on hover in the buy it now button but it is not working even with the border “none” property, I think I might have the wrong class selected, or maybe something else. Any why idea it is not working? Any help is much appreciated.

For further clarification please refer to the picture down below

URL: https://abbasigems.com/products/test

Password: testingpage

(Please navigate to the featured collection in the second section of the homepage and click “Test 1”)

Thank you,

In base.css line 1341 you should see this

.shopify-payment-button__button--unbranded:hover::after {
--border-offset: 1.3px;
// remove the box shadow below
box-shadow: 0 0 0 calc(var(--buttons-border-width) + var(--border-offset)) rgba(var(--color-button-text), var(--border-opacity)), 0 0 0 calc(var(--buttons-border-width) + 1px) rgba(var(--color-button), var(--alpha-button-background));
}
1 Like

@lunaworks Thank you so much! it worked!