/* Persistent pillar accents and an unmistakable current-page treatment.
   Loaded after the shared/mobile shell so these states also apply in the drawer. */
.sff-island .ed-primary .ed-menu-panel {
  --sff-nav-accent: var(--ed-menu-accent, #27387e);
}

.sff-island .ed-primary .ed-menu-panel a {
  display: flex;
  align-items: center;
  border: 1px solid color-mix(in srgb, var(--sff-nav-accent) 42%, white);
  background: #fff;
  color: #172450;
  box-shadow:
    inset 3px 0 0 var(--sff-nav-accent),
    0 3px 0 color-mix(in srgb, var(--sff-nav-accent) 15%, transparent),
    0 7px 16px #17245012;
  transition: background .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.sff-island .ed-primary .ed-menu-project > h2.ed-menu-group-title {
  color: #27387e;
  font-weight: 600;
  text-transform: uppercase;
  padding: 0 10px;
  margin: 4px 0 13px;
}

@media (max-width: 1320px) {
  .sff-island .ed-primary .ed-menu-project > h2.ed-menu-group-title { padding-left: 2px; margin-bottom: 18px; }
}

.sff-island .ed-primary .ed-menu-panel a.ed-menu-news-button {
  background: linear-gradient(135deg, #34498e, #27387e);
  color: #fff;
  border-color: #9fd0f0;
  box-shadow: inset 3px 0 #9fd0f0, 0 3px 0 #192758, 0 12px 22px -9px #27387e80;
}

@media (hover: hover) and (pointer: fine) {
  .sff-island .ed-primary .ed-menu-panel a:hover {
    background: color-mix(in srgb, var(--sff-nav-accent) 6%, white);
    color: #172450;
    border-color: var(--sff-nav-accent);
    box-shadow:
      inset 3px 0 0 var(--sff-nav-accent),
      0 3px 0 color-mix(in srgb, var(--sff-nav-accent) 22%, transparent),
      0 9px 18px #1724501a;
  }

  .sff-island .ed-primary .ed-menu-panel a.ed-menu-news-button:hover {
    background: #27387e;
    color: #fff;
    border-color: #9fd0f0;
  }
}

.sff-island .ed-primary .ed-menu-panel a[aria-current="page"],
.sff-island .ed-primary .ed-menu-panel a[aria-current="page"]:hover,
.sff-island .ed-primary .ed-menu-panel a[aria-current="page"]:focus-visible {
  background: #dc1f25;
  color: #fff;
  border-color: #27387e;
  box-shadow: inset 3px 0 0 #27387e, 0 0 0 1px #27387e, 0 3px 0 #1c2a61, 0 8px 18px #27387e2b;
}

.sff-island .ed-primary .ed-menu-panel a:focus-visible {
  outline: 3px solid #27387e;
  outline-offset: 4px;
}

@media (prefers-reduced-motion: reduce) {
  .sff-island .ed-primary .ed-menu-panel a { transition: none; }
}
