.wp-element-button {
  transition: background-color 0.1s ease-out, color 0.1s ease-out,
    border-color 0.1s ease-out;
}

/** Primary button */
.wp-block-button.is-style-primary:hover > .wp-element-button {
  background-color: transparent;
}

/** Secondary button */
.wp-block-button:hover > .wp-element-button {
  background-color: var(--wp--preset--color--primary-pitch-black);
  color: var(--wp--preset--color--primary-solid-white);
}

.wp-block-button.is-style-secondary:hover > .wp-element-button {
  background-color: var(--wp--preset--color--primary-solid-white);
  color: var(--wp--preset--color--primary-pitch-black);
}

/** Banner Primary button */
.wp-block-button.is-style-banner-primary:hover > .wp-element-button {
  background-color: var(--wp--preset--color--primary-signal-orange);
  color: var(--wp--preset--color--primary-solid-white);
}

/** Banner Outline button */
.wp-block-button.is-style-banner-outline:hover > .wp-element-button {
  border-color: var(--wp--preset--color--primary-signal-orange);
  color: var(--wp--preset--color--primary-signal-orange);
}

/** compact-1 button */
.wp-block-button.is-style-compact-1 > .wp-element-button {
  padding: 8px 12px;
}

.wp-block-button.small > .wp-element-button {
  padding: 8px 12px;
}