@keyframes trBtnSheen {
  0% { left: -80%; }
  45% { left: 140%; }
  100% { left: 140%; }
}

#tr-btn-sheen {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate;
  -webkit-tap-highlight-color: transparent;
}

#tr-btn-sheen,
#tr-btn-sheen:hover,
#tr-btn-sheen:focus,
#tr-btn-sheen:active,
#tr-btn-sheen:focus-visible {
  background-color: var(--Btn, #16F0B0) !important;
  color: var(--btn-text, #121212) !important;
  border-color: transparent !important;
}

#tr-btn-sheen:hover {
  background-color: var(--btn-hover, #11C48F) !important;
}

#tr-btn-sheen::before {
  content: "";
  position: absolute;
  top: -20%;
  left: -80%;
  width: 45%;
  height: 140%;
  background: linear-gradient(
    105deg,
    transparent 0%,
    rgba(255, 255, 255, 0.05) 30%,
    rgba(255, 255, 255, 0.65) 50%,
    rgba(255, 255, 255, 0.05) 70%,
    transparent 100%
  );
  transform: skewX(-20deg);
  animation: trBtnSheen 3.8s ease-in-out infinite;
  pointer-events: none;
  z-index: 1;
}

#tr-btn-sheen > *,
#tr-btn-sheen strong {
  position: relative;
  z-index: 2;
  color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}

html[dir="rtl"] #tr-btn-sheen::before,
body[dir="rtl"] #tr-btn-sheen::before,
body.rtl #tr-btn-sheen::before,
html:lang(fa) #tr-btn-sheen::before,
html:lang(fa-IR) #tr-btn-sheen::before {
  transform: skewX(20deg);
  animation-direction: reverse;
}