/* To-Top Button Styles */
#toTopButton {
  position: fixed;
  bottom: 10px;
  right: 30px;
  z-index: 99;
  /* Hide button by default */
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

/* Class to show button when scrolled down */
#toTopButton.show-button {
  visibility: visible;
  opacity: 0.8;
}

#toTopButton:hover {
  background-color: #47D3E5;
  color: white !important;
  box-shadow: none;
  opacity: 1;
}

/* To-Section Button Styles */
#toSectionButton {
  position: fixed;
  bottom: 10px;
  left: 50%;
  transform: translateX(-50%); /* Center horizontally */
  z-index: 99;
  visibility: visible; /* Initially visible */
  opacity: 0.8;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

#toSectionButton:hover {
  background-color: #47D3E5;
  color: white !important;
  box-shadow: none;
  opacity: 1;
}

#toSectionButton.hide-button {
  visibility: hidden;
  opacity: 0;
}

/* Ensure smooth scrolling */
html {
  scroll-behavior: smooth;
}