/* =========================================================
   WCAG 2.1 ACCESSIBLE MENU (VARIABLE-DRIVEN)
   Uses sub-theme variables automatically
========================================================= */

/* ===== BASE MENU BAR ===== */
#primary-menu,
.primary-menu {
  border-bottom: 1px solid var(--sbn-menu-border, #d0d7de);
}

/* ===== TOP LEVEL ===== */
#primary-menu .menu,
.primary-menu .menu {
  display: flex;
  gap: 0;
  align-items: stretch;
}

/* ===== MENU ITEMS ===== */
#primary-menu .menu > .menu-item,
.primary-menu .menu > .menu-item {
  position: relative;
}

/* ===== MENU LINKS ===== */
#primary-menu .menu > .menu-item > a,
.primary-menu .menu > .menu-item > a {
  display: block;
  padding: 12px 18px;
  font-weight: 600;
  text-decoration: none;

  background: var(--sbn-menu-bg, #f3f6f9);
  color: var(--sbn-menu-text, #222222);

  border-right: 1px solid var(--sbn-menu-border, #d0d7de);
  transition: all 0.2s ease;
}

/* ===== HOVER ===== */
#primary-menu .menu > .menu-item > a:hover,
.primary-menu .menu > .menu-item > a:hover {
  background: var(--sbn-menu-hover-bg, #048629);
  color: var(--sbn-menu-hover-text, #ffffff);
}

/* ===== ACTIVE ===== */
#primary-menu .menu > .menu-item.is-active > a,
.primary-menu .menu > .menu-item.is-active > a {
  background: var(--sbn-menu-active-bg, #e6f4ea);
  color: var(--sbn-menu-active-text, #222222);
}

/* ===== KEYBOARD FOCUS ===== */
#primary-menu a:focus,
.primary-menu a:focus {
  outline: 3px solid var(--sbn-focus, #30c64e);
  outline-offset: 2px;
}

/* =========================================================
   DROPDOWN MENU
========================================================= */

#primary-menu .menu .menu,
.primary-menu .menu .menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 220px;

  background: var(--sbn-menu-dropdown-bg, #ffffff);
  border: 1px solid var(--sbn-menu-dropdown-border, #d0d7de);

  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  z-index: 1000;
}

/* SHOW DROPDOWN */
#primary-menu .menu-item.open > .menu,
.primary-menu .menu-item.open > .menu {
  display: block;
}

/* DROPDOWN ITEMS */
#primary-menu .menu .menu a,
.primary-menu .menu .menu a {
  padding: 10px 14px;
  display: block;
  font-weight: 500;

  background: var(--sbn-menu-dropdown-bg, #ffffff);
  color: var(--sbn-menu-text, #222222);
}

/* DROPDOWN HOVER */
#primary-menu .menu .menu a:hover,
.primary-menu .menu .menu a:hover {
  background: var(--sbn-menu-hover-bg, #048629);
  color: var(--sbn-menu-hover-text, #ffffff);
}

/* =========================================================
   ACCESSIBILITY ENHANCEMENTS
========================================================= */

/* ARIA EXPANDED INDICATOR */
.menu-item-has-children > a::after {
  content: " ▼";
  font-size: 0.7em;
}

/* HOVER SUPPORT (DESKTOP) */
@media (hover: hover) {
  .menu-item-has-children:hover > .menu {
    display: block;
  }
}

/* =========================================================
   MOBILE (OPTIONAL BASE SUPPORT)
========================================================= */
@media (max-width: 768px) {
  #primary-menu .menu {
    flex-direction: column;
  }

  #primary-menu .menu > .menu-item > a {
    border-right: none;
    border-bottom: 1px solid var(--sbn-menu-border, #d0d7de);
  }
}