/* Boston Erp motion: short, purposeful animations. Fully disabled for people who ask their device for reduced motion. */

@keyframes dbz-fade-up { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@keyframes dbz-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes dbz-pop { from { opacity: 0; transform: translateY(8px) scale(.97); } to { opacity: 1; transform: none; } }
@keyframes dbz-logo-in { from { opacity: 0; transform: translateY(-8px) scale(.94); filter: blur(4px); } to { opacity: 1; transform: none; filter: none; } }
@keyframes dbz-turn { to { transform: rotate(360deg); } }
@keyframes dbz-turn-back { to { transform: rotate(-360deg); } }
@keyframes dbz-pulse { 0% { box-shadow: 0 0 0 0 rgba(108, 92, 231, .55); } 70% { box-shadow: 0 0 0 7px rgba(108, 92, 231, 0); } 100% { box-shadow: 0 0 0 0 rgba(108, 92, 231, 0); } }
@keyframes dbz-pulse-light { 0% { box-shadow: 0 0 0 0 rgba(255, 255, 255, .7); } 70% { box-shadow: 0 0 0 8px rgba(255, 255, 255, 0); } 100% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); } }
@keyframes dbz-bounce { 0% { transform: scale(1); } 40% { transform: scale(1.25); } 100% { transform: scale(1); } }
@keyframes dbz-star { 0% { transform: scale(.6) rotate(-15deg); } 60% { transform: scale(1.3) rotate(8deg); } 100% { transform: scale(1); } }
@keyframes dbz-draw { to { stroke-dashoffset: 0; } }
@keyframes dbz-shine { from { background-position: -200% 0; } to { background-position: 200% 0; } }

@media (prefers-reduced-motion: no-preference) {
  /* page / screen change */
  .view-enter { animation: dbz-fade-up .38s cubic-bezier(.2, .7, .2, 1) both; }

  /* lists and dashboards appear one item after another */
  /* "backwards" so the hover lift still works after the entrance animation */
  .stagger > * { animation: dbz-fade-up .45s cubic-bezier(.2, .7, .2, 1) backwards; }
  .stagger > *:nth-child(2) { animation-delay: .04s; }
  .stagger > *:nth-child(3) { animation-delay: .08s; }
  .stagger > *:nth-child(4) { animation-delay: .12s; }
  .stagger > *:nth-child(5) { animation-delay: .16s; }
  .stagger > *:nth-child(6) { animation-delay: .2s; }
  .stagger > *:nth-child(7) { animation-delay: .24s; }
  .stagger > *:nth-child(8) { animation-delay: .28s; }
  .stagger > *:nth-child(9) { animation-delay: .32s; }
  .stagger > *:nth-child(n+10) { animation-delay: .36s; }

  /* gentle lift on hover for clickable cards */
  .tile, .card, .m-card, .list-item, .assignee, .chip { transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .15s ease; }
  a.tile:hover, a.m-card:hover { transform: translateY(-3px); box-shadow: 0 10px 24px rgba(38, 40, 69, .12); }
  .sched .chip:hover { transform: translateX(2px); }
  .btn { transition: background .15s, border-color .15s, color .15s, transform .08s, box-shadow .15s; }
  .btn:active { transform: scale(.97); }
  .btn.primary:hover, .btn.success:hover { box-shadow: 0 6px 16px rgba(59, 79, 184, .25); }

  /* dialogs */
  .modal-bg { animation: dbz-fade-in .2s ease both; }
  .modal { animation: dbz-pop .25s cubic-bezier(.2, .8, .2, 1) both; }

  /* live status indicators */
  .badge.b-in_progress::before, .st-dot.busy { animation: dbz-pulse 1.8s ease-out infinite; border-radius: 50%; }
  .live .ref::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 7px; border-radius: 50%; background: #fff; vertical-align: 1px; animation: dbz-pulse-light 1.8s ease-out infinite; }

  /* tables fade in */
  .tbl tbody tr { animation: dbz-fade-in .3s ease both; }

  /* bottom tab bar (app) */
  .tabbar a.active .ic { animation: dbz-bounce .35s ease; }

  /* rating stars */
  .stars-in button.on { animation: dbz-star .35s ease both; }

  /* logos */
  .logo-anim { animation: dbz-logo-in .7s cubic-bezier(.2, .7, .2, 1) both; }

  /* decorative rings that echo the round Boston Erp mark (login screens) */
  .rings span { animation: dbz-turn 40s linear infinite; }
  .rings span:nth-child(2) { animation: dbz-turn-back 55s linear infinite; }
  .rings span:nth-child(3) { animation: dbz-turn 70s linear infinite; }

  /* shimmering accent line */
  .shine { background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .55), transparent) no-repeat; background-size: 50% 100%; animation: dbz-shine 3.5s ease-in-out infinite; }

  /* thank-you tick (feedback page) */
  .tick circle, .tick path { stroke-dasharray: 160; stroke-dashoffset: 160; animation: dbz-draw .7s ease forwards; }
  .tick path { animation-delay: .45s; }
}

/* decorative rings (static when motion is reduced) */
.rings { position: absolute; pointer-events: none; }
.rings span { position: absolute; inset: 0; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .14); border-left-color: transparent; border-bottom-color: rgba(255, 255, 255, .05); }
.rings span:nth-child(2) { inset: 14%; border-width: 2px; border-color: rgba(255, 255, 255, .1); border-top-color: transparent; }
.rings span:nth-child(3) { inset: 30%; border-width: 3px; border-color: rgba(255, 255, 255, .12); border-right-color: transparent; border-bottom-color: transparent; }

@media (prefers-reduced-motion: no-preference) {
  .flow .st.current .dot, .step-list li.current .num { animation: dbz-pulse 1.8s ease-out infinite; }
}