/* Custom Dash Styling for Sales Dashboard */

@keyframes subtlePulse {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.05);
  }
  100% {
    transform: scale(1);
  }
}

.pulse-icon {
  display: inline-block;
  animation: subtlePulse 2.5s infinite ease-in-out;
}

/* DataTable hover and smooth transitions */
.dash-spreadsheet tr:hover td {
  background-color: #e2e8f0 !important;
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.dash-table-tooltip {
  background-color: #1e293b !important;
  color: #f8fafc !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  font-size: 0.75rem !important;
  white-space: pre-line !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
  z-index: 1000 !important;
}

/* Executive Summary Rank #1 Pulse Animation */
.pulse-anim {
  animation: pulse 2s infinite;
}

@keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(234, 179, 8, 0.4);
  }
  70% {
    box-shadow: 0 0 0 10px rgba(234, 179, 8, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(234, 179, 8, 0);
  }
}

/* Interactive Live Card & Bouncing Rank Animations */
.live-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}

.live-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(0,0,0,0.15) !important;
}

.moving-icon {
  display: inline-block;
  animation: bounce-gentle 2.5s infinite ease-in-out;
}

@keyframes bounce-gentle {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-8px);
  }
}

@keyframes spin-3d { 0% { transform: rotateY(0deg); } 100% { transform: rotateY(360deg); } }
@keyframes party-tada { 0% { transform: scale(1); } 10%, 20% { transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { transform: scale(1.15) rotate(3deg); } 40%, 60%, 80% { transform: scale(1.15) rotate(-3deg); } 100% { transform: scale(1); } }
@keyframes live-clap { 0% { transform: scale(1) rotate(0deg); } 50% { transform: scale(1.2) rotate(-15deg); } 100% { transform: scale(1) rotate(0deg); } }

.anim-trophy { animation: spin-3d 3.5s linear infinite; display: inline-block; }
.anim-party { animation: party-tada 2s infinite; display: inline-block; }
.anim-clap { animation: live-clap 0.6s infinite alternate; display: inline-block; }



