/* Shared [ehbo_cursus] button language. Role classes use the active theme
 * palette. The important layer overrides older page-specific important rules
 * without escalating selector specificity. Dimensions/position remain local.
 */
:root {
  --ffehbo-button-font-family: var(--cmsmasters-button-font-family);
  --ffehbo-button-font-size: 14px;
  --ffehbo-button-font-weight: 700;
  --ffehbo-button-radius: 999px;
  --ffehbo-button-padding: 0.62rem 1.55rem;
}

@layer ffehbo-buttons {
  body:not(.wp-admin) .ffehbo-button {
    --ffehbo-button-background: var(--e-global-color-background, var(--cmsmasters-colors-bg));
    --ffehbo-button-border: var(--e-global-color-border, var(--cmsmasters-colors-bd));
    --ffehbo-button-hover: var(--e-global-color-accent, var(--cmsmasters-colors-accent));
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.35rem !important;
    box-sizing: border-box !important;
    min-height: var(--ffehbo-button-min-height, 40px) !important;
    max-width: 100%;
    padding: var(--ffehbo-button-padding) !important;
    border: 1px solid var(--ffehbo-button-border) !important;
    border-radius: var(--ffehbo-button-radius) !important;
    background-color: var(--ffehbo-button-background) !important;
    color: var(--e-global-color-secondary, var(--cmsmasters-colors-secondary)) !important;
    font-family: var(--ffehbo-button-font-family) !important;
    font-size: var(--ffehbo-button-font-size) !important;
    font-weight: var(--ffehbo-button-font-weight) !important;
    font-style: normal !important;
    line-height: 1.2 !important;
    letter-spacing: var(--cmsmasters-button-letter-spacing) !important;
    text-transform: var(--cmsmasters-button-text-transform) !important;
    text-decoration: none !important;
    text-align: center !important;
    box-shadow: none !important;
    cursor: pointer;
    transition: background-color 0.2s ease, border-color 0.2s ease !important;
  }

  body:not(.wp-admin) .ffehbo-button--primary {
    --ffehbo-button-background: var(--e-global-color-primary, var(--cmsmasters-colors-primary));
    --ffehbo-button-border: var(--e-global-color-primary, var(--cmsmasters-colors-primary));
  }
  body:not(.wp-admin) .ffehbo-button--secondary {
    --ffehbo-button-background: var(--e-global-color-accent, var(--cmsmasters-colors-accent));
    --ffehbo-button-border: var(--e-global-color-accent, var(--cmsmasters-colors-accent));
    --ffehbo-button-hover: var(--e-global-color-primary, var(--cmsmasters-colors-primary));
  }
  body:not(.wp-admin) .ffehbo-button:not(.ffehbo-button--background-icon) {
    background-image: none !important;
  }
  body:not(.wp-admin) .ffehbo-button:is(:hover, :focus-visible):not(:disabled, .disabled, .is-disabled, [aria-disabled="true"]) {
    background-color: var(--ffehbo-button-hover) !important;
    border-color: var(--ffehbo-button-hover) !important;
  }
  body:not(.wp-admin) .ffehbo-button:focus-visible {
    outline: 2px solid var(--e-global-color-secondary, var(--cmsmasters-colors-secondary)) !important;
    outline-offset: 3px !important;
  }
  body:not(.wp-admin) .ffehbo-button:is(:disabled, .disabled, .is-disabled, [aria-disabled="true"]) {
    opacity: 0.6 !important;
    cursor: not-allowed !important;
  }
  body:not(.wp-admin) .ffehbo-button[hidden] {
    display: none !important;
  }
  /* Icon-only controls keep their local width and glyph; textual product CTAs
   * remain textual and keep their available-width layout.
   */
  body:not(.wp-admin) .ffehbo-button--icon {
    min-width: var(--ffehbo-button-icon-min-width, 40px) !important;
    padding: 0 !important;
  }
  body:not(.wp-admin) .ffehbo-button--hide-label {
    font-size: 0 !important;
  }
  /* Archive textual CTAs share the information button's label role. */
  body:not(.wp-admin) .ffehbo-shop-archive .ffehbo-loop-add-to-cart {
    font-size: var(--ffehbo-button-font-size) !important;
    padding: var(--ffehbo-button-padding) !important;
    border-radius: var(--ffehbo-button-radius) !important;
  }
  body:not(.wp-admin) .ffehbo-shop-archive .ffehbo-loop-add-to-cart:disabled {
    background-color: var(--e-global-color-border, var(--cmsmasters-colors-bd)) !important;
    border-color: var(--e-global-color-border, var(--cmsmasters-colors-bd)) !important;
  }
  /* Archive success/loading labels stay visible above the icon-only rules. */
  body:not(.wp-admin) .ffehbo-shop-archive .ffehbo-loop-view-cart,
  body:not(.wp-admin) .ffehbo-shop-archive .ffehbo-add-to-cart--loading {
    font-size: var(--ffehbo-button-font-size) !important;
    padding: var(--ffehbo-button-padding) !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    grid-column: 1 / -1 !important;
    justify-self: stretch !important;
  }
  body:not(.wp-admin) .ffehbo-shop-archive .ffehbo-loop-view-cart::before,
  body:not(.wp-admin) .ffehbo-shop-archive .ffehbo-loop-view-cart:before,
  body:not(.wp-admin) .ffehbo-shop-archive .ffehbo-loop-view-cart::after,
  body:not(.wp-admin) .ffehbo-shop-archive .ffehbo-loop-view-cart:after {
    content: none !important;
    display: none !important;
    background: none !important;
    mask: none !important;
    -webkit-mask: none !important;
  }
  body:not(.wp-admin) .ffehbo-shop-archive ul.products li.product a.added_to_cart {
    display: none !important;
  }
  @media (min-width: 1024px) {
    /* Keep desktop stepper borders in the shared important button layer. */
    body:not(.wp-admin).single-product .ff-single-product .ff-variation-wrapper :is(form.cart:not(.grouped_form), .woocommerce-variation-add-to-cart) > .quantity :is(.qty-btn, .ff-quantity-control__button),
    body.woocommerce-cart .woocommerce-cart-form .quantity.ff-quantity-control :is(.qty-btn, .ff-quantity-control__button),
    body:not(.wp-admin) .woofc-area .woofc-area-mid .woofc-item .woofc-item-inner .woofc-item-qty .woofc-item-qty-inner:has(input.qty:not([type="hidden"])) .ff-quantity-control__button {
      border-inline-width: 0 !important;
    }
    body:not(.wp-admin).single-product .ff-single-product .ff-variation-wrapper :is(form.cart:not(.grouped_form), .woocommerce-variation-add-to-cart) > .quantity :is(.qty-btn, .ff-quantity-control__button):first-child,
    body.woocommerce-cart .woocommerce-cart-form .quantity.ff-quantity-control :is(.qty-btn, .ff-quantity-control__button):first-child,
    body:not(.wp-admin) .woofc-area .woofc-area-mid .woofc-item .woofc-item-inner .woofc-item-qty .woofc-item-qty-inner:has(input.qty:not([type="hidden"])) .ff-quantity-control__button:first-child {
      border-left-width: 1px !important;
    }
    body:not(.wp-admin).single-product .ff-single-product .ff-variation-wrapper :is(form.cart:not(.grouped_form), .woocommerce-variation-add-to-cart) > .quantity :is(.qty-btn, .ff-quantity-control__button):last-child,
    body.woocommerce-cart .woocommerce-cart-form .quantity.ff-quantity-control :is(.qty-btn, .ff-quantity-control__button):last-child,
    body:not(.wp-admin) .woofc-area .woofc-area-mid .woofc-item .woofc-item-inner .woofc-item-qty .woofc-item-qty-inner:has(input.qty:not([type="hidden"])) .ff-quantity-control__button:last-child {
      border-right-width: 1px !important;
    }
  }
  @media (max-width: 767px) {
    /* Compact quantity steppers share one outer border. Keep these exceptions
     * in the button layer so legacy important styles cannot add inner frames. */
    body:not(.wp-admin).single-product .ff-single-product .ff-variation-wrapper form.cart:not(.grouped_form) > .quantity :is(.qty-btn, .ff-quantity-control__button),
    body:not(.wp-admin).single-product .ff-single-product .ff-variation-wrapper .woocommerce-variation-add-to-cart > .quantity :is(.qty-btn, .ff-quantity-control__button),
    body:not(.wp-admin).woocommerce-cart .woocommerce-cart-form .quantity.ff-quantity-control :is(.qty-btn, .ff-quantity-control__button),
    body:not(.wp-admin) .woofc-area .woofc-area-mid .woofc-item .woofc-item-inner .woofc-item-qty .woofc-item-qty-inner:has(input.qty:not([type="hidden"])) .ff-quantity-control__button {
      min-width: 0 !important;
      border-width: 0 !important;
    }
    /* Full-width mobile archive CTAs need their text as well as the cart icon. */
    body:not(.wp-admin) .ffehbo-shop-archive ul.products li.product .button {
      font-size: var(--ffehbo-button-font-size) !important;
      padding: var(--ffehbo-button-padding) !important;
    }
    body:not(.wp-admin) .ffehbo-shop-archive ul.products li.product .ffehbo-loop-view-cart,
    body:not(.wp-admin) .ffehbo-shop-archive ul.products li.product .ffehbo-add-to-cart--loading {
      grid-column: 1 / 4 !important;
    }
    body:not(.wp-admin) .ffehbo-shop-archive ul.products li.product .button:not(.ffehbo-loop-view-cart, .ffehbo-add-to-cart--loading)::before,
    body:not(.wp-admin) .ffehbo-shop-archive ul.products li.product .button:not(.ffehbo-loop-view-cart, .ffehbo-add-to-cart--loading):before {
      background: currentColor !important;
    }
  }
  body:not(.wp-admin) .ffehbo-button :is(.elementor-button-text, .cmsmasters-button__text, .elementor-widget-cmsmasters-button__text, .ehbo-add-to-cart-btn__label, strong, b) {
    font: inherit !important;
    color: inherit !important;
  }
  /* Related actions have their own inline cart icon. Theme cart pseudo-elements
   * are decorative overlays, including when the legacy classifier keeps them. */
  body:not(.wp-admin) .ff-sidebar-related-product__action::before,
  body:not(.wp-admin) .ff-sidebar-related-product__action:before,
  body:not(.wp-admin) .ff-sidebar-related-product__action::after,
  body:not(.wp-admin) .ff-sidebar-related-product__action:after {
    content: none !important;
    display: none !important;
    background: none !important;
    box-shadow: none !important;
  }
  body:not(.wp-admin) .ffehbo-button:not(.ffehbo-button--keep-before)::before,
  body:not(.wp-admin) .ffehbo-button:not(.ffehbo-button--keep-before):before,
  body:not(.wp-admin) .ffehbo-button:not(.ffehbo-button--keep-after)::after,
  body:not(.wp-admin) .ffehbo-button:not(.ffehbo-button--keep-after):after {
    content: none !important;
    display: none !important;
    background: none !important;
    box-shadow: none !important;
  }
}