.wp-block-buttons[class] .wp-block-button {
  position: relative;
}
.wp-block-buttons[class]
  .wp-block-button__link.has-brand-white-background-color:hover {
  --button--background-color--hover: color-mix(
    in lch,
    var(--wp--preset--color--brand-white),
    var(--button--hover--effect)
  );
}
.wp-block-buttons[class]
  .wp-block-button__link.has-brand-secondary-background-color:hover {
  --button--background-color--hover: color-mix(
    in hsl,
    var(--wp--preset--color--brand-secondary),
    var(--button--hover--effect)
  );
}
.wp-block-buttons[class]
  .wp-block-button__link.has-brand-secondary-lighter-background-color:hover {
  --button--background-color--hover: color-mix(
    in hsl,
    var(--wp--preset--color--brand-secondary-lighter),
    var(--button--hover--effect)
  );
}
.wp-block-buttons[class] .is-style-primary {
  --button--font-family: var(--wp--preset--font-family--serif);
}

/* Secondary style */

.wp-block-buttons[class] .is-style-secondary {
  --button--color: var(--wp--preset--color--brand-primary);
  --button--background-color: var(--wp--preset--color--brand-secondary-lighter);
  --button--font-size: var(--wp--preset--font-size--type-0);
  --button--shadow--color: var(--wp--preset--color--brand-secondary);
}
.wp-block-buttons[class]
  .is-style-secondary:has(
    .wp-block-button__link.has-brand-secondary-background-color
  ) {
  --button--shadow--color: var(--wp--preset--color--brand-secondary-lighter);
}

/* Arrow style */

.wp-block-buttons[class] .is-style-arrow {
  --button--color: var(--wp--preset--color--brand-primary);
  --button--background-color: transparent;
  
  --button--font-size: var(--wp--preset--font-size--type-0);
  --button--shadow--color: transparent;
  
}

.wp-block-buttons[class] .is-style-arrow .wp-block-button__link {
  --button--background-color--hover: transparent;
  
  padding: 0.25em 0;
  padding-right: .25em;
  display: flex;
  align-items: center;
  transition: all 0.3s ease;
}
.wp-block-buttons[class] .is-style-arrow .wp-block-button__link:hover {
  padding-right: 0;
}

.wp-block-buttons[class] .is-style-arrow .wp-block-button__link:after {
  content: '→';
  display: inline-block;
  font-size: 1em;
  margin-left: 0.25em;
  transition: margin-left 0.3s ease;
}

.wp-block-buttons[class] .is-style-arrow .wp-block-button__link:hover:after {
  margin-left: .5em;
}