SwiftUI Custom Card hoverEffect() Rounded Corners

Hi all,

I am currently working on a user interfacing using SwiftUI where I have created custom button cards which have a mask modifier containing a RoundedRectangle with a corner radius of 15. The cards are displayed properly in the interface but when hovering over card with the iPad cursor using the hoverEffect() modifier or tapping and holding to show a context menu the corners aren't rounded and you can see a space where the rounded corners should be.

Thanks!

Here is the code for the custom card.

var body: some View {
    Button(action: {}) {
        ZStack {
            Color("MainColor")
                
            VStack(spacing: 20) {
                Spacer()
                    
                Text("Card content here")
                    .font(.largeTitle)
                    .bold()
                    
                Spacer()
            }
            .padding()
        }
    }
    .contentShape(RoundedRectangle(cornerRadius: 15, style: .continuous))
    .buttonStyle(.plain)
    .mask(RoundedRectangle(cornerRadius: 15))
    .contextMenu {
        Button(action: {}) {
            Label("Edit", systemImage: "pencil")
        }
            
        Button(role: .destructive) {
            // Edit goes here
        } label: {
            Label("Delete", systemImage: "trash")
        }
    }
    .hoverEffect()
}