@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;900&display=swap');
@import url('./icons/style.css');

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  scroll-behavior: smooth;
}

body {
  font-family: 'Inter', sans-serif;
}

[x-cloak] {
  display: none;
}

.landing-bg {
  background-image: url(../images/bg.svg);
  background-position: center;
  background-repeat: repeat;
}
.landing-glow {
  position: relative;
  z-index: 1;
}
.landing-glow::before {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.5);
  display: block;
  content: url(../images/land-glow.svg);
  z-index: -1;
}
@media screen and (min-width: 640px) {
  .landing-glow::before {
    transform: translate(-50%, -50%) scale(0.75);
  }
}

@media screen and (min-width: 1024px) {
  .landing-glow::before {
    transform: translate(-50%, -50%) scale(1);
  }
}

.success-glow-sm {
  box-shadow: 0px 0px 20px rgba(51, 254, 108, 0.58);
}
.success-glow-lg {
  box-shadow: 0px 0px 32px rgba(51, 254, 108, 0.58);
}
.warning-glow-sm {
  box-shadow: 0px 0px 20px rgba(254, 197, 51, 0.58);
}
.warning-glow-lg {
  box-shadow: 0px 0px 32px rgba(254, 197, 51, 0.58);
}

.success-gradient-bg {
  background: linear-gradient(49.89deg, #78C042 0%, #57952C 100%);
}
.warning-gradient-bg {
  background: linear-gradient(50deg, #E79901 0%, #E74601 100%);
}

.glow-link:hover .success-glow-text {
  position: relative;
  z-index: 1;
  color: #69ad37;
}
.glow-link:hover .success-glow-text::before {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  color: #69ad37;
  content: attr(data-text);
  filter: blur(9px);
  transform: translate3d(0, 0, 0);
}
.glow-link:hover .success-glow-text::after {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  color: #69ad37;
  content: attr(data-text);
  filter: blur(9px);
  transform: translate3d(0, 0, 0);
}

.glow-link:hover .success-glow-icon-new {
  position: relative;
  z-index: 1;
  color: #69ad37;
}
.glow-link:hover .success-glow-icon-new::before {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  color: #69ad37;
  content: '\e913';
  font-family: icon;
  filter: blur(9px);
  transform: translate3d(0, 0, 0);
}
.glow-link:hover .success-glow-icon-new::after {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  color: #69ad37;
  content: '\e913';
  font-family: icon;
  filter: blur(9px);
  transform: translate3d(0, 0, 0);
}

.glow-link:hover .warning-glow-text {
  position: relative;
  z-index: 1;
  color: #ffbb03;
}
.glow-link:hover .warning-glow-text::before {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  color: #ffbb03;
  content: attr(data-text);
  filter: blur(9px);
  transform: translate3d(0, 0, 0);
}
.glow-link:hover .warning-glow-text::after {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  color: #ffbb03;
  content: attr(data-text);
  filter: blur(9px);
  transform: translate3d(0, 0, 0);
}

.glow-link:hover .warning-glow-icon-like {
  position: relative;
  z-index: 1;
  color: #ffbb03;
}
.glow-link:hover .warning-glow-icon-like::before {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  color: #ffbb03;
  content: '\e907';
  font-family: icon;
  filter: blur(9px);
  transform: translate3d(0, 0, 0);
}
.glow-link:hover .warning-glow-icon-like::after {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  color: #ffbb03;
  content: '\e907';
  font-family: icon;
  filter: blur(9px);
  transform: translate3d(0, 0, 0);
}

.glow-link:hover .danger-glow-text {
  position: relative;
  z-index: 1;
  color: #E74601;
}
.glow-link:hover .danger-glow-text::before {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  color: #E74601;
  content: attr(data-text);
  filter: blur(9px);
  transform: translate3d(0, 0, 0);
}
.glow-link:hover .danger-glow-text::after {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  color: #E74601;
  content: attr(data-text);
  filter: blur(9px);
  transform: translate3d(0, 0, 0);
}

.glow-link:hover .danger-glow-icon-fire {
  position: relative;
  z-index: 1;
  color: #E74601;
}
.glow-link:hover .danger-glow-icon-fire::before {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  color: #E74601;
  content: '\e90a';
  font-family: icon;
  filter: blur(9px);
  transform: translate3d(0, 0, 0);
}
.glow-link:hover .danger-glow-icon-fire::after {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
  color: #E74601;
  content: '\e90a';
  font-family: icon;
  filter: blur(9px);
  transform: translate3d(0, 0, 0);
}
.has-overflow::after {
  position: absolute;
  top: 0;
  right: -8px;
  width: 32px;
  height: 100%;
  display: block;
  content: '';
  z-index: 20;
  background: linear-gradient(270deg, #433062 30%, rgba(67, 48, 98, 0) 100%);
}
.text-shadow {
  text-shadow: 0 0 5px rgba(47, 28, 78, 0.8);
}
.preview {
  padding-top: 100%;
  background-color: #2f1c4e;
}
.animate-btn {
  animation: pulse-sm 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
@keyframes pulse-sm {
  0%, 100% {
    background-color: #7DC648;
  }
  50% {
    background-color: #69ad37;
  }
}

select:not(.select-white), .form-select:not(.select-white) {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");
}

.gold-form-light select, .gold-form-light  .form-select {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%23333' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");
}

.cookie {
  max-width: calc(100% - 72px);
}

input::-webkit-contacts-auto-fill-button {
  visibility: hidden;
  display: none !important;
  pointer-events: none;
  position: absolute;
  right: 0;
}

.simplebar-scrollable-y {
  padding-right: 20px !important;
}
.simplebar-track {
  width: 10px;
  background-color: #574476;
  border-radius: 5px;
}
.simplebar-scrollbar::before {
  background-color: #B19ED0 !important;
}

.play-button, .reg-button, .play-button-wide {
  position: relative;
  z-index: 1;
}
.play-button::before, .reg-button::before, .play-button-wide::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 0.5rem;
  animation: pulse 5s ease infinite;
  content: '';
  display: block;
  background-color: rgb(105, 173, 55);
  z-index: -1;
}
.play-button-wide::before {
  animation: pulsewide 5s ease infinite;
}
.reg-button::before {
  background-color: rgb(255, 187, 3);
  animation: pulsereg 5s ease infinite;
}
.reg-default-button::before {
  background-color: rgb(87, 68, 118);
  animation: pulsereg 5s ease infinite;
}

@keyframes pulse {
  0% {
    transform: scale(1, 1);
  }
  15% {
    opacity: 0.3;
  }
  30% {
    transform: scale(1.5);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes pulsewide {
  0% {
    transform: scale(1, 1);
  }
  15% {
    opacity: 0.3;
  }
  30% {
    transform: scaleY(1.5) scaleX(1.05);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes pulsereg {
  0% {
    transform: scale(1, 1);
  }
  15% {
    opacity: 0.3;
  }
  30% {
    transform: scale(1.5);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

.animation-flash {
  animation: flash 1s;
}

@keyframes flash {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 100;
  }
  100% {
    opacity: 0;
  }
}