// SWIPE SLIDE
.swiper-button-prev, .swiper-button-next {
   background: unset;
   top: 40%;
}

//SLICK
.slick-nav {
   position: absolute;
   cursor: pointer;
   top: 45%;
   z-index: 2;
   width: 68px;
   @media(max-width: 1300px){
      width: 55px;
   }
   @media(max-width: 1050px){
      width: 40px;
   }
}
.slider-template {
   .slick-item {
      &:focus-visible {
         outline: none;
      }
   }
   .slick-dots {
      li {
         width: unset;
         height: unset;
         margin: 0;
         button {
            width: unset;
            height: unset;
            padding: 0;
            margin-right: 15px;
            &::before {
               @include transition(all .5s);
               opacity: 1;
               content: '';
               width: 10px;
               height: 10px;
               color: transparent;
               @include border-radius(100%);
               background-color: $color-white;
            }
         }
         &.slick-active {
            // margin-left: 10px;
            button {
               margin-left: 5px;
               margin-right: 20px;
            }
            button::before {
               width: 20px;
               @include border-radius(10px);
            }
         }

         @media(max-width: 440px){
            button {
               margin-right: 10px;
               &::before {
                  width: 7px;
                  height: 7px;
               }
            }
            &.slick-active {
               button {
                  margin-right: 15px;
               }
               button::before {
                  width: 14px;
                  @include border-radius(7px);
               }
            }
         }
      }
   }
}

// FANCYBOX
.fancybox-button.fancybox-close-small {
   padding: 8px;
   background-image: url('../images/fancybox-button-clode.png');
   background-position: -40px 0px;
   width: 30px;
   height: 30px;
   top: 0 !important;
   right: 0 !important;
   text-indent: -9999px;
   svg {
      background-color: #000;
      @include border-radius(50%);
   }
}



//label flag gradient
.arrow-point-shape {
   width: fit-content;
   padding: .5rem 3rem;
   background-image: linear-gradient(to right, #c54407f5 0%, #d72d79 30%, #6745ca 70%, #218adc 100%);

   position: relative;
   @include flex-box();
   align-items: center;
   justify-content: center;
   .text {
      font-size: 1.25rem;
      width: fit-content;
      font-family: $font-semiBold;
      background: linear-gradient(to right, #c79c4d 0%, #c79c4d 30%, #f8e1a4 70%, #c79c4d 100%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      line-height: 1.4;
   }

   &:after {
      content: '';
      position: absolute;
      left: 0; bottom: 0; width: 0; height: 0;
      border-left: 25px solid #223459;
      border-top: 25px solid transparent;
      border-bottom: 25px solid transparent;
   }

   &:before {
      content: '';
      position: absolute;
      right: 0; bottom: 0; width: 0; height: 0;
      border-right: 25px solid #223459;
      border-top: 25px solid transparent;
      border-bottom: 25px solid transparent;
   }

   @media screen and (max-width: 992px) {
      padding: 0;
      width: 175px;
      height: 35px;
      &:after {
         border-left: 17px solid #223459;
         border-top: 17px solid transparent;
         border-bottom: 17px solid transparent;
      }
      &:before {
         border-right: 17px solid #223459;
         border-top: 17px solid transparent;
         border-bottom: 17px solid transparent;
      }
   }
}

.btn-gradient {
   position: relative;
   margin: 0 auto;
   position: relative;
   width: fit-content;
   .bg-gradient {
      height: 40px;
      max-width: 100%;
   }
   .text-content {
      z-index: 1;
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      @include flex-box();
      justify-content: center;
      align-items: center;
   }
   .text {
      white-space: nowrap;
      text-transform: uppercase;
      font-family: $font-semiBold;
      font-size: 1.125rem;
      &.text-gradient {
         width: fit-content;
         background: linear-gradient(to right, #98896f 0%, #f7d79d 20%, #f3a619 40%, #efbc5d 60%, #ffeece 80%, #f7d79d 100%);
         -webkit-background-clip: text;
         -webkit-text-fill-color: transparent;
      }
   }
}