/* ===============================
   CUSTOM SVG BORDER (v1.0 mask)
   =============================== */

.esvb-enabled-yes .elementor-button,
.esvb-enabled-yes .elementor-button-link{
  position: relative;
  z-index: 0;
  border-radius: var(--esvb-radius, 16px);
  background-clip: padding-box;   /* prevent fill from painting under the ring */
  border: 0;                      /* if a theme adds one, neutralize it */
  outline: 0;
  box-shadow: none;
}

/* Also kill borders in interactive states so transforms don't reveal them */
.esvb-enabled-yes .elementor-button:hover,
.esvb-enabled-yes .elementor-button:focus,
.esvb-enabled-yes .elementor-button:active,
.esvb-enabled-yes .elementor-button-link:hover,
.esvb-enabled-yes .elementor-button-link:focus,
.esvb-enabled-yes .elementor-button-link:active{
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

/* The ring — pure mask on ::before (doesn't touch native border) */
.esvb-enabled-yes .elementor-button::before,
.esvb-enabled-yes .elementor-button-link::before{
  content: "";
  position: absolute;
  inset: var(--esvb-inset, 0px);           /* move ring in/out */
  padding: var(--esvb-thickness, 3px);     /* visual stroke width */
  border-radius: var(--esvb-radius, 16px);
  background: var(--esvb-color, currentColor);
  pointer-events: none;
  z-index: -1;                              /* behind label/background */
  transition: background .2s ease;

  /* Anti-hairline during transforms */
  transform: translateZ(0);
  backface-visibility: hidden;
  will-change: transform, background;

  /* OUTER SVG minus inner content-box = crisp ring */
  -webkit-mask:
    var(--esvb-url) center/100% 100% no-repeat,
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: source-over, xor;
          mask:
    var(--esvb-url) center/100% 100% no-repeat,
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  mask-composite: add, exclude;
}

/* Hover color for the ring */
.esvb-enabled-yes .elementor-button:hover::before,
.esvb-enabled-yes .elementor-button-link:hover::before{
  background: var(--esvb-color-hover, var(--esvb-color, currentColor));
}

/* If thickness is literally 0, hide the ring to avoid anti-alias specks */
.esvb-enabled-yes .elementor-button[style*="--esvb-thickness:0"]::before,
.esvb-enabled-yes .elementor-button[style*="--esvb-thickness: 0"]::before,
.esvb-enabled-yes .elementor-button-link[style*="--esvb-thickness:0"]::before,
.esvb-enabled-yes .elementor-button-link[style*="--esvb-thickness: 0"]::before{
  display: none;
}

/* ===============================
   ICON COLOR HELPERS (no layout changes)
   =============================== */

.elementor-button .elementor-button-icon,
.elementor-button .elementor-button-icon i{
  color: var(--esvb-icon-color, currentColor);
}
.elementor-button .elementor-button-icon svg{
  width: 1em;
  height: 1em;
}
.elementor-button .elementor-button-icon svg,
.elementor-button .elementor-button-icon svg *{
  fill: var(--esvb-icon-color, currentColor);
  stroke: var(--esvb-icon-color, currentColor);
}