/**
 * FM Button — shared base styles.
 *
 * The look every FM button has in common, kept out of any one module so the
 * modules that render a `.fm-button` — FM Button, FM Info Box, FM Modal Popup —
 * can all enqueue it. Beaver Builder inlines a module's own css/frontend.css
 * only when that module is on the page, so a shared base cannot live there.
 *
 * Module-specific rules (wrappers, widths, icon animations) stay with their
 * module. Anything overriding this needs at least the same specificity —
 * `.fm-button:is(a, button)` is two classes, so a bare `.fm-x-button` loses.
 */

.fm-button:is(a, button) {
  -webkit-appearance: none;
  appearance: none;
  align-items: center;
  background: none;
  border: 0 solid transparent;
  box-sizing: border-box;
  color: inherit;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  gap: 10px;
  justify-content: center;
  letter-spacing: 0.5px;
  line-height: 1.4;
  margin: 0;
  padding: 0.5em 1em;
  text-align: center;
  /* !important so themes that underline content links (e.g. Astra's
	   .ast-single-post .entry-content a) can't underline the button. */
  text-decoration: none !important;
  transition: all 0.2s linear;
}

.fm-button:is(a, button):hover,
.fm-button:is(a, button):focus {
  text-decoration: none !important;
}