/*
 * File: css/conf/00-base/03.animations.css
 * Logic: Global Animation Utilities, Keyframes & Scroll Reveal.
 * Refactored from: 04.animation.css
 */

/* ==========================================================================
   1. GLOBAL TRANSITIONS
   ========================================================================== */
/* Note: Anchor transition is handled in 02.typography.css */

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
textarea {
  transition: border-color var(--transition-base),
    box-shadow var(--transition-base);
}

/* ==========================================================================
   2. KEYFRAMES
   ========================================================================== */
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translate3d(0, var(--switch-translation), 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideUp {
  from {
    transform: translateY(var(--switch-translation));
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

/* ==========================================================================
   3. UTILITY CLASSES (Motion Helpers)
   ========================================================================== */
.hover-lift {
  transition: transform var(--transition-base);
}

.hover-lift:hover {
  transform: translateY(-3px);
}

.link-fill-animation {
  background-size: var(--bg-slide-size);
  background-position: var(--bg-slide-pos-start);
  transition: background-position var(--transition-main),
    color var(--transition-base);
}

.link-fill-animation:hover {
  background-position: var(--bg-slide-pos-end);
}

/* Global Button Animation Pattern (Gradient Slide) */
.btn-primary,
.button--primary,
.wsdt-slide-link,
.wsdt-button-link,
.websdt-btn-primary,
.link-cta,
.form-actions .button.form-submit,
#user-login-form .form-submit {
  background-size: var(--bg-slide-size);
  background-position: var(--bg-slide-pos-start);
  transition: background-position var(--transition-fast),
    color var(--transition-fast), border-color var(--transition-fast);
}

.btn-primary:hover,
.button--primary:hover,
.wsdt-slide-link:hover,
.wsdt-button-link:hover,
.websdt-btn-primary:hover,
.link-cta:hover,
.form-actions .button.form-submit:hover,
#user-login-form .form-submit:hover {
  background-position: var(--bg-slide-pos-end);
  box-shadow: var(--shadow-card-hover);
}