/*
 * Button styles for happynectar.
 *
 * Visually mimics NectarBlocks' native button system:
 *   - color/text-color come from NectarBlocks CSS variables
 *     (var(--nectar-accent-color), var(--nectar-accent-text-color))
 *     so brand color changes via NectarBlocks Theme Options propagate.
 *   - Hover state lifts the button: translateY(-3px) + drop shadow,
 *     matching `.nectar-button:hover` emitted by the parent theme.
 *   - Transition curve `cubic-bezier(0.25, 1, 0.33, 1)` across opacity,
 *     transform, colors, and shadow — same as NectarBlocks' button transitions.
 *
 * Targets:
 *   - `.button` (legacy)
 *   - `button`
 *   - `.wp-block-button a` / `.wp-block-button__link` (core WP buttons)
 *   - `.button-wrapper a`
 *   - `.wp-block-file__button` (core WP file block)
 *   - `.post-password-form input[type=submit]`
 *
 * Variants: `.secondary`, `.underline`, `.solid`, `.play`
 * ACF admin buttons opted out via `:not(.acf-button)`.
 */

/* ─── Base — outline button (transparent w/ brand-accent border) ─────────── */
.button, button {
  border-radius: 200px;
  font-family: "Satoshi", sans-serif;
  font-size: 16px;
  font-weight: 600;
  /* border-radius + min-width intentionally omitted — NectarBlocks
     Theme Options (button-styling-roundness → --nectar-border-radius)
     and natural content sizing drive those. */
  line-height: 1em;
  padding: 0.9375em 1.5em;
  border: 1px solid var(--nectar-accent-color, #FF9433);
  text-align: center;
  text-decoration: none;
  display: inline-block;
  position: relative;
  color: var(--light, #ffffff);
  background-color: var(--nectar-accent-color, #FF9433);
  transition:
    opacity          .45s cubic-bezier(0.25, 1, 0.33, 1),
    transform        .45s cubic-bezier(0.25, 1, 0.33, 1),
    border-color     .45s cubic-bezier(0.25, 1, 0.33, 1),
    color            .45s cubic-bezier(0.25, 1, 0.33, 1),
    background-color .45s cubic-bezier(0.25, 1, 0.33, 1),
    box-shadow       .45s cubic-bezier(0.25, 1, 0.33, 1);
}

.button:not(.acf-button):hover,
button:hover,
.wp-block-button a:hover,
.button-wrapper a:hover,
.wp-block-button__link:hover,
.wp-block-file * + .wp-block-file__button:hover,
.post-password-form input[type=submit]:hover {
  background: var(--nectar-accent-color, #FF9433);
  color: var(--nectar-accent-text-color, #ffffff);
  box-shadow: 0 20px 38px rgba(0, 0, 0, 0.16);
  transform: translateY(-3px);
}

/* WP core block button — overrides the `:root :where(.wp-element-button,
   .wp-block-button__link) { background-color: #32373c; }` default that
   ships in block-library/style.css. */
.wp-element-button,
.wp-block-button__link {
  background-color: var(--nectar-accent-color, #FF9433);
  color: var(--nectar-accent-text-color, #ffffff);
}

/* ─── Variant: .secondary — filled accent (inverts on hover) ─────────────── */
.button:not(.acf-button).secondary,
button.secondary,
.wp-block-button a.secondary,
.button-wrapper a.secondary,
.wp-block-button__link.secondary,
.wp-block-file * + .wp-block-file__button.secondary,
.post-password-form input[type=submit].secondary {
  background: var(--nectar-accent-color, #FF9433);
  color: var(--nectar-accent-text-color, #ffffff);
}

.button:not(.acf-button).secondary:hover,
button.secondary:hover,
.wp-block-button a.secondary:hover,
.button-wrapper a.secondary:hover,
.wp-block-button__link.secondary:hover,
.wp-block-file * + .wp-block-file__button.secondary:hover,
.post-password-form input[type=submit].secondary:hover {
  color: var(--nectar-accent-color, #FF9433);
  background: transparent;
}

/* ─── Variant: .underline — text-only with accent underline ──────────────── */
.button:not(.acf-button).underline,
button.underline,
.wp-block-button a.underline,
.button-wrapper a.underline,
.wp-block-button__link.underline,
.wp-block-file * + .wp-block-file__button.underline,
.post-password-form input[type=submit].underline {
  color: #000000;
  padding: 0;
  display: inline-block;
  text-decoration: underline;
  text-decoration-color: var(--nectar-accent-color, #FF9433);
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
  border: none;
  border-radius: 0;       /* opt out of any NectarBlocks rounding for this variant */
  background: transparent;
  box-shadow: none;
}

.button:not(.acf-button).underline:hover,
button.underline:hover,
.wp-block-button a.underline:hover,
.button-wrapper a.underline:hover,
.wp-block-button__link.underline:hover,
.wp-block-file * + .wp-block-file__button.underline:hover,
.post-password-form input[type=submit].underline:hover {
  background: transparent;
  color: var(--nectar-accent-color, #FF9433);
  box-shadow: none;
  transform: none;
}

/* ─── Variant: .solid — filled accent (alias of .secondary on wrappers) ──── */
.wp-block-button.secondary a,
.button.solid:not(.acf-button) a,
.button-wrapper a {
  background: var(--nectar-accent-color, #FF9433);
  color: var(--nectar-accent-text-color, #ffffff);
}

.wp-block-button.secondary a:hover,
.button.solid:not(.acf-button) a:hover,
.button-wrapper a:hover {
  color: var(--nectar-accent-color, #FF9433);
  background: transparent;
}

.button.solid:not(.acf-button) {
  background: var(--nectar-accent-color, #FF9433);
  color: var(--nectar-accent-text-color, #ffffff);
}

.button.solid:not(.acf-button):hover {
  color: var(--nectar-accent-color, #FF9433);
  background: transparent;
}

/* ─── Variant: .play — for "▶ Play" buttons with inline SVG ──────────────── */
.button.play:not(.acf-button) {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
}

.button.play:not(.acf-button):hover svg path {
  fill: var(--nectar-accent-text-color, #ffffff);
}

/* ─── Mobile menu trigger — opt out of button hover bg/lift ──────────────── */
button.menu_trigger:hover {
  background: transparent;
  color: inherit;
  box-shadow: none;
  transform: none;
}

/* ─── Third-party form buttons ───────────────────────────────────────────── */

/* Flodesk newsletter signup button on the homepage.
   The hash class is Flodesk's scope-per-form identifier; !important is
   needed because Flodesk injects its own scoped styles at runtime. */
[data-ff-el="root"].ff-690ccfa7446cc061a40e401f .ff-690ccfa7446cc061a40e401f__button {
  font-family: "Satoshi", sans-serif !important;
  text-transform: none !important;
  margin-top: 20px !important;        /* breathing room above the fields */
}

[data-ff-el="root"].ff-690ccfa7446cc061a40e401f .ff-690ccfa7446cc061a40e401f__button:hover {
  color: #ffffff !important;
}
