/* Turbo keeps internal navigation in the current document. The native View
 * Transition API makes that swap feel continuous while remaining optional in
 * browsers that do not support it. */

@media (prefers-reduced-motion: no-preference) {
  .site-header .navbar-brand {
    view-transition-name: inad-navbar-brand;
  }

  ::view-transition-group(inad-navbar-brand) {
    animation-duration: 300ms;
    animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
    z-index: 1032;
  }

  ::view-transition-image-pair(inad-navbar-brand) {
    isolation: auto;
  }

  ::view-transition-old(inad-navbar-brand),
  ::view-transition-new(inad-navbar-brand),
  ::view-transition-old(root),
  ::view-transition-new(root) {
    mix-blend-mode: normal;
  }

  ::view-transition-old(inad-navbar-brand) {
    animation: inad-fade-out 150ms ease both;
  }

  ::view-transition-new(inad-navbar-brand) {
    animation: inad-fade-in 280ms 40ms cubic-bezier(0.22, 1, 0.36, 1) both;
  }

  ::view-transition-old(root) {
    animation: inad-fade-out 130ms ease both;
  }

  ::view-transition-new(root) {
    animation: inad-fade-in 320ms 45ms cubic-bezier(0.22, 1, 0.36, 1) both;
  }
}

@media (min-width: 1100px) and (prefers-reduced-motion: no-preference) {
  .site-header .navbar-collapse {
    view-transition-name: inad-navbar-navigation;
  }

  ::view-transition-group(inad-navbar-navigation),
  ::view-transition-old(inad-navbar-navigation),
  ::view-transition-new(inad-navbar-navigation) {
    animation: none;
  }

  ::view-transition-group(inad-navbar-navigation) {
    z-index: 1031;
  }

  ::view-transition-old(inad-navbar-navigation) {
    opacity: 0;
  }

  ::view-transition-new(inad-navbar-navigation) {
    opacity: 1;
  }
}

@keyframes inad-fade-out {
  from { opacity: 1; }
  to { opacity: 0; }
}

@keyframes inad-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
