/* Shared navigation affordance across ITS sections and document renderers.
   Only explicit navigation glyphs receive this class; flow diagrams and UI
   controls keep their own meaning. Existing orange tokens provide contrast. */
:root {
  --nav-arrow-color: var(--brand-orange-ink);
  --nav-arrow-hover: var(--its-accent-hover);
}

a .its-nav-arrow {
  display: inline-block;
  flex-shrink: 0;
  color: var(--nav-arrow-color);
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  transition: color .16s ease, transform .16s ease;
}

/* Dark surfaces use the original brand orange. Secondary white buttons
   explicitly restore the light-surface color. */
:is(.os-domain, .cx-entry-grid > .its-entry, .sidebar, .cx-hero,
    .module-intro, .cycle, .pilot-strip, .v-pilot, .gate-feedback,
    .v-door:first-child, .button:not(.secondary)) {
  --nav-arrow-color: var(--brand-orange);
  --nav-arrow-hover: var(--its-accent-light);
}
.button.secondary {
  --nav-arrow-color: var(--brand-orange-ink);
  --nav-arrow-hover: var(--its-accent-hover);
}

/* Plain text navigation links get a real touch target. Existing card/flex
   layouts retain their more specific display and spacing rules. */
:where(a:has(.its-nav-arrow)) {
  display: inline-block;
  min-height: 44px;
  min-width: 44px;
  padding-block: 10px;
  touch-action: manipulation;
  text-underline-offset: .22em;
  transition: background-color .16s ease, box-shadow .16s ease;
}

a:has(.its-nav-arrow):focus-visible {
  outline: 3px solid var(--nav-arrow-color);
  outline-offset: 4px;
  text-decoration: underline;
}
a:focus-visible .its-nav-arrow {
  color: var(--nav-arrow-hover);
  transform: translateX(2px);
}
@media (hover: hover) {
  a:has(.its-nav-arrow):hover {
    text-decoration: underline;
    text-decoration-thickness: 1px;
  }
  a:hover .its-nav-arrow {
    color: var(--nav-arrow-hover);
    transform: translateX(2px);
  }
}

/* Disclosure markers are interface controls, not document links. */
summary::marker, summary::-webkit-details-marker { color: var(--muted); }
.sidebar summary::marker, .sidebar summary::-webkit-details-marker { color: var(--its-on-dark); }
summary { min-height: 44px; }
.cx-disclosure > summary { min-height: 44px; }
.pagination button { min-width: 44px; min-height: 44px; color: var(--muted); }

@media (max-width: 900px), (pointer: coarse) {
  a:has(.its-nav-arrow) { min-height: 44px; min-width: 44px; }
}
@media (prefers-reduced-motion: reduce) {
  a:has(.its-nav-arrow), a .its-nav-arrow { transition: none; }
  a:is(:hover, :focus-visible) .its-nav-arrow { transform: none; }
}
@media print {
  a .its-nav-arrow { color: var(--its-ink); transform: none; }
}