@import "./utils/basic.pcss";
@import "./components/buttons.pcss";
@import "./components/forms.pcss";
@import "./utils/typography.pcss";
@import "./utils/containers.pcss";

@tailwind base;
@tailwind components;
@tailwind utilities;

[x-cloak] {
    display: none !important;
}
.pointer-events-none{
    pointer-events: none !important;
}
.swiper-slide.md_hide-shadows .swiper-slide-shadow-left,
.swiper-slide.md_hide-shadows .swiper-slide-shadow-right {
    @apply md:hidden hover:scale-105;
}
.swiper-wrapper {
    /*fix where swiper items were not hoverable or clickable on firefox and safari*/
    transform-style: flat !important;
}
.swiper-slide {
    transition-property: transform, filter !important;
}
.d-rtl{
    direction: rtl;
}
.slide-in {
	-webkit-animation: slide-in 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	        animation: slide-in 0.6s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

@-webkit-keyframes slide-in {
    0% {
      -webkit-transform: translateZ(700px) translateY(300px);
              transform: translateZ(700px) translateY(300px);
      opacity: 0;
    }
    100% {
      -webkit-transform: translateZ(0) translateY(0);
              transform: translateZ(0) translateY(0);
      opacity: 1;
    }
  }
  @keyframes slide-in {
    0% {
      -webkit-transform: translateZ(700px) translateY(300px);
              transform: translateZ(700px) translateY(300px);
      opacity: 0;
    }
    100% {
      -webkit-transform: translateZ(0) translateY(0);
              transform: translateZ(0) translateY(0);
      opacity: 1;
    }
  }

@keyframes pulse {
    50% {
        opacity: .5
    }
}

.animate-pulse {
    animation: pulse 1s cubic-bezier(.4,0,.6,1) infinite
}

/* fix css for Form Stack */
.fsRowBody input[type=radio], .fsRowBody input[type=checkbox] {
    top: 2px !important;
    width: inherit !important;
    height: inherit !important;
}

.spinner {
  width: 30px;
  height: 30px;
  border: 4px solid rgba(0, 0, 0, 0.1);
  border-left-color: #ffffff;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% {
      transform: rotate(0deg);
  }
  100% {
      transform: rotate(360deg);
  }
}