.wp-block-button>.wp-block-button__link,
input[type="submit"] {
    transition: transform 0.25s ease, 
                background-color 0.3s ease, 
                color 0.2s ease, 
                border-color 0.3s ease;
}

.wp-block-button:hover>.wp-block-button__link,
input[type="submit"]:hover {
    text-decoration: none;
}

.wp-block-button>.wp-block-button__link:active,
input[type="submit"]:active {
    transform: translateY(0);
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.1);
}

/* 
Button Style: Fill
Color combination: Stone on Yellow
*/
.wp-block-button>.wp-block-button__link,
input[type="submit"] {
    background-color: var(--wp--preset--color--primary-accent);
    color: var(--wp--preset--color--primary);

    &:hover {
        background-color: var(--wp--preset--color--primary);
        color: var(--wp--preset--color--primary-accent);
    }
}

/* Additional styles for input submit buttons */
input[type="submit"] {
    cursor: pointer;
    border: none;
    padding: 0.667em 1.333em;
    font-size: 1rem;
    border-radius: 0.25rem;
    font-family: inherit;
    font-weight: 500;
    display: inline-block;
    text-decoration: none;
}

/* 
Button Style: Outline
*/
.wp-block-button.is-style-outline>.wp-block-button__link {
    background-color: var(--wp--preset--color--base);
    color: var(--wp--preset--color--secondary);
    border-color: var(--wp--preset--color--border-light);

    &:hover {
        background-color: var(--wp--preset--color--secondary);
        color: var(--wp--preset--color--base);
        border-color: var(--wp--preset--color--secondary);
    }
}

/* 
Button Style: Brand
Color combination: Yellow on Stone
*/
.wp-block-button.is-style-button-brand>.wp-block-button__link {
    background-color: var(--wp--preset--color--primary);
    color: var(--wp--preset--color--primary-accent);

    &:hover {
        background-color: var(--wp--preset--color--primary-accent);
        color: var(--wp--preset--color--primary);
    }
}

/*
Button Style: Brand Alt
Color Combination: Champagne on Gold
*/
.wp-block-button.is-style-button-brand-alt>.wp-block-button__link {
    background-color: var(--wp--preset--color--primary-alt);
    color: var(--wp--preset--color--primary-alt-accent);

    &:hover {
        background-color: var(--wp--preset--color--primary-alt-accent);
        color: var(--wp--preset--color--primary-alt);
    }
}

/*
Button Style: Dark
Color combination: Champagne on Black
*/
.wp-block-button.is-style-button-dark>.wp-block-button__link {
    background-color: var(--wp--preset--color--main);
    color: var(--wp--preset--color--main-accent);

    &:hover {
        background-color: var(--wp--preset--color--main-accent);
        color: var(--wp--preset--color--main);
    }
}

/*
Button Style: Light
Color combination: 
*/
.wp-block-button.is-style-button-light>.wp-block-button__link {
    background-color: var(--wp--preset--color--main-accent);
    color: var(--wp--preset--color--main);

    &:hover {
        background-color: var(--wp--preset--color--main);
        color: var(--wp--preset--color--main-accent);
    }
}

/*
Button Style: Tint
Color combination: 
*/
.wp-block-button.is-style-secondary-button>.wp-block-button__link {
    background-color: var(--wp--preset--color--tertiary);
    color: var(--wp--preset--color--main);

    &:hover {
        background-color: var(--wp--preset--color--main);
        color: var(--wp--preset--color--tertiary);
    }
}

/* Color mapping for hover effects */
.wp-block-button {
    /* Brand colors */
    --tw-color-brand: var(--wp--preset--color--primary);
    --tw-color-brand-accent: var(--wp--preset--color--primary-accent);
    --tw-color-brand-alt: var(--wp--preset--color--primary-alt);
    --tw-color-brand-alt-accent: var(--wp--preset--color--primary-alt-accent);
    /* Contrast colors */
    --tw-color-contrast: var(--wp--preset--color--main);
    --tw-color-contrast-accent: var(--wp--preset--color--main-accent);
    /* Base colors */
    --tw-color-base: var(--wp--preset--color--base);
    --tw-color-base-accent: var(--wp--preset--color--secondary);
    /* Tint color */
    --tw-color-tint: var(--wp--preset--color--tertiary);
}

/* Generate hover border variations */
.wp-block-button[class*="tw-hover-border-"] a {
    transition: border-color 0.3s ease;
}

.wp-block-button.tw-hover-border-brand:hover a { border-color: var(--tw-color-brand) !important; }
.wp-block-button.tw-hover-border-brand-accent:hover a { border-color: var(--tw-color-brand-accent) !important; }
.wp-block-button.tw-hover-border-brand-alt:hover a { border-color: var(--tw-color-brand-alt) !important; }
.wp-block-button.tw-hover-border-brand-alt-accent:hover a { border-color: var(--tw-color-brand-alt-accent) !important; }
.wp-block-button.tw-hover-border-contrast:hover a { border-color: var(--tw-color-contrast) !important; }
.wp-block-button.tw-hover-border-contrast-accent:hover a { border-color: var(--tw-color-contrast-accent) !important; }
.wp-block-button.tw-hover-border-base:hover a { border-color: var(--tw-color-base) !important; }
.wp-block-button.tw-hover-border-base-accent:hover a { border-color: var(--tw-color-base-accent) !important; }
.wp-block-button.tw-hover-border-tint:hover a { border-color: var(--tw-color-tint) !important; }

/* Generate hover background variations */
.wp-block-button[class*="tw-hover-background-"] a {
    transition: background-color 0.3s ease;
}

.wp-block-button.tw-hover-background-brand:hover a { background-color: var(--tw-color-brand) !important; }
.wp-block-button.tw-hover-background-brand-accent:hover a { background-color: var(--tw-color-brand-accent) !important; }
.wp-block-button.tw-hover-background-brand-alt:hover a { background-color: var(--tw-color-brand-alt) !important; }
.wp-block-button.tw-hover-background-brand-alt-accent:hover a { background-color: var(--tw-color-brand-alt-accent) !important; }
.wp-block-button.tw-hover-background-contrast:hover a { background-color: var(--tw-color-contrast) !important; }
.wp-block-button.tw-hover-background-contrast-accent:hover a { background-color: var(--tw-color-contrast-accent) !important; }
.wp-block-button.tw-hover-background-base:hover a { background-color: var(--tw-color-base) !important; }
.wp-block-button.tw-hover-background-base-accent:hover a { background-color: var(--tw-color-base-accent) !important; }
.wp-block-button.tw-hover-background-tint:hover a { background-color: var(--tw-color-tint) !important; }

/* Generate hover text variations */
.wp-block-button[class*="tw-hover-text-"] a {
    transition: color 0.3s ease;
}

.wp-block-button.tw-hover-text-brand:hover a { color: var(--tw-color-brand) !important; }
.wp-block-button.tw-hover-text-brand-accent:hover a { color: var(--tw-color-brand-accent) !important; }
.wp-block-button.tw-hover-text-brand-alt:hover a { color: var(--tw-color-brand-alt) !important; }
.wp-block-button.tw-hover-text-brand-alt-accent:hover a { color: var(--tw-color-brand-alt-accent) !important; }
.wp-block-button.tw-hover-text-contrast:hover a { color: var(--tw-color-contrast) !important; }
.wp-block-button.tw-hover-text-contrast-accent:hover a { color: var(--tw-color-contrast-accent) !important; }
.wp-block-button.tw-hover-text-base:hover a { color: var(--tw-color-base) !important; }
.wp-block-button.tw-hover-text-base-accent:hover a { color: var(--tw-color-base-accent) !important; }
.wp-block-button.tw-hover-text-tint:hover a { color: var(--tw-color-tint) !important; }

/* Zoom effect */
.wp-block-button.tw-hover-zoom a {
    transition: transform 0.3s ease;
}

.wp-block-button.tw-hover-zoom:hover a {
    transform: scale(1.05);
}

/* Combined transitions for multiple effects */
.wp-block-button[class*="tw-hover-"] a {
    transition: transform 0.3s ease,
                border-color 0.3s ease,
                background-color 0.3s ease,
                color 0.3s ease;
}