/* Global Body Styles */
body {
  background-color: #CCBFE0 ; /* Set the page background color to #CCBFE0 */
  color: #332D53;
  font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  margin: 0;
  display: flex;
  flex-direction: column; /* Stack elements vertically */
  height: 100%; /* Full height */
}

/* Ensure the main content area has no extra padding or margin */
main {
  padding: 0 20px;  /* Add padding to both sides to prevent overhanging */
  margin: 0;
  box-sizing: border-box;
}

/* Optional: Ensure form and table are aligned */
form, .table-responsive {
  margin: 0;
  padding: 0;
}

footer.footer {
  background-color: #CCBFE0;
  padding: 1rem 0;
  text-align: center;
  color: #332D53;
  width: 100%;
  position: relative;
  margin-top: 2rem;
  box-sizing: border-box;
  z-index: 1000;
}

/* Footer content: Ensure it spans full width */
footer .footer-content {
  width: 100%; /* Full width for content */
  padding: 10px;
  box-sizing: border-box; /* Ensure padding is included in width */
  color: inherit;
}

/* Navbar Styles */
.navbar {
  background-color: #CCBFE0; /* Set navbar background to #CCBFE0 */
  border-bottom: 5px solid #5A4975;
  position: relative;
  z-index: 0;
  padding: 0; /* Remove any default padding */
}

.navbar-nav {
  height: 100%;
}

.navbar-nav .nav-item {
  margin-bottom: 0;
}

.navbar-nav .nav-link {
  color: #332D53 !important;
  display: flex;
  align-items: center;
  padding: 1rem 1rem; /* Control height visually */
  height: 100%;
  border-bottom: none !important;
  margin-bottom: 0;
  line-height: 1;
  text-align: center;
  border-radius: 0.5rem; /* Add border-radius to give a nicer look */
  transition: background-color 0.3s ease-in-out; /* Smooth background transition */
}

/* Set active tab background color */
.navbar-nav .nav-link.active {
  background-color: #5A4975; /* Set the active navbar link background to #5A4975 */
  font-weight: bold !important;
  color: white !important; /* Text color on active tab */
  border-radius: 0.5rem 0.5rem 0.5rem 0.5rem !important; /* Rounded corners for active item */
  margin-bottom: -5px;
  position: relative;
  z-index: 1;
}

/* Navbar active item hover effect */
.navbar-nav .nav-link.active:hover {
  background-color: #8266A3; /* Background color when hovering over active tab */
}

.navbar-brand img {
  max-height: 60px;
}

/* Button Primary */
.btn-primary {
  background-color: #8266A3;
  border-color: #8266A3;
}

.btn-primary:hover {
  background-color: #5A4975;
  border-color: #5A4975;
}

/* Remove any indentation from the table */
table {
  margin-left: 0;  /* Remove left margin */
  margin-right: 0;  /* Remove right margin */
  width: 100%; /* Ensure the table spans the full width */
  padding-left: 0;  /* Remove left padding */
  padding-right: 0; /* Remove right padding */
  box-sizing: border-box; /* Include padding and border in the element's total width */
}

/* If the table is inside a container, remove any padding or margins on the container */
.container.no-padding {
  padding-left: 0;
  padding-right: 0;
}


table th, table td {
  border: 1px solid #ccc;
  padding: 10px;
  text-align: left;
}

table th {
  background-color: #e9ecef;
  font-weight: bold;
}

/* Optional: Add spacing to tabs */
.nav-tabs {
  margin-left: 20px; /* Adds space to the left of the tab bar */
  margin-right: 20px; /* Adds space to the right of the tab bar */
}

/* Make sure the dropdown is correctly positioned relative to the navbar */
.navbar .dropdown-menu {
    position: absolute;
    right: 0;
    left: auto;  /* Ensure the dropdown is positioned from the right */
}

/* Add some padding to the dropdown to ensure spacing */
.dropdown-menu {
    padding: 10px 0;
}



/* Table striping to match background colour */
.table-striped tbody tr:nth-of-type(odd) {
  --bs-table-accent-bg: #F6F4FA;
  background-color: var(--bs-table-accent-bg) !important;
}

/* Optional: Adjust header colours if needed */
.table thead th {
  background-color: #CCBFE0;
  color: #332d53;
}

/* Optional: Table borders */
.table-bordered td, .table-bordered th {
  border-color: #CCBFE0;
}

/* Pagination base styling */
.pagination .page-link {
  color: #332D53;
  background-color: #F6F4FA;
  border-color: #CCBFE0;
  position: relative;
  z-index: 1 !important;
}

/* Hover state */
.pagination .page-link:hover {
  color: #FFFFFF;
  background-color: #8266A3;
  border-color: #8266A3;
  z-index: 1 !important;
}

/* Active page */
.pagination .page-item.active .page-link {
  color: #FFFFFF;
  background-color: #332D53;
  border-color: #332D53;
  z-index: 1 !important;
  position: relative !important;
}

/* Ensure outer elements aren't pushing it higher */
.pagination,
.page-item {
  position: relative;
  z-index: 0 !important;
}