/* Apply hover styles ONLY on devices that actually support hover */
@media (hover: hover) and (pointer: fine) {
  /* Background (solid or gradient) */
  .wp-block-button.has-alopex-hover.alx-hover-bg .wp-block-button__link:hover {
    background: var(--alopex-hover-bg) !important;
  }

  /* Text color */
  .wp-block-button.has-alopex-hover.alx-hover-text .wp-block-button__link:hover {
    color: var(--alopex-hover-text) !important;
  }

  /* Border (each var only takes effect if present) */
  .wp-block-button.has-alopex-hover.alx-hover-border .wp-block-button__link:hover {
    border-width: var(--alopex-hover-border-width) !important;
    border-style: var(--alopex-hover-border-style) !important;
    border-color: var(--alopex-hover-border-color) !important;
  }
}

/* Optional keyboard accessibility (opt-in per button) */
.wp-block-button.has-alopex-hover.alx-hover-focus.alx-hover-bg .wp-block-button__link:focus-visible {
  background: var(--alopex-hover-bg) !important;
}

.wp-block-button.has-alopex-hover.alx-hover-focus.alx-hover-text .wp-block-button__link:focus-visible {
  color: var(--alopex-hover-text) !important;
}

.wp-block-button.has-alopex-hover.alx-hover-focus.alx-hover-border .wp-block-button__link:focus-visible {
  border-width: var(--alopex-hover-border-width) !important;
  border-style: var(--alopex-hover-border-style) !important;
  border-color: var(--alopex-hover-border-color) !important;
}

/* No defaults here: if a var isn't set, that property is ignored.
   We intentionally do NOT change non-hover styles at all. */