.is-style-button,
.wp-block-button {
    .wp-block-button__link.wp-element-button {
        border: 1px solid transparent;
        transition: all 0.25s;
    
        &:hover {
            background-color: transparent !important;
            color: var(--wp--preset--color--black) !important;
            border: 1px solid var(--wp--preset--color--black) !important;
        }
    }    

    &.is-style-arrow {
        .wp-block-button__link.wp-element-button {
            background-color: transparent;
            padding: 0;
            display: flex;
        
            &::before {
                content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="7.142" height="12.526" viewBox="0 0 7.142 12.526"><path d="M.214,12.32a.687.687,0,0,1,0-1L5.46,6.263.214,1.2a.687.687,0,0,1,0-1,.749.749,0,0,1,1.033,0l5.681,5.48a.688.688,0,0,1,.21.576.689.689,0,0,1-.21.577L1.247,12.32a.75.75,0,0,1-1.033,0Z" fill="%23d30"/></svg>');
                width: 7px;
                height: 13px;
                margin-right: 10px;
                margin-top: 0px;
            }

            &:hover {
                border: 0px;
            }
        }
    }
}

/* Hover states - cover and dark backgrounds */ 
.wp-block-cover,
.has-primary-background-color {
    .wp-block-button .wp-block-button__link:hover {
        border: 1px solid var(--wp--preset--color--white) !important;
        color: var(--wp--preset--color--white) !important;
    }
}

/* Hover states - all other backgrounds */
.wp-block-group:not(.has-primary-background-color),
.wp-block-group.has-secondary-background-color {
    .wp-block-cover {
        &.is-style-is-style-half-bleed-left,
        &.is-style-is-style-half-bleed-right,
        &.is-style-half-bleed-left,
        &.is-style-half-bleed-right {
            .wp-block-button {
                .wp-block-button__link {
                    &:hover {
                        border: 1px solid var(--wp--preset--color--black) !important;
                        color: var(--wp--preset--color--black) !important;
                    }

                    &.has-primary-color {
                        &.has-secondary-background-color {
                            &:hover {
                                border: 1px solid var(--wp--preset--color--white) !important;
                                color: var(--wp--preset--color--white) !important;
                            }
                        }
                    }
                }
            }
        }
    }
}