/* TrustUs OS motion foundation — presentation utilities only. */

:root {
  --tu-motion-fast: var(--t-motion-fast, 200ms);
  --tu-motion-base: var(--t-motion-base, 250ms);
  --tu-motion-slow: var(--t-motion-slow, 300ms);
  --tu-motion-ease: var(--t-ease, cubic-bezier(0.4, 0, 0.2, 1));
}

.tu-motion-fade-in {
  animation: tu-fade-in var(--tu-motion-base) var(--tu-motion-ease) both;
}

.tu-motion-slide-in {
  animation: tu-slide-in var(--tu-motion-base) var(--tu-motion-ease) both;
}

.tu-motion-scale-in {
  animation: tu-scale-in var(--tu-motion-fast) var(--tu-motion-ease) both;
}

.tu-motion-card-enter {
  animation: tu-card-enter var(--tu-motion-slow) var(--tu-motion-ease) both;
}

.tu-motion-thumb-fade {
  animation: tu-fade-in var(--tu-motion-slow) ease both;
}

.tu-motion-unread-pulse {
  animation: tu-unread-pulse var(--tu-motion-slow) var(--tu-motion-ease) 1;
}

.tu-smooth-scroll {
  scroll-behavior: smooth;
}

/* Immediate press acknowledgment — visual only, no fake progress. */
a.is-pressing,
button.is-pressing,
input[type="submit"].is-pressing,
input[type="button"].is-pressing,
[role="button"].is-pressing,
[data-action].is-pressing,
[data-press-state="active"] {
  opacity: 0.82;
  filter: brightness(0.97);
  transform: translateY(1px);
  transition:
    opacity var(--tu-motion-fast) var(--tu-motion-ease),
    filter var(--tu-motion-fast) var(--tu-motion-ease),
    transform var(--tu-motion-fast) var(--tu-motion-ease);
}

a.is-pressing,
button.is-pressing[aria-busy="true"],
input[type="submit"].is-pressing[aria-busy="true"] {
  cursor: progress;
}

@media (prefers-reduced-motion: reduce) {
  a.is-pressing,
  button.is-pressing,
  input[type="submit"].is-pressing,
  input[type="button"].is-pressing,
  [role="button"].is-pressing,
  [data-action].is-pressing,
  [data-press-state="active"] {
    transform: none;
    transition-duration: 0.001ms;
  }
}

/* Same-origin navigation hold — keep prior content visible until unload.
   Mechanics only: reuses press opacity; no layout/color redesign. */
html.is-navigating,
html[data-tu-nav-pending="1"] {
  cursor: progress;
}

html.is-navigating #main-content[data-tu-nav-hold="1"],
html.is-navigating main[data-tu-nav-hold="1"],
html.is-navigating body[data-tu-nav-hold="1"] {
  opacity: 0.97;
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  html.is-navigating #main-content[data-tu-nav-hold="1"],
  html.is-navigating main[data-tu-nav-hold="1"],
  html.is-navigating body[data-tu-nav-hold="1"] {
    opacity: 1;
  }
}

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

@keyframes tu-slide-in {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes tu-scale-in {
  from {
    opacity: 0;
    transform: scale(0.98);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes tu-card-enter {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes tu-unread-pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(234, 88, 12, 0.18);
  }
  100% {
    box-shadow: 0 0 0 8px rgba(234, 88, 12, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  html,
  .tu-smooth-scroll {
    scroll-behavior: auto !important;
  }

  .tu-motion-fade-in,
  .tu-motion-slide-in,
  .tu-motion-scale-in,
  .tu-motion-card-enter,
  .tu-motion-thumb-fade,
  .tu-motion-unread-pulse,
  [data-notification-preview],
  [data-notification-root] .t-comms-panel,
  [data-notification-root] .t-comms-backdrop,
  .t-comms-toast,
  .t-comms-card,
  .t-sidebar,
  .t-nav-backdrop {
    animation: none !important;
    transition-duration: 0.001ms !important;
    transform: none !important;
  }
}
