/*
  Custom Scrollbar for section-slider-container and event-full-slider
  Usage: Add the class 'custom-scrollbar' to any scrollable element to apply these styles.
*/

.custom-scrollbar {
  scrollbar-width: thin;
  scrollbar-color: #231f20 #d9d9d9;
}

.custom-scrollbar::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  background: #d9d9d9;
  border-radius: 0;
}

.custom-scrollbar::-webkit-scrollbar-thumb {
  background: #231f20;
  border-radius: 0 !important;
  height: 3px !important;
  box-shadow: none;
  border: none;
}

.custom-scrollbar::-webkit-scrollbar-track {
  background: #d9d9d9;
  border-radius: 0;
}

/* Remove arrows for scrollbars (Webkit browsers) */
.custom-scrollbar::-webkit-scrollbar-button:single-button {
  display: none;
  width: 0;
  height: 0;
}
.custom-scrollbar::-webkit-scrollbar-button {
  display: none;
  width: 0;
  height: 0;
}

/* Remove outline/roundness for all scrollbar parts */
.custom-scrollbar::-webkit-scrollbar-corner {
  background: #d9d9d9;
  border-radius: 0;
}

/* For Firefox */
.custom-scrollbar {
  scrollbar-width: thin;
  scrollbar-color: #231f20 #d9d9d9;
}