/* header */
  
.font-raleway-bold-26 {
  font-family: 'Raleway', sans-serif;
  font-weight: 700;
  font-size: 26px;
}
/* FIM header */

/* INÍCIO carrosel */
  .hero-swiper .swiper-pagination-bullet {
    background-color: white !important;
    opacity: 0.8 !important;
  }

  .hero-swiper .swiper-pagination-bullet-active {
    background-color: white !important;
    opacity: 1 !important;
  }
  
/* FIM carrosel */
/* INÍCIO carrossel de produtos */

/* Setas de Navegação */
.swiper-button-prev-produtos::after,
.swiper-button-next-produtos::after {
  font-family: swiper-icons;
  font-size: 30px;
  text-transform: none !important;
  letter-spacing: 0;
  font-variant: initial;
  line-height: 1;
  color: #C21632; /* cor da seta */
}

.swiper-button-prev-produtos::after {
  content: 'prev';
}

.swiper-button-next-produtos::after {
  content: 'next';
}


/* Esconde setas no mobile (já estava assim, apenas para referência) */
@media (max-width: 640px) {
  .produtos-swiper .swiper-button-prev-produtos,
  .produtos-swiper .swiper-button-next-produtos {
    display: none;
  }
}

/* Outras otimizações (já estavam ou são boas práticas) */
.produtos-swiper .swiper-wrapper {
    align-items: stretch; /* Garante que os itens se estiquem para preencher a altura */
}

.produtos-swiper .swiper-slide > div {
    min-height: 280px; /* Exemplo: Ajuste conforme necessário para seus cards */
}

/* FIM carrossel de produtos */

/* Oculta a barra de rolagem horizontal */
.hide-scrollbar {
  -ms-overflow-style: none;  /* IE e Edge antigos */
  scrollbar-width: none;     /* Firefox */
}
.hide-scrollbar::-webkit-scrollbar {
  display: none;             /* Chrome, Safari e Opera */
}
.swiper-container.category-products-swiper .swiper-custom-pagination .swiper-pagination-bullet {
  background-color: #fbbf24 !important; /* yellow-400 do Tailwind */
  opacity: 0.6 !important; /* Um pouco menos opaco para marcadores inativos */
}

.swiper-container.category-products-swiper .swiper-custom-pagination .swiper-pagination-bullet-active {
  background-color: #c21632 !important;/* Sua cor vermelha personalizada */
  opacity: 1 !important;/* Totalmente opaco para o marcador ativo */
}

/* Opcional: Ajustar o tamanho dos marcadores, se necessário */
.swiper-container.category-products-swiper .swiper-custom-pagination .swiper-pagination-bullet {
  width: 10px !important;
  height: 10px !important;
}
/* Quando o botão está ativo */
#empresa .ql-toolbar button {
  color: #dc2626 !important; /* red-600 */
  fill: #dc2626 !important;
}

/* Hover nos botões */
#empresa .ql-toolbar button:hover {
  background-color: #fff !important; /* gray-800 */
}

/* Fundo da toolbar */
#empresa .ql-toolbar.ql-snow {
  background-color: #aaa5a5 !important; /* gray-700 */
  border: none !important;
}

/* Fundo do container do editor */
#empresa .ql-container.ql-snow {
  background-color: white !important;
  color: black !important;
}
@layer utilities {
  .text-shadow {
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
  }
}

#bannerSwiperWrapper .swiper-slide {
  height: 0; 
  padding-top: calc(400 / 1400 * 100%); /* Aproximadamente 28.57% */  
  /* Garante que o conteúdo de fundo (a imagem) cubra tudo */
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.banner-proporcional {
  height: 0;
  padding-top: calc(250 / 1820 * 100%); /* Aproximadamente 13.736% */
  
  background-size: cover;
  background-position: center center; /* Ou bg-start, se preferir */
  background-repeat: no-repeat;
}
.category-banner-proportional {
  height: 0; 
  padding-top: calc(250 / 1820 * 100%); /* proporção: altura/largura */
  
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  border-radius: 1rem; /* mantém o arredondamento */
  overflow: hidden;
  position: relative; /* necessário p/ overlay */
}

.category-banner-proportional > div {
  position: absolute; 
  inset: 0; 
  display: flex;
  align-items: center;
  justify-content: center;

}
.cursor-grab {
  cursor: grab;
}

.cursor-grabbing {
  cursor: grabbing;
}

/* Estilo para a tag do produto individual */
#product-tag{
   font-family: 'Reem Kufi', sans-serif;
}