/* ==========================================================================
   BEWA Motion — entrances, micro-interactions, sheets
   ========================================================================== */

@keyframes bewa-in-up {
  from {
    opacity: 0;
    transform: translateY(16px) scale(0.985);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes bewa-pop {
  0% { transform: scale(1); }
  40% { transform: scale(0.94); }
  100% { transform: scale(1); }
}

@keyframes bewa-check {
  0% { transform: scale(0.4); opacity: 0; }
  60% { transform: scale(1.12); opacity: 1; }
  100% { transform: scale(1); opacity: 1; }
}

@keyframes bewa-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

@keyframes bewa-sheet-up {
  from { transform: translateY(100%); opacity: 0.6; }
  to { transform: none; opacity: 1; }
}

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

/* Page enter */
#appCapsule.bewa-page-enter {
  animation: bewa-in-up var(--bewa-dur-slow) var(--bewa-ease-ios) both;
}

/* Reveal / stagger */
.bewa-reveal {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity var(--bewa-dur) var(--bewa-ease-ios),
              transform var(--bewa-dur) var(--bewa-ease-ios);
  transition-delay: calc(var(--i, 0) * 45ms);
}

.bewa-reveal.is-inview {
  opacity: 1;
  transform: translateY(0);
}

.is-pressed {
  transform: scale(0.97) !important;
  transition: transform var(--bewa-dur-fast) var(--bewa-ease-ios) !important;
}

.bewa-pop {
  animation: bewa-pop var(--bewa-dur) var(--bewa-ease-ios);
}

.bewa-check-pop {
  animation: bewa-check 0.45s var(--bewa-ease-spring) both;
}

/* Skeleton */
.bewa-skeleton,
.placeholder {
  border-radius: var(--bewa-radius-sm);
  background: linear-gradient(90deg, #ebe7e1 25%, #f4f1ec 50%, #ebe7e1 75%);
  background-size: 200% 100%;
  animation: bewa-shimmer 1.1s ease-in-out infinite;
}

/* Sheet / modal soften */
.offcanvas.action-sheet.show,
.offcanvas-bottom.show,
.modal.dialogbox .modal-dialog {
  animation: bewa-sheet-up var(--bewa-dur) var(--bewa-ease-ios) both;
}

.modal.fade .modal-dialog {
  transition: transform var(--bewa-dur) var(--bewa-ease-ios);
}

.collapse,
.collapsing {
  transition: height var(--bewa-dur) var(--bewa-ease-ios);
}

/* Interactive feedback defaults */
.card,
.bewa-booking-card,
.bewa-service-row,
.bewa-ts-slot,
.bewa-profile-action,
.bewa-account-link,
.listview .item,
.image-listview > li .item {
  transition: transform var(--bewa-dur-fast) var(--bewa-ease-ios),
              box-shadow var(--bewa-dur) var(--bewa-ease-ios),
              background var(--bewa-dur-fast) var(--bewa-ease-ios);
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  #appCapsule.bewa-page-enter,
  .bewa-reveal {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
  }
}