body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  /* Impede a rolagem horizontal */
}
.swiper-container-carrossel {
  overflow: hidden; /* Impede que os slides transbordem */
}

.swiper-slide .slide-carrossel {
  width: 100%; /* Garantir que cada slide ocupe toda a largura disponível */
  height: auto;
}

@media (max-width: 768px) {

  [data-aos="fade-right"],
  [data-aos="fade-left"] {
    transform: none !important;
    animation: none !important;
    transition: none !important;
  }
}


#modal-detalhe-plano {
  transform: none !important;
}

/* Estilo padrão para desktop */
.swiper-container {
  max-width: 1320px;
  margin: auto;
  overflow: hidden;
  cursor: grab;
}

.swiper-slide {
  height: auto !important;
  display: flex;
  align-items: stretch;
}

@media (max-width: 768px) {
  .icon-green {
    height: 1.5rem !important;
    width: 1.5rem !important;
  }

  .svg-icon-green {
    height: 1rem !important;
    margin-left: -0.2rem !important;
  }
}

@media (max-width: 768px) {
  .div-icon-wpp {
    height: 40px !important;
    width: 40px !important;
  }
}

.rotate-90 {
  transform: rotate(90deg);
}

@keyframes scroll {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(-50%);
  }
}

.animate-scroll {
  display: flex;
  animation: scroll 20s linear infinite;
}

/* Adjustments for different screen sizes */
@media (max-width: 640px) {
  .animate-scroll {
    animation-duration: 15s;
  }
}

@media (min-width: 640px) and (max-width: 768px) {
  .animate-scroll {
    animation-duration: 18s;
  }
}

.services-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.ss-main {
  border: none !important;
  /* Borda uniforme */
  border-radius: 1rem !important;
  /* Arredondamento */
  padding: 0 !important;
  /* Espaçamento interno */
  width: 100% !important;
  /* Largura total */
  height: 3.6rem !important;
  /* Altura fixa para coincidir com o input */
  box-shadow: none !important;
  /* Remove sombras */
  outline: none !important;
  /* Remove contornos */
  margin-left: 0 !important;
}

#cityFilterMenu {
  border: none !important;
  /* Borda uniforme */
  border-radius: 1rem !important;
  /* Arredondamento */
  padding: 0 !important;
  /* Espaçamento interno */
  width: 80% !important;
  /* Largura total */
  height: 3.6rem !important;
  /* Altura fixa para coincidir com o input */
  box-shadow: none !important;
  /* Remove sombras */
  outline: none !important;
  /* Remove contornos */
  margin-left: 0 !important;
}

#cityFilterMenu+.ss-main .ss-single-selected {
  /* Altura total do contêiner */
  height: 80% !important;
  /* padding: 0.5rem !important;          Padding interno */
  border-radius: 0.5rem !important;
  /* Arredondamento */
  margin-left: 0 !important;

  font-size: 1rem !important;
  /* Tamanho da fonte */
  color: #9ca3af !important;
  /* Cor do texto */
  display: flex !important;
  /* Centraliza o texto verticalmente */
  align-items: center !important;
}

.ss-main .ss-single-selected {
  /* padding: 0.5rem !important;          Padding interno */
  border-radius: 0.5rem !important;
  /* Arredondamento */
  margin-left: 0 !important;

  font-size: 1rem !important;
  /* Tamanho da fonte */
  color: #9ca3af !important;
  /* Cor do texto */
  display: flex !important;
  /* Centraliza o texto verticalmente */
  align-items: center !important;
  /* Altura total do contêiner */
  height: 100% !important;
}

.ss-content .ss-list {
  max-height: 150px !important;
}

.city-filter-menu+.ss-main .ss-content {
  width: 95% !important;
  /* Ajuste a largura conforme necessário */
}

#carousel {
  display: flex;
  transition: transform 0.9s ease-out;
}

/* Estilo do carrossel home principal */
.carousel-item-home {
  opacity: 0;
  transition: opacity 0.7s ease-in-out;
}

.carousel-item-home.active {
  opacity: 1;
}

/* WIFI PLUS  */

.txt-hat {
  color: #00bd08;
}

.txt-hat,
.txt-hat-black,
.txt-hat-white {
  font-family: var(--family-secondary);

  font-weight: 500;

  font-size: 1.125rem;

  line-height: 1.5rem;
}


.custom-max-width-alert-details {
  max-width: 400px;
  /* Limita a largura máxima */
  width: 90%;
  /* Define a largura relativa para telas menores */
  padding: 20px;
  /* Ajusta o espaçamento interno */
  border-radius: 12px;
  /* Bordas arredondadas */
}

/* Classe personalizada para o modal */
.custom-modal {
  max-width: 800px;
  /* Define o máximo de largura */
  max-height: 90vh;
  /* Define o máximo de altura como 90% da altura da janela */
  height: 85%;
  border-radius: 12px;
  /* Bordas arredondadas */
  overflow: hidden;
  /* Remove as barras de rolagem gerais do modal */
  display: flex;
  flex-direction: column;
  /* Garante que o conteúdo respeite o layout flex */
}

/* Ajusta o contêiner HTML do conteúdo para evitar overflow */
.custom-modal .swal2-html-container {
  flex: 1 1 auto;
  /* Permite que o conteúdo cresça dentro do modal */
  max-height: 75vh;
  /* Limita a altura do conteúdo interno */
  overflow-y: auto;
  /* Habilita rolagem vertical no conteúdo, se necessário */
  padding-right: 10px;
  /* Garante espaçamento interno confortável */
  box-sizing: border-box;
  /* Inclui o padding no cálculo do tamanho */
}

/* Remove o overflow do contêiner do SweetAlert2 */
.swal2-container {
  overflow: hidden !important;
  /* Impede rolagem do modal em si */
}

/* Remove a rolagem do body ao abrir o modal */
.swal2-container-no-scroll {
  overflow: hidden !important;
}

.accordion-content {
  overflow: hidden;
  /* Necessário para que a animação funcione corretamente */
}

#contractSearch {
  /* Borda uniforme */
  border-radius: 0.5rem !important;
  /* Arredondamento */
  padding: 6px !important;
  /* Espaçamento interno */
  width: 100% !important;
  /* Largura total */
  height: 3.6rem !important;
  /* Altura fixa para coincidir com o input */
  box-shadow: none !important;
  /* Remove sombras */
  outline: none !important;
  /* Remove contornos */
  margin-left: 0 !important;
}


.swiper-container-carrossel {
  position: relative;
  /* Garante que os botões fiquem dentro do contêiner */
  width: 100%;
  height: auto;
  /* Ajusta automaticamente a altura conforme os slides */
}

.swiper-button-next,
.swiper-button-prev {
  position: absolute;
  top: 50%;
  /* Centraliza verticalmente */
  transform: translateY(-50%);
  z-index: 10;
  /* Garante que os botões fiquem acima dos slides */
}

.swiper-pagination {
  bottom: 10px;
  /* Ajuste vertical */
  text-align: center;
  /* Centraliza horizontalmente */
}

.swiper-button-next,
.swiper-button-prev {
  color: white !important;
}


/* Estilização padrão dos bullets */
.swiper-pagination-bullet {
  background-color: black !important;
  /* Cor padrão do bullet */
  width: 1.5rem !important;
  /* Largura */
  height: .5rem !important;
  /* Altura */
  border-radius: 4px !important;
  /* Forma retangular com bordas arredondadas */
  margin: 0 5px !important;
  /* Espaçamento entre os bullets */
  transition: all 0.3s ease !important;
  /* Efeito de transição */
}

/* Estilização do bullet ativo */
.swiper-pagination-bullet-active {
  opacity: var(--swiper-pagination-bullet-opacity, 1) !important;
  /* Controlar opacidade */
  background: var(--primary-600, #00bd08) !important;
  /* Cor de destaque para o bullet ativo */
  outline: #ebebeb 2px solid !important;
  /* Borda destacada */
  border-radius: 4px !important;
  /* Forma retangular com bordas arredondadas */
  width: 1.5rem !important;
  /* Largura maior para o bullet ativo */
  height: .5rem !important;
  /* Altura maior para o bullet ativo */
  transition: all 0.3s ease !important;
  /* Suavizar as mudanças */
}

@media (max-width: 768px) {
  .swiper-container-carrossel {
    width: 100%;
    overflow: hidden;
  }
}

/* LOAGING DTEL */
.spinner {
  width: 88px;
  height: 88px;
  border-radius: 50%;
  background: radial-gradient(farthest-side, #00bd08 94%, #0000) top/14.1px 14.1px no-repeat,
    conic-gradient(#0000 30%, #00bd08);
  -webkit-mask: radial-gradient(farthest-side, #0000 calc(100% - 14.1px), #000 0);
  animation: spinner-c7wet2 1s infinite linear;
}

/* LOAGING PARA EMPRESA */
.spinner-yellow {
  width: 88px;
  height: 88px;
  border-radius: 50%;
  background: radial-gradient(farthest-side, #ffd712 94%, #0000) top/14.1px 14.1px no-repeat,
    conic-gradient(#0000 30%, #ffd712);
  -webkit-mask: radial-gradient(farthest-side, #0000 calc(100% - 14.1px), #000 0);
  animation: spinner-c7wet2 1s infinite linear;
}

@keyframes spinner-c7wet2 {
  100% {
    transform: rotate(1turn);
  }
}

.dropdown-content {
  width: 250px !important;
}

.dropdown-content-container-left {
  width: 100% !important;
}

.gradient-border {
  position: relative;
  z-index: 1;
}

.gradient-border::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 2px; /* Largura da borda */
  border-radius: 8px; /* Opcional: bordas arredondadas */
  background: linear-gradient(to bottom, #02ed25, transparent);
  z-index: -1; /* Coloca a borda atrás do conteúdo */
}

.active {
  background-color: #f9de53  !important;
}

.active-alt {
  color: #00BD08 !important;
}