/*
  Wortic macOS UI Kit — Motion
  Padrões de animação físicos e discretos. Sem bounce exagerado,
  sem scale dramático. Feedback rápido (~120-180ms).
*/

@layer utilities {
  .wm-motion-safe {
    transition-duration: var(--wm-duration-normal);
    transition-timing-function: var(--wm-ease-standard);
  }

  /* Pressed comprime rápido; o retorno usa spring curto para dar
     sensação tátil de mola, não de fade. */
  .wm-press {
    transition: transform var(--wm-duration-normal) var(--wm-ease-spring);
  }
  .wm-press:active {
    transform: scale(var(--wm-scale-pressed));
    transition-duration: var(--wm-duration-instant);
    transition-timing-function: var(--wm-ease-standard);
  }

  .wm-press-sm {
    transition: transform var(--wm-duration-normal) var(--wm-ease-spring);
  }
  .wm-press-sm:active {
    transform: scale(var(--wm-scale-pressed-sm));
    transition-duration: var(--wm-duration-instant);
    transition-timing-function: var(--wm-ease-standard);
  }

  /* Hover eleva sutilmente algo que flutua (cards interativos). */
  .wm-hover-raise {
    transition:
      transform var(--wm-duration-fast) var(--wm-ease-emphasized),
      box-shadow var(--wm-duration-fast) var(--wm-ease-emphasized);
  }
  .wm-hover-raise:hover {
    transform: translateY(var(--wm-scale-hover-raise, -1px));
  }

  .wm-fade-in {
    animation: wm-fade-in var(--wm-duration-normal) var(--wm-ease-decelerate) both;
  }

  .wm-scale-in {
    animation: wm-scale-in var(--wm-duration-normal) var(--wm-ease-emphasized) both;
  }

  .wm-slide-up {
    animation: wm-slide-up var(--wm-duration-slow) var(--wm-ease-emphasized) both;
  }

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

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

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

  @keyframes wm-spin {
    to { transform: rotate(360deg); }
  }

  @media (prefers-reduced-motion: reduce) {
    .wm-fade-in,
    .wm-scale-in,
    .wm-slide-up {
      animation-duration: 1ms;
    }
    .wm-press:active,
    .wm-press-sm:active,
    .wm-hover-raise:hover {
      transform: none;
    }
  }
}