/* Override the offcanvas bar background color */
#offcanvas-menu .uk-offcanvas-bar {
  background: #ffffff !important;
}

/* Override UIkit's default white text colors */
#offcanvas-menu .uk-nav > li > a,
#offcanvas-menu .uk-nav-sub > li > a,
#offcanvas-menu .uk-nav-sub .uk-nav-sub > li > a {
  color: inherit !important;
}

#offcanvas-menu .uk-nav-sub {
  overflow: hidden;
  height: auto;
  margin-left: 0;
  border-left: none;
  padding-left: 0;
  background: #ffffff !important;
}

/* Ensure all submenus start collapsed by default */
#offcanvas-menu .uk-parent > .uk-nav-sub {
  display: none !important;
}

/* Only show submenus when parent has uk-open class */
#offcanvas-menu .uk-parent.uk-open > .uk-nav-sub {
  display: block !important;
}

#offcanvas-menu .uk-nav-sub .uk-parent:not(.uk-open) > .uk-nav-sub {
  display: none !important;
}

/* Remove duplicate parent links */
#offcanvas-menu .uk-sub-parent-link {
  display: none !important;
}

/* Top level menu items */
#offcanvas-menu > .uk-nav > li > a {
  padding: 15px 20px !important;
  color: #274098 !important;
  text-decoration: none !important;
  font-weight: 600 !important;
  font-size: 16px !important;
  border-bottom: 1px solid #e0e0e0 !important;
  position: relative !important;
  background: #ffffff !important;
  transition: all 0.2s ease !important;
}

#offcanvas-menu > .uk-nav > li > a:hover {
  background-color: #f8f9fa !important;
  color: #274098 !important;
}

/* Active state for Home and other current pages */
#offcanvas-menu > .uk-nav > li.uk-active > a {
  background-color: #00be4b !important;
  color: #ffffff !important;
}

#offcanvas-menu > .uk-nav > li.uk-active > a:hover {
  background-color: #008b37 !important;
  color: #ffffff !important;
}

/* CRITICAL: Override the output.min.css rule that's setting dark gray background */
html .uk-nav.uk-nav-offcanvas > li.uk-active > a {
  background-color: #00be4b !important;
  color: #ffffff !important;
}

/* Second level menu items */
#offcanvas-menu .uk-nav-sub > li > a {
  padding: 12px 20px 12px 30px !important;
  color: #333333 !important;
  text-decoration: none !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  border-bottom: 1px solid #e0e0e0 !important;
  position: relative !important;
  background: #ffffff !important;
  transition: all 0.2s ease !important;
}

#offcanvas-menu .uk-nav-sub > li > a:hover {
  background-color: #f8f9fa !important;
  color: #333333 !important;
}

/* Active state for second level items */
#offcanvas-menu .uk-nav-sub > li.uk-active > a {
  background-color: #f0f4ff !important;
  color: #274098 !important;
  border-left: 3px solid #274098 !important;
}

/* Third level menu items */
#offcanvas-menu .uk-nav-sub .uk-nav-sub > li > a {
  padding: 10px 20px 10px 45px !important;
  color: #666666 !important;
  text-decoration: none !important;
  font-weight: 400 !important;
  font-size: 13px !important;
  border-bottom: 1px solid #e0e0e0 !important;
  position: relative !important;
  background: #ffffff !important;
  transition: all 0.2s ease !important;
}

#offcanvas-menu .uk-nav-sub .uk-nav-sub > li > a:hover {
  background-color: #f8f9fa !important;
  color: #666666 !important;
}

/* Active state for third level items */
#offcanvas-menu .uk-nav-sub .uk-nav-sub > li.uk-active > a {
  background-color: #f0f4ff !important;
  color: #274098 !important;
  border-left: 3px solid #274098 !important;
}

/* Remove the plus/minus indicators */
#offcanvas-menu .uk-parent > a::after {
  display: none !important;
}

/* Remove the 3-column grid for mobile - keep it simple and vertical */
#offcanvas-menu .uk-nav-sub .uk-nav-sub {
  display: block !important;
  gap: 0 !important;
  margin-left: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  border-left: none !important;
  background: #ffffff !important;
  border-radius: 0 !important;
  margin-top: 0 !important;
}

#offcanvas-menu .uk-nav-sub .uk-nav-sub li {
  margin: 0 !important;
  padding: 0 !important;
  background: #ffffff !important;
}

/* Override any remaining UIkit styles */
#offcanvas-menu .uk-nav > li > a,
#offcanvas-menu .uk-nav-sub > li > a,
#offcanvas-menu .uk-nav-sub .uk-nav-sub > li > a {
  border: none !important;
  margin: 0 !important;
  border-radius: 0 !important;
  text-align: left !important;
}

/* Ensure proper text colors are maintained for non-active items */
#offcanvas-menu .uk-nav > li:not(.uk-active) > a {
  color: #274098 !important;
}

#offcanvas-menu .uk-nav-sub > li > a {
  color: #333333 !important;
}

#offcanvas-menu .uk-nav-sub .uk-nav-sub > li > a {
  color: #666666 !important;
}

/* Override any inherited background colors */
#offcanvas-menu .uk-nav,
#offcanvas-menu .uk-nav-sub,
#offcanvas-menu .uk-nav-sub .uk-nav-sub {
  background: #ffffff !important;
}

#offcanvas-menu .uk-nav > li,
#offcanvas-menu .uk-nav-sub > li,
#offcanvas-menu .uk-nav-sub .uk-nav-sub > li {
  background: #ffffff !important;
}

/* Ensure parent items (like Services) are properly styled when active */
#offcanvas-menu .uk-nav > li.uk-active.uk-parent > a,
#offcanvas-menu .uk-navbar-nav > li.uk-active.uk-parent > a {
  background-color: #274098 !important;
  color: #ffffff !important;
  border-color: #274098 !important;
  text-transform: none !important;
}

/* CRITICAL: Override uk-nav-offcanvas styles that are causing the dark gray background */
#offcanvas-menu .uk-nav-offcanvas > li.uk-open > a,
#offcanvas-menu .uk-nav-offcanvas > li.uk-active.uk-open > a {
  background-color: #274098 !important;
  color: #ffffff !important;
}