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


.bg-pan {
  background-image: url("./static/images/ILHA-DO-MEIO-PISCINA-VISTA-LAGOA-1.png");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: left center;
  animation: pan-horizontal 25s linear infinite alternate;
}

@keyframes pan-horizontal {
  0%   { background-position: left center; }
  100% { background-position: right center; }
}

.swiper-pagination, .swiper-pagination-2s {
  bottom: 15px !important; 
  text-align: center;
}

.swiper-pagination-bullet {
  background-color: #ffffff !important;
  opacity: 1 !important;
  width: 20px;
  height: 20px;
  margin: 0 6px !important;
  border-radius: 9999px; 
  transition: all 0.3s ease;
}

.swiper-pagination-bullet-active {
  background-color: #ea580c !important; 
  opacity: 1 !important;
  width: 30px; 
  border-radius: 8px;
}



.ease-in-out {
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.fade-in {
  opacity: 0;
  transition: opacity 1s ease-in-out;
}
.visible {
    opacity: 1 !important;
}
body{
    font-family: 'Rawline', sans-serif;
}

html {
    scroll-behavior: smooth;
    scroll-padding-top: 20px;
  }
  


.swiper-slide {
  position: relative;
}
.swiper-button-prev-custom,
.swiper-button-next-custom {
  border: none;
  outline: none;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}

.text-def{
   @apply text-base md:text-sm lg:text-lg 2xl:text-xl;
}

.scroll {
    background-image: url(./static/images/scroll.gif);
    background-size: contain;
    background-repeat: no-repeat;
  }

.distance-map {
  transform: scale(0);
  display: none;
  transform-origin: top center;
}

a{
  cursor: pointer;
}

.btn-show-map{
  cursor: pointer;
}

.bg-praca_klaus_peters {
  background-image: url(../images/mapa/praca_klaus_peters.jpg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.bg-entrada_de_pf {
  background-image: url(../images/mapa/entrada_de_pf.jpg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.bg-trevo{
  background-image: url(../images/mapa/trevo.jpg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.bg-iberostar {
  background-image: url(../images/mapa/iberostar.jpg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

 /* #carro-map,
  #caminhada-map {
    display: none;
  } */


  .text-white{
    color: #fff;
  }

  a[href="javascript:void(0)"] {
    position: relative;
    padding-left: 65px; /* espaço para o ícone */
}

a[href="javascript:void(0)"]::before {
    content: "";
    position: absolute;
    left: 30px;
    top: 50%;
    width: 24px;
    height: 24px;
    transform: translateY(-50%);
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%3Csvg width='256' height='256' viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='white' d='M128 20C69.6 20 22 67.6 22 126c0 23.4 7.6 45 21 63L20 236l50-22c17.4 9.6 37.2 14.6 58 14.6c58.4 0 106-47.6 106-106S186.4 20 128 20m0 192c-18.6 0-36.6-5-52.4-14.6l-3.8-2.2l-29.6 13l12.6-30l-2.4-3.4C43.4 157 38 141.8 38 126C38 75.8 77.8 36 128 36s90 39.8 90 90s-39.8 90-90 90m52.4-62.4c-2.8-1.4-16.6-8.2-19.2-9.2c-2.6-1-4.4-1.4-6.2 1.4c-1.8 2.8-7.2 9.2-8.8 11c-1.6 1.8-3.2 2-6 0.6c-2.8-1.4-11.8-4.4-22.4-14c-8.2-7.2-13.8-16-15.4-18.8c-1.6-2.8-.2-4.2 1.2-5.6c1.2-1.2 2.8-3.2 4.2-4.8c1.4-1.6 1.8-2.8 2.8-4.6c1-1.8.6-3.4-.2-4.8c-.8-1.4-6.2-15-8.4-20.4c-2.2-5.4-4.4-4.6-6.2-4.6c-1.6 0-3.4-.2-5.2-.2c-1.8 0-4.8.6-7.4 3.4c-2.6 2.8-9.8 9.6-9.8 23.4c0 13.8 10 27.2 11.4 29c1.4 1.8 19.6 30 47.8 42c6.2 2.6 11 4.2 14.8 5.4c6.2 2 11.8 1.8 16.2 1c5-1 15.4-6.2 17.6-12.2c2.2-6.2 2.2-11.6 1.6-12.8c-.6-1.2-2.6-2-5.4-3.4'/%3E%3C/svg%3E");
}