/* ========================================
   SHARED STYLES (both horizontal and accordion)
   ======================================== */

.sf-menu.sf-style-uva li li:hover > ul,
.sf-menu.sf-style-uva li li.sfHover > ul {
  top: 0;
}

.sf-menu.sf-style-uva a {
  color: #ffffff;
  padding: 1em 1.5em;
  text-decoration: none;
  text-transform: uppercase;
}

.sf-menu.sf-style-uva .sf-sub-indicator::after,
.sf-menu.sf-style-uva ul .sf-sub-indicator::after {
  content: "+";
  color: #e57200;
}

.sf-menu.sf-style-uva .sf-with-ul {
  padding-right: 0.5rem;
}

ul.sf-menu.sf-style-uva .sf-sub-indicator {
  right: -1rem;
}

.sf-menu.sf-style-uva span.nolink {
  text-transform: uppercase;
  font-weight: 600;
  white-space: nowrap;
}

.sf-menu.sf-style-uva a.sf-depth-2 {
  color: white;
}

.sf-menu.sf-style-uva .sf-depth-1 {
  color: #232d4b !important;
  font-weight: 600;
}

.sf-menu.sf-style-uva.menu,
.sf-menu.sf-style-uva.menu ul,
.sf-menu.sf-style-uva.menu li {
  margin: 0 auto;
  max-width: 1300px;
}

.sf-menu.sf-style-uva.block-menu ul {
  margin-left: 15px;
}

/* ========================================
   HORIZONTAL MENU STYLES
   ======================================== */

.sf-menu.sf-style-uva.sf-horizontal li {
  list-style: none;
  flex: 0 0 auto;
  flex-shrink: 0;
  text-align: left;
  display: flex;
  align-items: start;
  justify-content: start;
  border-right: 1px solid rgba(255, 255, 255, 0.1);
}

.sf-menu.sf-style-uva.sf-horizontal ul li:last-child a {
  border-bottom: none;
}

.sf-menu.sf-style-uva.sf-horizontal li a {
  font-size: 1em;
}

.sf-menu.sf-style-uva.sf-horizontal li li a {
  color: #232d4b;
  width: 100%;
}

.sf-menu.sf-style-uva.sf-horizontal li ul {
  margin-top: 15px;
}

.sf-menu.sf-style-uva.sf-horizontal ul {
  background-color: #ffffff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.sf-menu.sf-style-uva.sf-horizontal ul a {
  color: #232d4b;
  border-bottom: 1px solid rgba(35, 45, 75, 0.1);
}

.sf-menu.sf-style-uva.sf-horizontal ul a:hover,
.sf-menu.sf-style-uva.sf-horizontal ul a:focus {
  text-decoration: underline;
}

ul.sf-menu.sf-style-uva.sf-horizontal.sf-shadow ul,
ul.sf-menu.sf-style-uva.sf-vertical.sf-shadow ul,
ul.sf-menu.sf-style-uva.sf-navbar.sf-shadow ul ul {
  background-color: #ffffff;
}

/* ========================================
   ACCORDION MENU STYLES (mobile)

   Accessibility notes for future developers:
   - Every parent item at every depth is split into a link (navigates) and
     .sf-accordion-subtoggle (injected by accordion-submenu.js) that
     expands the child list. Level 1 buttons carry the +/- indicator
     (--top modifier); deeper levels use a chevron.
   - Visibility is driven only by .sf-submenu-open, set by the script.
     Superfish's own toggling is blocked so the two never disagree.
   - Every link, row, and button is at least 44px tall (WCAG 2.5.8).
   - Indicators use #b85400 instead of brand orange (#e57200), which is
     only ~3:1 on white and is decorative-only.
   - The +/- glyph uses "/ ''" alt text so screen readers do not announce
     it. State is announced from aria-expanded on the button.
   - Focus outlines are 3px navy drawn inward so parent overflow never
     clips them. Do not remove them.
   - Selectors are depth-agnostic: "ul a" is level 2 and deeper, "ul ul a"
     is level 3 and deeper, so new menu depths need no CSS changes.
   - Link color is forced to navy at every depth. Active-trail and visited
     colors from other stylesheets fall below 4.5:1 on white.
   - Depth is shown with indentation and a left rule, not bold weight.
   ======================================== */

.sf-menu.sf-style-uva.sf-accordion {
  display: block !important;
  flex-direction: column;
  background: #fff;
  width: 100% !important;
  padding: 0 1rem;
  margin: 0;
  list-style: none;
  position: relative !important;
  z-index: 999;
  border-radius: 0;
}

/* Level 1 row: link and toggle share a row, child list wraps below */
.sf-menu.sf-style-uva.sf-accordion > li {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  border-bottom: 1px solid #c9d1dc;
  padding: 0;
}

.sf-menu.sf-style-uva.sf-accordion > li > a,
.sf-menu.sf-style-uva.sf-accordion > li > span.nolink {
  display: flex;
  flex: 1 1 0;
  align-items: center;
  min-width: 0;
  min-height: 48px;
  padding: 12px 0.5rem;
  font-weight: 700;
  font-size: 1.125rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  white-space: normal;
  color: #232d4b !important;
  text-decoration: none;
  background: rgba(0, 0, 0, 0) !important;
}

.sf-menu.sf-style-uva.sf-accordion > li > span.nolink {
  cursor: pointer;
}

.sf-menu.sf-style-uva.sf-accordion > li > a:hover,
.sf-menu.sf-style-uva.sf-accordion > li > a:focus {
  background: #ebeef3 !important;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 0.2em;
}

/* Keyboard focus, drawn inward so it is never clipped */
.sf-menu.sf-style-uva.sf-accordion a:focus-visible,
.sf-menu.sf-style-uva.sf-accordion .sf-accordion-subtoggle:focus-visible {
  outline: 3px solid #232d4b;
  outline-offset: -3px;
}

.sf-menu.sf-style-uva.sf-accordion.sf-horizontal {
  display: block !important;
  flex-direction: column !important;
}

/* All nested lists: cancel desktop dropdown layout */
.sf-menu.sf-style-uva.sf-accordion ul {
  position: static;
  float: none;
  flex: 0 0 100%;
  width: 100% !important;
  margin: 0;
  padding: 0;
  list-style: none;
  border: 0 !important;
  box-shadow: none;
  background: rgba(0, 0, 0, 0);
}

/* Level 2 list spacing under the level 1 row */
.sf-menu.sf-style-uva.sf-accordion > li > ul {
  margin: 0 0 12px 0;
  padding: 0 0 8px 0;
}

/* Level 3+ lists are indented under their parent */
.sf-menu.sf-style-uva.sf-accordion ul ul {
  padding: 0 0 4px 1rem;
}

/* Every child list is collapsed until its parent toggle opens it */
:is(#block-global-theme-mainmenu, #block-global-theme-mainmenu-2, #block-global-theme-mainmenu-3)
  .sf-menu.sf-style-uva.sf-accordion
  li.menuparent
  > ul {
  display: none !important;
}

:is(#block-global-theme-mainmenu, #block-global-theme-mainmenu-2, #block-global-theme-mainmenu-3)
  .sf-menu.sf-style-uva.sf-accordion
  li.menuparent.sf-submenu-open
  > ul {
  display: block !important;
}

/* Nested items: link and toggle share a row, child list wraps below */
.sf-menu.sf-style-uva.sf-accordion ul li {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  float: none;
  width: 100% !important;
  margin: 0;
  padding: 0;
  border: 0 !important;
}

/* Level 2+ links: 44px target, 16px text, underlined so links are
   identifiable without hover */
.sf-menu.sf-style-uva.sf-accordion ul a {
  display: flex;
  flex: 1 1 0;
  align-items: center;
  min-width: 0;
  min-height: 44px;
  padding: 8px 0.5rem 8px 1rem;
  margin: 0;
  font-size: 1rem;
  font-weight: 400;
  text-transform: none;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2em;
  color: #232d4b !important;
  background: rgba(0, 0, 0, 0) !important;
  border: 0 !important;
}

.sf-menu.sf-style-uva.sf-accordion ul a:hover,
.sf-menu.sf-style-uva.sf-accordion ul a:focus {
  text-decoration-thickness: 2px;
  background: #ebeef3 !important;
}

/* Level 3+ links: left rule ties the group to its parent */
.sf-menu.sf-style-uva.sf-accordion ul ul a {
  border-left: 2px solid #c9d1dc !important;
}

/* Toggle buttons: reset browser defaults, 44x44 minimum target */
.sf-menu.sf-style-uva.sf-accordion .sf-accordion-subtoggle {
  -webkit-appearance: none;
  appearance: none;
  position: relative;
  flex: 0 0 44px;
  width: 44px;
  min-height: 44px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: rgba(0, 0, 0, 0);
  color: #b85400;
  cursor: pointer;
}

.sf-menu.sf-style-uva.sf-accordion .sf-accordion-subtoggle:hover {
  background: #ebeef3;
}

/* Level 2+ chevron */
.sf-menu.sf-style-uva.sf-accordion .sf-accordion-subtoggle::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0.6rem;
  height: 0.6rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translate(-50%, -70%) rotate(45deg);
  transition: transform 0.15s ease;
}

.sf-menu.sf-style-uva.sf-accordion
  .sf-accordion-subtoggle[aria-expanded="true"]::before {
  transform: translate(-50%, -30%) rotate(-135deg);
}

/* Level 1 +/- button (decorative glyph, state comes from aria-expanded) */
.sf-menu.sf-style-uva.sf-accordion .sf-accordion-subtoggle--top {
  flex-basis: 48px;
  width: 48px;
  min-height: 48px;
}

.sf-menu.sf-style-uva.sf-accordion .sf-accordion-subtoggle--top::before,
.sf-menu.sf-style-uva.sf-accordion
  .sf-accordion-subtoggle--top[aria-expanded="true"]::before {
  content: "+";
  content: "+" / "";
  width: auto;
  height: auto;
  border: 0;
  font-size: 1.75rem;
  font-weight: 500;
  line-height: 1;
  transform: translate(-50%, -50%);
  transition: none;
}

.sf-menu.sf-style-uva.sf-accordion
  .sf-accordion-subtoggle--top[aria-expanded="true"]::before {
  content: "−";
  content: "−" / "";
}

@media (prefers-reduced-motion: reduce) {
  .sf-menu.sf-style-uva.sf-accordion .sf-accordion-subtoggle::before {
    transition: none;
  }
}

.sf-menu.sf-style-uva.sf-accordion .sf-sub-indicator {
  display: none !important;
}

.sf-style-uva.sf-accordion-toggle,
.sf-style-uva.sf-accordion-toggle.sf-style-none {
  display: none !important;
}

/* Windows High Contrast / forced colors: let the system palette drive
   colors and keep focus, separators, and indicators visible */
@media (forced-colors: active) {
  .sf-menu.sf-style-uva.sf-accordion > li {
    border-bottom-color: CanvasText;
  }

  .sf-menu.sf-style-uva.sf-accordion .sf-accordion-subtoggle {
    color: ButtonText;
  }

  .sf-menu.sf-style-uva.sf-accordion a:focus-visible,
  .sf-menu.sf-style-uva.sf-accordion .sf-accordion-subtoggle:focus-visible {
    outline-color: Highlight;
  }

  .sf-menu.sf-style-uva.sf-accordion ul ul a {
    border-left-color: CanvasText !important;
  }
}

/* ========================================
   PROGRAMS STYLE (separate style)
   ======================================== */

.sf-menu.sf-style-custom-programs {
  background-color: #f8f9fa;
  border: 2px solid #232d4b;
}

.sf-menu.sf-style-custom-programs a {
  color: #232d4b;
  font-weight: 600;
  padding: 10px 20px;
}

.sf-menu.sf-style-custom-programs a:hover,
.sf-menu.sf-style-custom-programs a:focus {
  background-color: #e57200;
  color: #ffffff;
}

.sf-menu.sf-style-custom-programs ul {
  background-color: #ffffff;
  border: 1px solid #e57200;
}
