/* ============================================================
   BizEmpire — Animations & Micro-interactions
   ============================================================ */

/* ---- Status dot pulse ---- */
@keyframes pulse-dot {
  0%, 100% { opacity: 1;   transform: scale(1); }
  50%       { opacity: 0.5; transform: scale(0.8); }
}

/* ---- Toast slide in ---- */
@keyframes slide-in-right {
  from { transform: translateX(100%); opacity: 0; }
  to   { transform: translateX(0);    opacity: 1; }
}

/* ---- Tick pulse on active divisions ---- */
@keyframes tick-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(212,146,42,0.4); }
  70%  { box-shadow: 0 0 0 8px rgba(212,146,42,0); }
  100% { box-shadow: 0 0 0 0 rgba(212,146,42,0); }
}

.tick-pulse { animation: tick-pulse 1s ease-out; }

/* ---- Panel entrance ---- */
@keyframes fade-up {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

.fade-up { animation: fade-up var(--transition-slow) ease both; }

/* ---- Number change flash ---- */
@keyframes flash-green {
  0%   { color: var(--text-primary); }
  30%  { color: var(--text-green); }
  100% { color: var(--text-primary); }
}

@keyframes flash-red {
  0%   { color: var(--text-primary); }
  30%  { color: var(--text-crimson); }
  100% { color: var(--text-primary); }
}

.flash-up   { animation: flash-green 800ms ease; }
.flash-down { animation: flash-red 800ms ease; }

/* ---- Skeleton loading ---- */
@keyframes shimmer {
  0%   { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

.skeleton {
  background: linear-gradient(90deg,
    var(--bg-panel) 25%,
    var(--bg-hover) 50%,
    var(--bg-panel) 75%
  );
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
  border-radius: var(--radius-md);
  color: transparent;
  user-select: none;
}

/* ---- Construction progress wiggle ---- */
@keyframes construction {
  0%, 100% { transform: rotate(-1deg); }
  50%       { transform: rotate(1deg); }
}

.constructing { animation: construction 2s ease-in-out infinite; }

/* ---- Newcomer badge glow ---- */
@keyframes newcomer-glow {
  0%, 100% { box-shadow: 0 0 6px rgba(184,115,51,0.3); }
  50%       { box-shadow: 0 0 12px rgba(184,115,51,0.6); }
}

.badge--newcomer { animation: newcomer-glow 3s ease-in-out infinite; }

/* ---- Hover lift for cards ---- */
.lift {
  transition: transform var(--transition-normal), box-shadow var(--transition-normal);
}
.lift:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0,0,0,0.4);
}