/* Page Navigation */

.nav-links {
  display: flex;               /* Aligns items in a horizontal row */
  flex-wrap: wrap;
  list-style: none;            /* Removes default bullet points */
  padding: 0;          	       /* Removes default list padding */
  margin: 5px 3px 5px 3px;     /* Removes default list margin */
  gap: 20px;                   /* Adds exactly 20px of space between items */
  }

.nav-links a {
  text-decoration: none;       /* Removes link underlines */
  padding: 10px 15px;          /* Makes the clickable button area larger */
}

.button-link {
  display: inline-block;
  padding: 10px 20px;
  background-color:  #660066;
  color: white;
  text-decoration: none; /* Removes the underline */
  border-radius: 5px;
  font-weight: bold;
}
.button-link:hover {
  background-color: #006400; /* Visual feedback on hover */
}


/* Floating Button (goto top of page) */


.floating-btn {
  /* Positioning */
  position: fixed;
  bottom: 17px;
  right: 20px;
  z-index: 1000; /* Keeps it on top of other content */

  /* Styling (Optional - creates a modern circular FAB) */
  width: 60px;
  height: 60px;
  border-radius: 50px;
  background-color: #007bff;
  color: white;
  border: none;
  font-size: 24px;
  font-weight: bold;
  cursor: pointer;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3);

  /* Text alignment */
  display: flex; /* Wraps text onto multipli lines, even if you add icons */
  justify-content: center; /* Centers text horizontally */
  align-items: center;     /* Centers text vertically */
  
  /* Smooth hover transition */
  transition: transform 0.2s ease, background-color 0.2s ease;
}

/* Hover Effect */
.floating-btn:hover {
  background-color: #0056b3;
  transform: scale(1.05);
}