html {
  scroll-behavior: smooth;
}

li {
  list-style: none;
}

#header {
  position: sticky;
  top: 0;
  z-index: 50; /* Ajuste o z-index conforme necessário */
}

/* Personalizando a barra de rolagem para todo o documento */
::-webkit-scrollbar {
    width: 12px; /* Largura da barra de rolagem */
    height: 12px; /* Altura da barra de rolagem horizontal */
  }
  
  /* Cor de fundo da barra de rolagem */
  ::-webkit-scrollbar-track {
    background-color: oklch(0.13 0.028 261.692); /* Cor de fundo */
    border-radius: 10px; /* Bordas arredondadas */
  }
  
  /* Cor da parte que pode ser movida (o "polegar") */
  ::-webkit-scrollbar-thumb {
    background-color: oklch(0.432 0.232 292.759); /* Cor da parte que pode ser movida */
    border-radius: 10px; /* Bordas arredondadas */
  }
  
  /* Quando o usuário passa o mouse sobre a parte movível */
  ::-webkit-scrollbar-thumb:hover {
    background-color: oklch(0.38 0.189 293.745); /* Cor ao passar o mouse */
  }

.hvbtn:hover {
    background: transparent !important;
    border: 1px solid var(--primary-color);
    transition: .4s all ease-in-out;
}

.hvproduct:hover {
    background: rgba(255, 255, 255, 0.1) !important;
    transform: translateY(-15px);
    transition: .4s all ease-in-out;
    border: 3px solid white;
}

.hvfeed:hover {
  background: rgba(255, 255, 255, 0.1) !important;
  border: 3px solid white;
  transition: .4s all ease-in-out;
}