/* MyOmniCareer — View Transitions (Priority 4)
   Cross-document transitions: @view-transition { navigation: auto }
   HTMX in-page transitions: CSS animation triggered via .omni-transitioning class
   Reduced motion: all animations disabled when prefers-reduced-motion: reduce
*/

/* ── Cross-document page transitions ──────────────────────────────────────── */
@view-transition {
  navigation: auto;
}

/* Default: whole-page fade */
::view-transition-old(root) {
  animation: omni-fade-out 180ms ease-in forwards;
}
::view-transition-new(root) {
  animation: omni-fade-in 220ms ease-out forwards;
}

/* Shared element: job card ↔ detail header morph */
::view-transition-old(omni-job-hero) {
  animation: omni-fade-out 160ms ease-in forwards;
}
::view-transition-new(omni-job-hero) {
  animation: omni-hero-enter 280ms cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

/* ── HTMX in-page swap transitions (#job-list) ───────────────────────────── */
#job-list.omni-transitioning {
  animation: omni-fade-out 120ms ease-in forwards;
}
#job-list.omni-settling {
  animation: omni-fade-in 200ms ease-out forwards;
}

/* ── Keyframes ───────────────────────────────────────────────────────────── */
@keyframes omni-fade-in {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes omni-fade-out {
  from { opacity: 1; transform: translateY(0); }
  to   { opacity: 0; transform: translateY(-4px); }
}

@keyframes omni-hero-enter {
  from { opacity: 0; transform: scale(0.97) translateY(8px); }
  to   { opacity: 1; transform: scale(1)    translateY(0); }
}

/* ── Reduced motion: kill everything ─────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(root),
  ::view-transition-new(root),
  ::view-transition-old(omni-job-hero),
  ::view-transition-new(omni-job-hero) {
    animation: none !important;
  }
  #job-list.omni-transitioning,
  #job-list.omni-settling {
    animation: none !important;
  }
}