/* WooCustom Toolkit - Button Isolation Layer
 * Loaded late on the frontend so Hello Elementor generic rules such as
 * [type=button], [type=submit], button do not leak into WooCustom UI.
 * Keep the base reset at zero specificity; a separate Kit shield only hardens
 * the properties Elementor Theme Style paints globally.
 */
:where(button.woocustom-isolated-button,
       a.woocustom-isolated-button,
       input.woocustom-isolated-button,
       div.woocustom-isolated-button[role="button"],
       span.woocustom-isolated-button[role="button"],
       [role="button"].woocustom-isolated-button) {
    all: unset;
    -webkit-appearance: none;
    appearance: none;
    box-sizing: border-box;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    font: inherit;
    line-height: inherit;
    color: inherit;
    text-align: center;
    text-decoration: none;
    text-transform: none;
    letter-spacing: normal;
    vertical-align: middle;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    -webkit-tap-highlight-color: transparent;
    white-space: normal;
}

/* Elementor Kit shield.
 * `html + element + .woocustom-isolated-button` has specificity (0,1,2),
 * which is stronger than `.elementor-kit-N button` (0,1,1) without tying this
 * plugin to any Kit id. Component paint rules are mirrored at equal-or-higher
 * specificity, while Elementor per-widget selectors remain stronger and can
 * still control the widget design normally. */
html button.woocustom-isolated-button {
    background-color: transparent;
    color: inherit;
    border-style: none;
    border-radius: 0;
    padding: 0;
}

/* Elementor Kit uses an extra attribute selector for input buttons. */
html input[type="button"].woocustom-isolated-button,
html input[type="submit"].woocustom-isolated-button {
    background-color: transparent;
    color: inherit;
    border-style: none;
    border-radius: 0;
    padding: 0;
}

:where(button.woocustom-isolated-button:focus,
       a.woocustom-isolated-button:focus,
       input.woocustom-isolated-button:focus,
       div.woocustom-isolated-button[role="button"]:focus,
       span.woocustom-isolated-button[role="button"]:focus,
       [role="button"].woocustom-isolated-button:focus) {
    outline: none;
}

:where(button.woocustom-isolated-button:focus-visible,
       a.woocustom-isolated-button:focus-visible,
       input.woocustom-isolated-button:focus-visible,
       div.woocustom-isolated-button[role="button"]:focus-visible,
       span.woocustom-isolated-button[role="button"]:focus-visible,
       [role="button"].woocustom-isolated-button:focus-visible) {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

:where(button.woocustom-isolated-button[disabled],
       button.woocustom-isolated-button:disabled,
       input.woocustom-isolated-button[disabled],
       input.woocustom-isolated-button:disabled,
       a.woocustom-isolated-button[aria-disabled="true"],
       div.woocustom-isolated-button[role="button"][aria-disabled="true"],
       span.woocustom-isolated-button[role="button"][aria-disabled="true"],
       [role="button"].woocustom-isolated-button[aria-disabled="true"]) {
    cursor: not-allowed;
}

:where(.woocustom-isolated-button img) {
    flex-shrink: 0;
}

/* Frontend SVG normalization: all WooCustom inline SVG icons render at one size. */
:where(.woocustom-isolated-button svg,
       [class^="woocustom-"] svg,
       [class*=" woocustom-"] svg,
       [class^="wcc-"] svg,
       [class*=" wcc-"] svg,
       [class^="wcai-"] svg,
       [class*=" wcai-"] svg,
       .fb-btn svg,
       .price-chart-icon-button svg,
       .price-chart-modal-close svg,
       .tab-button svg,
       .nav-link svg,
       #simpleShareModal svg) {
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    min-height: 24px !important;
    max-width: 24px !important;
    max-height: 24px !important;
    flex: 0 0 24px !important;
    display: block !important;
    vertical-align: middle !important;
}

:where(.woocustom-isolated-button svg *,
       [class^="woocustom-"] svg *,
       [class*=" woocustom-"] svg *,
       [class^="wcc-"] svg *,
       [class*=" wcc-"] svg *,
       [class^="wcai-"] svg *,
       [class*=" wcai-"] svg *) {
    vector-effect: non-scaling-stroke;
}