/* Stroke Wipe — Button injection styles
   Works at content-wrapper level to cover text + icon as a unit.
   Dual clip-path: primary (stroke) hides as fill (color) reveals. */

/* === Button-level overrides === */
.elementor-button.pe-sw-active {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  cursor: pointer;
}

/* Content-wrapper becomes the positioning stage + glow host */
.elementor-button.pe-sw-active .elementor-button-content-wrapper {
  position: relative;
  filter: drop-shadow(0 0 0px transparent);
  transition: filter var(--pe-sw-duration, 0.5s) ease;
}

/* === Primary layer: stroke outline === */
.pe-sw-primary {
  display: flex;
  align-items: center;
  clip-path: inset(0 0 0 0);
  transition: clip-path var(--pe-sw-duration, 0.5s) ease;
}

/* Stroke text */
.pe-sw-primary .elementor-button-text {
  color: transparent !important;
  -webkit-text-stroke: var(--pe-sw-stroke-width, 1px) var(--pe-sw-stroke-color, rgba(255,255,255,0.6));
}

/* Stroke font icon (<i> tags — font glyphs support text-stroke) */
.pe-sw-primary .elementor-button-icon i {
  color: transparent !important;
  -webkit-text-stroke: var(--pe-sw-stroke-width, 1px) var(--pe-sw-stroke-color, rgba(255,255,255,0.6));
}

/* Stroke SVG icon (use SVG stroke with non-scaling for pixel-based width) */
.pe-sw-primary .elementor-button-icon svg {
  fill: none;
  stroke: var(--pe-sw-stroke-color, rgba(255,255,255,0.6));
  stroke-width: var(--pe-sw-stroke-width, 1px);
  vector-effect: non-scaling-stroke;
}

.pe-sw-primary .elementor-button-icon svg path {
  fill: none;
  stroke: inherit;
  stroke-width: inherit;
  vector-effect: non-scaling-stroke;
}

/* === Fill layer: colored reveal === */
.pe-sw-fill {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  clip-path: inset(0 100% 0 0);
  transition: clip-path var(--pe-sw-duration, 0.5s) ease;
}

/* Fill text */
.pe-sw-fill .elementor-button-text {
  color: var(--pe-sw-fill-color, #37FF8B) !important;
  -webkit-text-stroke: 0px transparent;
}

/* Fill font icon */
.pe-sw-fill .elementor-button-icon i {
  color: var(--pe-sw-fill-color, #37FF8B) !important;
  -webkit-text-stroke: 0px transparent;
}

/* Fill SVG icon */
.pe-sw-fill .elementor-button-icon svg {
  fill: var(--pe-sw-fill-color, #37FF8B);
  stroke: none;
}

.pe-sw-fill .elementor-button-icon svg path {
  fill: var(--pe-sw-fill-color, #37FF8B);
  stroke: none;
}

/* === Cursor bar === */
.pe-sw-cursor {
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc(-1 * (var(--pe-sw-cursor-gap, 8px) + var(--pe-sw-cursor-width, 6px)));
  width: var(--pe-sw-cursor-width, 6px);
  background: var(--pe-sw-fill-color, #37FF8B);
  transition: left var(--pe-sw-duration, 0.5s) ease;
  pointer-events: none;
}

/* === LTR hover === */
.elementor-button.pe-sw-active:hover .pe-sw-primary {
  clip-path: inset(0 0 0 100%);
}

.elementor-button.pe-sw-active:hover .pe-sw-fill {
  clip-path: inset(0 0 0 0);
}

.elementor-button.pe-sw-active:hover .elementor-button-content-wrapper {
  filter: drop-shadow(0 0 var(--pe-sw-glow-size, 23px) var(--pe-sw-fill-color, #37FF8B));
}

.elementor-button.pe-sw-active:hover .pe-sw-cursor {
  left: calc(100% + var(--pe-sw-cursor-gap, 8px));
}

/* === RTL direction === */
.elementor-button.pe-sw-active[data-sw-dir="rtl"] .pe-sw-fill {
  clip-path: inset(0 0 0 100%);
}

.elementor-button.pe-sw-active[data-sw-dir="rtl"] .pe-sw-cursor {
  left: auto;
  right: calc(-1 * (var(--pe-sw-cursor-gap, 8px) + var(--pe-sw-cursor-width, 6px)));
  transition: right var(--pe-sw-duration, 0.5s) ease;
}

.elementor-button.pe-sw-active[data-sw-dir="rtl"]:hover .pe-sw-primary {
  clip-path: inset(0 100% 0 0);
}

.elementor-button.pe-sw-active[data-sw-dir="rtl"]:hover .pe-sw-fill {
  clip-path: inset(0 0 0 0);
}

.elementor-button.pe-sw-active[data-sw-dir="rtl"]:hover .pe-sw-cursor {
  right: calc(100% + var(--pe-sw-cursor-gap, 8px));
}

/* === Reduced motion === */
@media (prefers-reduced-motion: reduce) {
  .pe-sw-primary, .pe-sw-fill, .pe-sw-cursor,
  .elementor-button.pe-sw-active .elementor-button-content-wrapper {
    transition: none !important;
  }
}
