/* Limit global page width */
.page-container {
  max-width: 1200px;   /* adjust as needed */
  margin: 0 auto;      /* center it */
  width: 100% !important;  /* make sure it respects max-width */
}

/* Also tighten containers inside */
.page-container .container {
  max-width: 1200px;
}


/* --------------------------------
   CLEAN SIDEBAR MENU STYLING
   -------------------------------- */

/* Kill arrows/triangles completely */
.region-sidebar-first .menu .menu-item::before,
.region-sidebar-first .menu .menu-item::after {
  content: none !important;
  display: none !important;
  background: none !important;
  border: none !important;
  width: 0 !important;
  height: 0 !important;
}

/* Also remove any background icons */
.region-sidebar-first .menu .menu-item {
  background: none !important;
  list-style: none !important;
}

/* Reset list styling */
.region-sidebar-first .menu,
.region-sidebar-first .menu li {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* Menu links */
.region-sidebar-first .menu a {
  display: block;
  padding: 8px 12px 8px 16px;   /* spacing + left padding */
  font-size: 15px;
  font-weight: 500;
  text-decoration: none;
  color: #333;
  border-bottom: 1px solid #eee;  /* subtle separator */
  background: none;
  transition: color 0.2s ease, background 0.2s ease;
}

/* Hover effect */
.region-sidebar-first .menu a:hover {
  background: #f5f5f5;
  color: #000;
  text-decoration: underline;
}

/* Active/current page – no border-left, just color */
.region-sidebar-first .menu a.is-active {
  font-weight: bold;
  color: #444;           /* darker grey for active */
  background: #f9f9f9;   /* optional subtle bg */
  border-left: none !important;
}

/* ----------------------------
   Sidebar width adjustment
   ---------------------------- */
@media (min-width: 992px) {
  aside.col-lg-4 {
    flex: 0 0 18%;      /* narrower sidebar */
    max-width: 18%;
  }

  section.col-lg-8 {
    flex: 0 0 82%;      /* main content gets more space */
    max-width: 82%;
  }
}

/* Page title (H1) */
.region-content h1.page-title {
  font-size: 28px;       /* slightly smaller than default */
  color: #222;           /* keep strong for titles */
  margin-bottom: 20px;
}

/* Main text content */
.region-content,
.region-content p,
.mt-text-content {
  font-size: 15px;       /* smaller than sidebar/menu */
  line-height: 1.6;      /* improve readability */
  color: #555;           /* lighter grey for body text */
}

/* Optional: links inside content */
.region-content a {
  color: #0073aa;        /* muted blue for links */
  text-decoration: underline;
}


/* Header container */
.header-container {
  border-bottom: 2px solid #e6f0fa; /* subtle light blue border */
  padding: 10px 0;
}

/* Logo wrapper */
.logo-and-site-name-wrapper {
  display: flex;
  align-items: center;
  justify-content: flex-start; /* logo on the left */
}

/* Logo image */
.site-branding__logo img {
  max-height: 60px;   /* make logo smaller */
  width: auto;        /* keep proportions */
}


/* Subfooter styling */
#subfooter {
  border-top: 2px solid #e6f0fa;  /* same light blue as maps block */
  background-color: #fafafa;      /* subtle light background */
  padding: 12px 0;
}

#subfooter .region-footer p {
  margin: 4px 0;
  font-size: 13px;
  color: #777;  /* lighter grey text */
}

#subfooter .region-footer a {
  color: #555; 
  text-decoration: none;
}

#subfooter .region-footer a:hover {
  text-decoration: underline;
  color: #0073aa; /* matches link color in content */
}