/* Sitemap container styles */
.sitemap-container {
  background-color: #ffffff; /* White background */
  padding: 1rem;
  border: 1px solid #ddd; /* Light gray border */
  list-style: none; /* Remove default bullets */
  font-family: Arial, sans-serif; 
}

/* Top-level items */
.sitemap-container > li {
  border: 2px solid #778584; /* Top-level item border */
padding: 1rem;
  background-color: #fcfdff; /* Default background color */
  margin: 0.5rem 0; /* Spacing between items */
  position: relative; /* For inline symbols */
  list-style: none; /* Remove default bullets for top-level items */
}

.sitemap-container > li > a {
  display: block; /* Make the entire area clickable */
  padding: 1rem 1rem 1rem 2.5rem; /* Padding with left space for symbols */
  color: #000; /* Default text color */
  text-decoration: none; /* Remove underline */
  transition: background-color 0.3s ease, color 0.3s ease;
  position: relative; /* Position for inline symbols */
}

/* Add symbols before top-level links */
.sitemap-container > li > a::before {
  content: ">>"; /* Symbol */
  color: #778584; /* Symbol color */
  position: absolute;
  left: 0.5rem; /* Position the symbol */
  top: 0; /* Align symbol inline with text */
  bottom: 0; /* Extend the symbol vertically to the link's padding */
  margin: auto 0; /* Center symbol inline with text */
  display: flex;
  align-items: center; /* Ensure perfect vertical alignment */
  font-weight: bold;
}

/* Highlight top-level items on hover */
.sitemap-container > li:hover {
  border-color: #007bff; /* Highlight border on hover */
}

.sitemap-container > li:hover > a {
  color: #007bff; /* Change text color on hover */
  text-decoration: underline; /* Add underline */
}

/* Nested items */
.sitemap-container ul {
  list-style: none; /* Remove bullets */
  margin-left: 1.5rem; /* Add margin for hierarchy */
  padding-left: .75rem; /* Remove extra padding */
  border-left: 4px solid #bdb9b9; /* Connecting vertical line */
}

.sitemap-container ul li {
  border: 2px solid #778584; /* Nested item border */
  background-color: #fcfdff; /* Default background color */
  margin: 0.5rem 0; /* Spacing between child items */
  position: relative; /* For inline symbols */
  list-style: none; /* Remove bullets for nested items */
}

.sitemap-container ul li > a {
  display: block; /* Make the entire area clickable */
  padding: 1rem 1rem 1rem 2.5rem; /* Padding with left space for symbols */
  color: #000; /* Default text color */
  text-decoration: none; /* Remove underline */
  transition: background-color 0.3s ease, color 0.3s ease;
}

/* Add symbols before nested links */
.sitemap-container ul li > a::before {
  content: ">>"; /* Symbol */
  color: #778584; /* Symbol color */
  position: absolute;
  left: 0.5rem; /* Position the symbol */
  top: 0; /* Align symbol inline with text */
  bottom: 0; /* Extend the symbol vertically to the link's padding */
  margin: auto 0; /* Center symbol inline with text */
  display: flex;
  align-items: center; /* Ensure perfect vertical alignment */
  font-weight: bold;
}

/* Highlight individual child on hover */
.sitemap-container ul li:hover {
  border-color: #007bff; /* Highlight border */
}

.sitemap-container ul li:hover > a {
  color: #007bff; /* Change text color on hover */
  text-decoration: underline; /* Add underline */
}