/* Tools vertical menu — scoped to .tools-menu so we only hit this UL */

/* kill ALL CAPS coming from theme */
.tools-menu a { text-transform: none !important; letter-spacing: normal !important; }

/* remove any built-in chevrons/arrows/bullets/backgrounds */
.tools-menu li,
.tools-menu li > a,
.tools-menu li > span {
  list-style: none !important;
  background: transparent !important;
  background-image: none !important;
}
.tools-menu li::before,
.tools-menu li > a::before,
.tools-menu li > span::before { content: none !important; }

/* top-level pills with WHITE separation */
.tools-menu > li { margin: 8px 0 !important; }
.tools-menu > li > a {
  display: block !important;
  padding: 8px 8px !important;
  border-radius: 3px !important;
  background: #1665c1 !important;      /* base blue */
  color: #fff !important;
  text-decoration: none !important;
  /* white ring => visible “gap” no matter the sidebar color */
  box-shadow: 0 0 0 2.8px #ffffff !important;
}

/* hover/active — swap #fec158 for the exact yellow you sample */
.tools-menu > li > a:hover,
.tools-menu > li.is-active > a,
.tools-menu > li.is-active-trail > a {
  background: #fec158 !important;       /* active yellow */
  color: #0b2240 !important;            /* dark text on yellow */
}

/* submenu: white panel when expanded */
.tools-menu li ul {
  background: #ffffff !important;
  border-radius: 8px !important;
  padding: 8px 10px 10px 14px !important;
}

/* submenu items and links */
.tools-menu li ul > li { margin: 6px 0 !important; }
.tools-menu li ul > li > a {
  position: relative !important;
  padding: 6px 4px 6px 18px !important;
  color: #000000 !important;
  text-decoration: none !important;
  text-transform: none !important;
}

/* small red bullet (old site vibe) */
.tools-menu li ul > li > a::before {
  content: "•" !important;
  position: absolute !important;
  left: 4px; top: 0; line-height: 1.8;
  color: #9e102a !important;
  opacity: .9 !important;
}

.tools-menu li ul > li > a:hover { text-decoration: underline !important; }

/* red dot bullets for items inside expanded sections */
.tools-menu li.expanded > ul > li > a::before {
  content: "\25C9" !important;         /* bullseye; use "\2022" for a solid dot if you prefer */
  position: absolute !important;
  left: 4px; top: 0;
  line-height: 1.8;
  color: #9e102a !important;           /* red */
  opacity: .95 !important;
  font-size: 0.95em;
}
/* nuke any theme borders/outline or pseudo-borders on the pills */
.tools-menu > li,
.tools-menu > li > a {
  border: 0 !important;
  outline: none !important;
}

/* keep the white ring but remove theme focus outlines */
.tools-menu > li > a:focus,
.tools-menu > li > a:active {
  outline: none !important;
  box-shadow: 0 0 0 4px #ffffff !important;
}

/* some Artisteer themes add extra “borders” via pseudo-elements */
.tools-menu > li > a::before,
.tools-menu > li > a::after {
  content: none !important;
  background: none !important;
  border: 0 !important;
}
/* Submenu items (inside the white panel): make them yellow on hover/focus */
.tools-menu li.expanded > ul > li > a:hover,
.tools-menu li.expanded > ul > li > a:focus {
  background: #fec158 !important;      /* swap if you sampled a different yellow */
  color: #0b2240 !important;
  border-radius: 8px !important;
  text-decoration: none !important;
}

/* Keep the red dot visible on yellow */
.tools-menu li.expanded > ul > li > a:hover::before,
.tools-menu li.expanded > ul > li > a:focus::before {
  color: #8b0e25 !important;            /* slightly darker red on yellow */
}
/* Remove any theme border/frames applied to LI itself */
.tools-menu > li {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;          /* (doesn't touch the white ring on <a>) */
}

/* Artisteer often draws glossy corners with ::before/::after – nuke them */
.tools-menu > li::before,
.tools-menu > li::after,
.tools-menu > li > a::before,
.tools-menu > li > a::after {
  content: none !important;
  background: none !important;
  border: 0 !important;
}
/* Safety: if the wrapper is painting a blue background/border */
.art-hmenu ul.tools-menu {
  background: transparent !important;
  border: 0 !important;
}