/* StatusIndicator Component Styles */

.mint-status {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.mint-status__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
  position: relative;
}

/* Status colors */
.mint-status__dot--success {
  background-color: var(--mint-success);
  color: var(--mint-success);
}

.mint-status__dot--warning {
  background-color: var(--mint-warning);
  color: var(--mint-warning);
}

.mint-status__dot--error {
  background-color: var(--mint-error);
  color: var(--mint-error);
}

.mint-status__dot--info {
  background-color: var(--mint-info);
  color: var(--mint-info);
}

.mint-status__dot--muted {
  background-color: var(--text-muted);
  color: var(--text-muted);
}

.mint-status__label {
  font-size: 0.8125rem;
  color: var(--text-primary);
}

/* Pulse — expanding ring via ::before pseudo, 1.8s loop */
.mint-status__dot--pulse::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background-color: currentColor;
  animation: mint-status-pulse 1.8s ease-out infinite;
  pointer-events: none;
}

@keyframes mint-status-pulse {
  0%   { transform: scale(0.6); opacity: 0.6; }
  100% { transform: scale(1.8); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .mint-status__dot--pulse::before { animation: none; opacity: 0; }
}