/* ============================================================================
   motion.css — shared motion layer for the Incident Command platform.
   Loaded on every page. Ported from the SUAS dashboard's motion layer and
   adapted to ICD's chrome class names (.hdr-wrap / .page-subnav, not
   .header-wrap / .admin-subnav). Deliberately conservative + additive:
   a motion vocabulary, cross-document View Transitions, and OS reduced-motion
   support. The accent split + header lockup live in pages-shared.css already,
   so they are intentionally NOT duplicated here.
   ============================================================================ */

:root {
  /* Durations — fast for feedback, slow only for page/modal-level changes. */
  --motion-fast: 120ms;   /* taps, toggles, hovers */
  --motion-base: 200ms;   /* most transitions, list cross-fades */
  --motion-slow: 320ms;   /* modals, page-level */
  /* Easings — one named vocabulary. */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);   /* general in/out */
  --ease-decel:    cubic-bezier(0.16, 1, 0.3, 1);  /* entrances (the "spring") */
  --ease-exit:     cubic-bezier(0.4, 0, 1, 1);     /* exits */
}

/* Cross-document View Transitions: same-origin navigations (nav / subnav taps)
   cross-fade instead of hard-cutting. Browsers without support navigate normally. */
@view-transition { navigation: auto; }

/* Keep the top chrome (header + subnav wrapper) visually stable across a
   navigation — only page content cross-fades — so it reads as an app shell
   swapping content. One .hdr-wrap per page, so the name stays unique. */
.hdr-wrap { view-transition-name: app-chrome; }

/* Slide the active subnav indicator between tabs across a navigation: the active
   link on the old page morphs to the active link's spot on the new page. Exactly
   one .subnav-link.active per page, so the name stays unique. */
.page-subnav .subnav-link.active { view-transition-name: active-tab; }

/* The default root cross-fade used by withTransition() + page navigation. Short,
   so it feels like a settle, not a wipe. */
::view-transition-old(root),
::view-transition-new(root) {
  animation-duration: var(--motion-base);
  animation-timing-function: var(--ease-standard);
}

/* Honor the OS "Reduce Motion" setting everywhere. For a public-safety tool this
   matters — motion-sensitive users, and anyone under stress, get an essentially
   still UI without losing any functionality. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  ::view-transition-group(*),
  ::view-transition-old(*),
  ::view-transition-new(*) {
    animation: none !important;
  }
}
