/* One thin navigation lens: material stays on the existing shell planes.
 * No backdrop-filter, transformed labels or idle animation on individual links. */
html.liquid-glass .glass-nav-control {
  position: relative;
  isolation: isolate;
  border-radius: 1rem;
  color: var(--ds-text-muted, #475569);
}

html.liquid-glass .glass-nav-control > :is(span, div, svg) {
  position: relative;
  z-index: 1;
}

html.liquid-glass .glass-nav-control:is([aria-current='page'], .is-active,
  .glass-nav-bottom[aria-expanded='true']) {
  background-color: transparent !important;
  color: var(--ds-text, #142230) !important;
  box-shadow: none !important;
  font-weight: 650;
}

html.liquid-glass .glass-nav-control:is([aria-current='page'], .is-active,
  .glass-nav-bottom[aria-expanded='true'], .glass-nav-hot, :focus-visible)::before {
  content: '';
  position: absolute;
  inset: 1px;
  z-index: 0;
  pointer-events: none;
  border-radius: inherit;
  border: 1px solid rgb(160 183 200 / .64);
  background-color: rgb(255 255 255 / .72);
  background-image:
    radial-gradient(ellipse at var(--glass-nav-light-x, 50%) var(--glass-nav-light-y, 0%),
      rgb(255 255 255 / .98), rgb(255 255 255 / .06) 62%),
    linear-gradient(145deg, rgb(255 255 255 / .42), transparent 50%, rgb(216 231 243 / .2));
  box-shadow: 0 4px 10px rgb(25 53 70 / .09), inset 0 1px 0 #fff,
    inset 0 -1px 0 rgb(65 93 116 / .12);
}

html.liquid-glass .glass-nav-control:is([aria-current='page'], .is-active)::before {
  border-color: #809aaa;
  box-shadow: 0 5px 14px rgb(25 53 70 / .13), inset 0 1px 0 #fff,
    inset 3px 0 0 rgb(28 65 84 / .54), inset 0 -1px 0 rgb(65 93 116 / .12);
}

html.liquid-glass .glass-nav-bottom {
  border-radius: 1.35rem;
}

/* Original icon holders share the lens rather than covering it with a second
 * solid active pill. Badges and semantic icons keep their own colours. */
html.liquid-glass .glass-nav-bottom:is([aria-current='page'], .glass-nav-hot) > div:first-child {
  background-color: transparent !important;
}

html.liquid-glass .glass-nav-bottom > div:first-child > .ui-icon {
  color: inherit;
}

html.liquid-glass .glass-nav-control:focus-visible {
  outline: 2px solid #075985 !important;
  outline-offset: 2px;
}

/* Exact application drawer panel only. Never style arbitrary chat sidebars,
 * dialog interiors, data cards or rows as navigation material. */
html.liquid-glass #mobile-menu-drawer [data-bottom-sheet] {
  background-color: #f7fafc;
  background-image: var(--glass-lighting, none);
  border-color: var(--glass-border, #b7c8d3);
  border-radius: 1.75rem 1.75rem 0 0;
  box-shadow: var(--glass-shadow, 0 -8px 32px rgb(25 53 70 / .15));
  -webkit-backdrop-filter: var(--glass-blur, none);
  backdrop-filter: var(--glass-blur, none);
}

@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  html.liquid-glass #mobile-menu-drawer [data-bottom-sheet] {
    background-color: rgb(247 250 252 / .88);
  }
}

@keyframes liquid-glass-nav-settle {
  from { scale: .98; }
  65% { scale: 1.015; }
  to { scale: 1; }
}

@media screen and (prefers-reduced-motion: no-preference) and (forced-colors: none) {
  html.liquid-glass:not(.ui-safe-mode) .glass-nav-control:is([aria-current='page'], .is-active)::before {
    animation: liquid-glass-nav-settle 260ms cubic-bezier(.2, .7, .2, 1) 1;
  }
  html.liquid-glass:not(.ui-safe-mode) .glass-nav-control:active::before {
    box-shadow: inset 0 1px 5px rgb(25 53 70 / .14), inset 0 1px 0 #fff;
  }
  html.liquid-glass:not(.ui-safe-mode)[data-glass-quality='lite'] .glass-nav-control::before {
    animation-duration: 160ms;
    box-shadow: 0 2px 5px rgb(25 53 70 / .1), inset 0 1px 0 #fff;
  }
}

html.liquid-glass.ui-safe-mode #mobile-menu-drawer [data-bottom-sheet] {
  background: #f7fafc;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

@media (prefers-reduced-motion: reduce), (prefers-reduced-transparency: reduce),
  (prefers-contrast: more), (forced-colors: active), print {
  html.liquid-glass .glass-nav-control::before {
    animation: none !important;
    scale: none !important;
    transition: none !important;
  }
  html.liquid-glass #mobile-menu-drawer [data-bottom-sheet] {
    background: #f7fafc;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    box-shadow: none;
  }
}

@media (prefers-contrast: more), (forced-colors: active), print {
  html.liquid-glass :is([data-navigation-shell], #mobile-menu-drawer, [data-mobile-bottom-nav])
    :is(a, button):is([aria-current='page'], .is-active) {
    color: var(--ds-text, #142230) !important;
    background: var(--ds-surface-1, #fff) !important;
    text-decoration: underline;
    text-underline-offset: .2em;
    outline: 1px solid var(--ds-text, #142230);
  }
}

@media (forced-colors: active) {
  html.liquid-glass #mobile-menu-drawer [data-bottom-sheet],
  html.liquid-glass.ui-safe-mode #mobile-menu-drawer [data-bottom-sheet] { background: Canvas; color: CanvasText; }
  html.liquid-glass :is([data-navigation-shell], #mobile-menu-drawer, [data-mobile-bottom-nav]) :focus-visible {
    outline-color: Highlight !important;
  }
}

@media print {
  html.liquid-glass #mobile-menu-drawer [data-bottom-sheet],
  html.liquid-glass.ui-safe-mode #mobile-menu-drawer [data-bottom-sheet] { background: #fff; }
}