/* Container van de slider */
.slider-brands {
  position: relative;
  width: 100%;
  height: 50px; /* hoogte van de slider */
  overflow: hidden; /* verberg alles buiten de container */
  cursor: grab; /* cursor verandert bij hover */
}

/* Track die de slides bevat */
.slide-track {
  display: flex;
  gap: 10px; /* afstand tussen de slides, pas aan naar wens */
  overflow-x: auto; /* horizontaal scrollen mogelijk */
  scroll-behavior: smooth; /* vloeiende scroll bij drag */
  -webkit-overflow-scrolling: touch; /* soepel scrollen op mobiel */
}

/* Verberg scrollbar */
.slide-track::-webkit-scrollbar {
  display: none;
}
.slide-track {
  -ms-overflow-style: none; /* IE en Edge */
  scrollbar-width: none; /* Firefox */
}

/* Individuele slides */
.slide-brands {
  flex: 0 0 auto; /* niet laten krimpen */
  width: auto; /* breedte past zich aan afbeelding aan */
  height: 50px; /* hoogte van de slide */
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Afbeeldingen */
.slide-brands a img {
  height: 100%; /* hoogte van de slide */
  width: auto; /* breedte automatisch behouden */
  filter: grayscale(100%); /* standaard grijs */
  transition: filter 0.3s ease-in-out;
}

/* Kleuren tonen bij hover */
.slide-brands a:hover img {
  filter: grayscale(0%);
}