.multishop-universal-button,
.multishop-premium-atc-button {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
:where(.multishop-premium-atc-button) {
  border-width: var(--multishop-purchase-border-width, revert);
  border-color: var(--multishop-purchase-border-color, revert);
  border-radius: var(--multishop-purchase-radius, revert);
  min-height: var(--multishop-atc-min-height, revert);
  padding-block: var(--multishop-atc-padding-block, revert);
  padding-inline: var(--multishop-atc-padding-inline, revert);
  font-size: var(--multishop-atc-font-size, revert);
}

.multishop-universal-button.has-multishop-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--multishop-button-icon-gap, 8px);
}

.multishop-universal-button.has-multishop-icon::before {
  content: "";
  position: relative;
  z-index: 2;
  flex: 0 0 var(--multishop-button-icon-size, 18px);
  width: var(--multishop-button-icon-size, 18px);
  height: var(--multishop-button-icon-size, 18px);
  background-color: currentColor;
  -webkit-mask: var(--multishop-button-icon-mask) center/contain no-repeat;
  mask: var(--multishop-button-icon-mask) center/contain no-repeat;
}
.multishop-universal-button.is-multishop-icon-only {
  width: max(44px, calc(var(--multishop-button-icon-size, 18px) + 1.5em));
  min-width: 44px;
  min-height: 44px;
  padding-inline: .65em;
  gap: 0;
  font-size: 0 !important;
  aspect-ratio: 1;
}
.multishop-universal-button.is-multishop-icon-only::before { font-size: initial; }
.multishop-universal-button.has-multishop-custom-icon::before {
  background-color: transparent;
  background-image: var(--multishop-button-icon-image);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  -webkit-mask: none;
  mask: none;
}
.multishop-universal-button.is-icon-after::before { order: 3; }

.multishop-button-effect-layer,
.multishop-atc-effect-layer {
  position: absolute;
  z-index: 1;
  inset: 0;
  border-radius: inherit;
  overflow: hidden;
  pointer-events: none;
}

.multishop-premium-atc-button > :not(.multishop-atc-effect-layer) {
  position: relative;
  z-index: 2;
}

:is(.multishop-universal-button,.multishop-premium-atc-button).is-effect-shimmer :is(.multishop-button-effect-layer,.multishop-atc-effect-layer)::before,
:is(.multishop-universal-button,.multishop-premium-atc-button).is-effect-sparkle :is(.multishop-button-effect-layer,.multishop-atc-effect-layer)::before {
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:linear-gradient(110deg,transparent 0 37%,rgba(255,255,255,.10) 44%,rgba(255,255,255,.82) 50%,rgba(255,255,255,.10) 56%,transparent 63% 100%);
  background-size:260% 100%;
  background-position:130% 0;
  animation:multishop-button-shimmer-safe 3s ease-in-out infinite;
  transform:none!important;
  filter:none!important;
}

:is(.multishop-universal-button,.multishop-premium-atc-button).is-effect-sparkle :is(.multishop-button-effect-layer,.multishop-atc-effect-layer)::after {
  content:"";
  position:absolute;
  inset:2px;
  border-radius:inherit;
  background:
    radial-gradient(circle at 18% 28%,rgba(255,255,255,.95) 0 1px,transparent 1.8px),
    radial-gradient(circle at 72% 22%,rgba(255,255,255,.80) 0 1px,transparent 1.8px),
    radial-gradient(circle at 45% 76%,rgba(255,255,255,.72) 0 1px,transparent 1.8px),
    radial-gradient(circle at 86% 68%,rgba(255,255,255,.86) 0 1px,transparent 1.8px);
  animation:multishop-button-sparkle-safe 2.6s ease-in-out infinite;
  transform:none!important;
  filter:none!important;
}

:is(.multishop-universal-button,.multishop-premium-atc-button).is-effect-pulse { animation: multishop-button-pulse 2.4s ease-in-out infinite; }
:is(.multishop-universal-button,.multishop-premium-atc-button).is-effect-bounce,
.multishop-contact-actions.is-effect-bounce .multishop-contact-actions__button { animation: multishop-button-bounce 2.1s ease-in-out infinite; }
:is(.multishop-universal-button,.multishop-premium-atc-button).is-effect-gradient_shift,
.multishop-contact-actions.is-effect-gradient_shift .multishop-contact-actions__button { background-size: 220% 220% !important; background-image: linear-gradient(110deg, var(--multishop-contact-bg, currentColor), color-mix(in srgb, var(--multishop-contact-bg, currentColor) 65%, white), var(--multishop-contact-bg, currentColor)) !important; animation: multishop-button-gradient 3.6s ease infinite; }
:is(.multishop-universal-button,.multishop-premium-atc-button).is-effect-border_sparkle::after,
.multishop-contact-actions.is-effect-border_sparkle .multishop-contact-actions__button::after {
  content:"";
  position:absolute;
  z-index:3;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:
    linear-gradient(90deg,transparent 0%,rgba(255,255,255,.18) 35%,rgba(255,255,255,.98) 50%,rgba(255,255,255,.18) 65%,transparent 100%) top left/180% 2px no-repeat,
    linear-gradient(180deg,transparent 0%,rgba(255,255,255,.18) 35%,rgba(255,255,255,.98) 50%,rgba(255,255,255,.18) 65%,transparent 100%) top right/2px 180% no-repeat,
    linear-gradient(270deg,transparent 0%,rgba(255,255,255,.18) 35%,rgba(255,255,255,.98) 50%,rgba(255,255,255,.18) 65%,transparent 100%) bottom right/180% 2px no-repeat,
    linear-gradient(0deg,transparent 0%,rgba(255,255,255,.18) 35%,rgba(255,255,255,.98) 50%,rgba(255,255,255,.18) 65%,transparent 100%) bottom left/2px 180% no-repeat;
  animation:multishop-button-border 2.2s linear infinite;
}
.multishop-contact-actions.is-effect-shimmer .multishop-contact-actions__effect::before,
.multishop-contact-actions.is-effect-sparkle .multishop-contact-actions__effect::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(110deg,transparent 0 37%,rgba(255,255,255,.10) 44%,rgba(255,255,255,.82) 50%,rgba(255,255,255,.10) 56%,transparent 63% 100%);background-size:260% 100%;background-position:130% 0;animation:multishop-button-shimmer-safe 3s ease-in-out infinite;transform:none!important;filter:none!important}
.multishop-contact-actions.is-effect-sparkle .multishop-contact-actions__effect::after{content:"";position:absolute;inset:2px;border-radius:inherit;background:radial-gradient(circle at 18% 28%,rgba(255,255,255,.95) 0 1px,transparent 1.8px),radial-gradient(circle at 72% 22%,rgba(255,255,255,.80) 0 1px,transparent 1.8px),radial-gradient(circle at 45% 76%,rgba(255,255,255,.72) 0 1px,transparent 1.8px);animation:multishop-button-sparkle-safe 2.6s ease-in-out infinite;transform:none!important;filter:none!important}
.multishop-contact-actions.is-effect-pulse .multishop-contact-actions__button { animation: multishop-button-pulse 2.4s ease-in-out infinite; }
:is(.multishop-universal-button,.multishop-premium-atc-button).is-hover-lift:hover { transform: translateY(-2px); }
:is(.multishop-universal-button,.multishop-premium-atc-button).is-hover-glow:hover { filter: brightness(1.05); box-shadow: 0 12px 32px color-mix(in srgb, currentColor 24%, transparent); }

@keyframes multishop-button-shimmer {
  0%, 38% { transform: translateX(-70%) rotate(5deg); opacity: 0; }
  48% { opacity: 1; }
  68%, 100% { transform: translateX(72%) rotate(5deg); opacity: 0; }
}
@keyframes multishop-button-sparkles { from { transform: translateX(-12%); opacity: .25; } 50% { opacity: .9; } to { transform: translateX(22%); opacity: .25; } }
@keyframes multishop-button-pulse { 0%,100% { box-shadow: 0 0 0 0 color-mix(in srgb,currentColor 0%,transparent); } 50% { box-shadow: 0 0 0 7px color-mix(in srgb,currentColor 12%,transparent); } }
@keyframes multishop-button-bounce { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
@keyframes multishop-button-gradient { 0%,100% { background-position: 0 50%; } 50% { background-position: 100% 50%; } }
@keyframes multishop-button-border {
  0% { background-position:-180% 0,100% -180%,180% 100%,0 180%; }
  100% { background-position:180% 0,100% 180%,-180% 100%,0 -180%; }
}

@media (prefers-reduced-motion: reduce) {
  :is(.multishop-universal-button,.multishop-premium-atc-button,.multishop-contact-actions__button),
  :is(.multishop-button-effect-layer,.multishop-atc-effect-layer)::before,
  :is(.multishop-button-effect-layer,.multishop-atc-effect-layer)::after { animation: none !important; transition: none !important; }
}

/* Shop Pro 1.2.6: the border sparkle never paints outside the button.
 * The effect animates four in-box edge gradients instead of a transformed or
 * masked oversized layer, avoiding remote compositor artifacts. */
:is(.multishop-universal-button,.multishop-premium-atc-button).is-effect-border_sparkle,
.multishop-contact-actions.is-effect-border_sparkle .multishop-contact-actions__button {
  overflow:hidden!important;
  overflow:clip!important;
  contain:paint;
  isolation:isolate;
}


@keyframes multishop-button-shimmer-safe{0%,30%{background-position:130% 0;opacity:0}42%{opacity:1}70%,100%{background-position:-130% 0;opacity:0}}
@keyframes multishop-button-sparkle-safe{0%,100%{opacity:.20}45%{opacity:.88}70%{opacity:.42}}
:is(.multishop-universal-button,.multishop-premium-atc-button),
.multishop-contact-actions__button{
  overflow:hidden!important;
  overflow:clip!important;
  contain:paint!important;
  isolation:isolate!important;
  clip-path:inset(0 round var(--multishop-purchase-radius,999px));
}
:is(.multishop-button-effect-layer,.multishop-atc-effect-layer,.multishop-contact-actions__effect){overflow:hidden!important;contain:paint!important;transform:none!important;filter:none!important}

/* v1.3.1 containment safety: effect classes can live on the contact-actions
   layout wrapper, but that wrapper must never paint an animated pseudo-element.
   Only the individual button owns a visual effect. */
.multishop-contact-actions[class*="is-effect-"]::before,
.multishop-contact-actions[class*="is-effect-"]::after{content:none!important;display:none!important;animation:none!important}
.multishop-contact-actions .multishop-contact-actions__button{isolation:isolate;contain:paint;overflow:hidden;overflow:clip}
