/* Estilos gerais do slider */
.banners-cms {
  position: relative;
  width: 100%;
  overflow: hidden;
}

/* Slides */
.banners-cms .swiper-slide {
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 200px; /* altura mínima padrão */
  height: auto; /* permite altura automática para imagens */
  position: relative;
}

/* Imagens internas */
.banners-cms .swiper-slide img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover; /* preenche o slide mantendo proporção */
}

/* Banners marcados como responsivos */
.banners-cms .swiper-slide.responsive img {
  width: 100%;
  height: auto;
}

/* Link cobrindo todo o slide */
.banners-cms .slide-link {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  text-indent: -9999px; /* caso tenha texto */
}

/* Paginação */
.banners-cms .swiper-pagination {
  position: absolute;
  bottom: 10px;
  left: 0;
  width: 100%;
  text-align: center;
  z-index: 20;
}

/* Botões de navegação */
.banners-cms .swiper-button-next,
.banners-cms .swiper-button-prev {
  color: #fff;
  z-index: 20;
}

/* Visibilidade desktop/mobile */
.only-mobile {
  display: none;
}

.only-desktop {
  display: none;
}

@media (max-width: 768px) {
  .only-mobile {
    display: block !important;
  }
  .banners-cms .swiper-slide {
    min-height: 150px; /* Ajuste para mobile */
  }
}

@media (min-width: 769px) {
  .only-desktop {
    display: block !important;
  }
}