/* Modern Natural local navigation. Visual contract only: module owners retain
 * layout, scrolling, semantics, selection controllers and keyboard behavior.
 * Existing components adopt these tokens in their authoritative winning rules.
 * New simple components may opt into the classes below (never global nav/a/button).
 */
:root {
  --al-nav-surface: var(--al-surface-card);
  --al-nav-group: var(--al-surface-subtle);
  --al-nav-border: var(--al-surface-border);
  --al-nav-text: var(--al-surface-ink-muted);
  --al-nav-hover-text: var(--al-surface-ink);
  --al-nav-selected: var(--al-surface-border-selected);
  --al-nav-selected-surface: var(--al-surface-selected);
  --al-nav-focus: var(--al-surface-border-hover);
  --al-nav-radius: var(--al-surface-radius-compact);
  --al-nav-shadow: var(--al-surface-shadow-none);
  --al-nav-marker: inset 0 -2px 0 var(--al-nav-selected);
  --al-nav-link-gap: .5rem;
  --al-nav-support-size: .875rem;
  --al-nav-support-leading: 1.4;
  /* Phase 4B: selection/filter chips, never status or care badges. */
  --al-chip-surface: var(--al-surface-card);
  --al-chip-border: var(--al-surface-border);
  --al-chip-ink: var(--al-surface-ink-muted);
  --al-chip-selected-surface: var(--al-surface-selected);
  --al-chip-selected-border: var(--al-surface-border-selected);
  --al-chip-selected-ink: var(--al-surface-premium);
  --al-chip-focus: var(--al-surface-border-hover);
  --al-chip-radius: var(--al-surface-radius-compact);
  --al-chip-gap: .375rem;
  --al-chip-padding: .375rem .625rem;
  --al-chip-font-size: .8125rem;
  --al-chip-line-height: 1.35;
}

.al-navigation-tabs { border-bottom:1px solid var(--al-nav-border); }
/* Phase 4C: visual navigation semantics, never destinations or menu behavior. */
.al-breadcrumbs { color:var(--al-nav-text); gap:var(--al-nav-link-gap); font-size:var(--al-nav-support-size); line-height:var(--al-nav-support-leading); }
.al-breadcrumbs a { color:var(--al-nav-selected); text-underline-offset:.18em; }
.al-breadcrumbs [aria-current="page"] { color:var(--al-nav-hover-text); }
.al-navigation-link:hover { color:var(--al-nav-selected); }
.al-navigation-link:focus-visible,
.al-breadcrumbs a:focus-visible { outline:2px solid var(--al-nav-focus); outline-offset:2px; }
.al-navigation-segments { background:var(--al-nav-group); border:1px solid var(--al-nav-border); border-radius:var(--al-nav-radius); }
:where(.al-navigation-tab,.al-navigation-segment) {
  background:transparent; color:var(--al-nav-text); box-shadow:var(--al-nav-shadow);
}
.al-navigation-tab { border-radius:0; }
.al-navigation-segment { border-radius:var(--al-nav-radius); }
/* Opt-in vocabulary for new consumers. Existing filters bind these tokens at
 * their authoritative local rules, preserving native inputs and controllers. */
.al-filter-chip {
  display:inline-flex; align-items:center; gap:var(--al-chip-gap);
  max-width:100%; padding:var(--al-chip-padding);
  border:1px solid var(--al-chip-border); border-radius:var(--al-chip-radius);
  background:var(--al-chip-surface); color:var(--al-chip-ink);
  font-size:var(--al-chip-font-size); line-height:var(--al-chip-line-height);
  white-space:normal; overflow-wrap:anywhere; box-shadow:none;
}
.al-filter-chip:is([aria-pressed="true"],.is-selected,.al-filter-chip--removable) {
  background:var(--al-chip-selected-surface); border-color:var(--al-chip-selected-border); color:var(--al-chip-selected-ink);
}
.al-filter-chip:hover:not(:disabled):not([aria-disabled="true"]) { border-color:var(--al-chip-focus); }
.al-filter-chip:focus-visible { outline:2px solid var(--al-chip-focus); outline-offset:2px; }
.al-filter-chip:is(:disabled,[aria-disabled="true"]) { background:var(--al-nav-group); color:var(--al-nav-text); cursor:not-allowed; }
:where(.al-navigation-tab,.al-navigation-segment):hover:not(:disabled):not([aria-disabled="true"]) { color:var(--al-nav-hover-text); }
.al-navigation-tab:is([aria-selected="true"],[aria-current="page"]) { color:var(--al-nav-selected); box-shadow:var(--al-nav-marker); }
.al-navigation-segment:is([aria-pressed="true"],[aria-selected="true"],[aria-current="page"]) { color:var(--al-nav-selected); background:var(--al-nav-selected-surface); }
:where(.al-navigation-tab,.al-navigation-segment):focus-visible { outline:2px solid var(--al-nav-focus); outline-offset:2px; }
:where(.al-navigation-tab,.al-navigation-segment):is(:disabled,[aria-disabled="true"]) { color:var(--al-nav-text); background:var(--al-nav-group); cursor:not-allowed; }
@media (forced-colors:active) {
  :where(.al-navigation-tab,.al-navigation-segment):is([aria-selected="true"],[aria-current="page"],[aria-pressed="true"]) { outline:2px solid Highlight; outline-offset:-2px; }
}