/* Optional: Custom scrollbar for better look, especially on narrow screens */
::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}
::-webkit-scrollbar-track {
	background: #f1f1f1;
	border-radius: 10px;
}
::-webkit-scrollbar-thumb {
	background: #888;
	border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
	background: #555;
}
/* Hide scrollbar for the category list container, but still allow scrolling */
#category-list-container::-webkit-scrollbar {
	display: none;
}
#category-list-container {
	-ms-overflow-style: none;  /* IE and Edge */
	scrollbar-width: none;  /* Firefox */
}
/* Fixed position for scroll-to-top button */
#scroll-to-top-btn {
	position: fixed;
	bottom: 20px;
	right: 20px;
	z-index: 1000;
}
/* Fixed position for back button (optional, can be sticky) */
#back-button {
	/* If you want it always visible, make it fixed */
	/* position: fixed; top: 20px; left: 20px; */
	/* If you want it to scroll with content, make it sticky within its parent */
	position: sticky; /* Make it sticky within its parent */
	top: 10px; /* Adjust as needed, relative to its parent's top edge */
	z-index: 500; /* Ensure it's above other elements but below header if needed */
}
/* Styling untuk Tombol Scroll to Top */
#scrollTopBtn {
  display: none; /* Sembunyikan secara default */
  position: fixed; /* Tetap di posisi yang sama saat scroll */
  bottom: 20px; /* Jarak dari bawah */
  right: 30px; /* Jarak dari kanan */
  z-index: 99; /* Pastikan di atas elemen lain */
  border: none;
  outline: none;
  background-color: rgba(0, 0, 0, 0.5); /* Warna background semi-transparan */
  color: white;
  cursor: pointer;
  padding: 10px;
  border-radius: 50%; /* Membuatnya bulat */
  width: 50px;
  height: 50px;
  font-size: 18px;
  transition: opacity 0.4s, visibility 0.4s; /* Efek transisi halus */
  opacity: 0;
  visibility: hidden;
}

#scrollTopBtn.show {
  display: flex; /* Gunakan flex untuk menengahkan SVG di dalam tombol */
  align-items: center;
  justify-content: center;
  opacity: 1;
  visibility: visible;
}

#scrollTopBtn:hover {
  background-color: rgba(0, 0, 0, 0.8); /* Warna saat hover */
}